:root {
    --paper: #EFE9DC;
    --paper-2: #E5DECF;
    --paper-3: #D8CFB8;
    --ink: #0A0A0A;
    --ink-2: #1F1F1F;
    --ink-soft: #4A4A4A;
    --ink-mute: #8C8678;
    --navy: #0F2B46;
    --cyan: #00C2FF;
    --cyan-soft: #5DCAFF;
    --tomato: #E84F1B;
    --line-ink: rgba(10, 10, 10, 0.12);
    --line-ink-strong: rgba(10, 10, 10, 0.25);
    --ease: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --grid: 1480px;
  }

  * { margin: 0; padding: 0; box-sizing: border-box; }
  html { background: var(--paper); }
  body {
    font-family: 'Inter Tight', system-ui, sans-serif;
    background: var(--paper);
    color: var(--ink);
    line-height: 1.4;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    cursor: none;
  }
  a, button, [data-h] { cursor: none; color: inherit; text-decoration: none; }

  body::before {
    content: '';
    position: fixed; inset: 0; pointer-events: none; z-index: 8888;
    opacity: 0.18; mix-blend-mode: multiply;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='2' /%3E%3CfeColorMatrix values='0 0 0 0 0.4  0 0 0 0 0.35  0 0 0 0 0.25  0 0 0 0.4 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' /%3E%3C/svg%3E");
  }

  /* loader */
  .loader { position: fixed; inset: 0; background: var(--paper); z-index: 99999; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 32px; transition: opacity 0.8s var(--ease), visibility 0.8s; }
  .loader.gone { opacity: 0; visibility: hidden; pointer-events: none; }
  .loader-mark { width: 100px; height: 100px; }
  .loader-mark svg { width: 100%; height: 100%; opacity: 0; animation: lfade 1s var(--ease) 0.2s forwards; }
  @keyframes lfade { to { opacity: 1; } }
  .loader-bar-wrap { width: 220px; height: 1px; background: var(--line-ink); overflow: hidden; position: relative; }
  .loader-bar { position: absolute; inset: 0; background: var(--ink); transform: scaleX(0); transform-origin: left; animation: lbar 1.4s var(--ease) 0.2s forwards; }
  @keyframes lbar { to { transform: scaleX(1); } }
  .loader-text { font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.3em; color: var(--ink-mute); display: flex; gap: 24px; }
  .loader-text strong { color: var(--ink); font-weight: 500; }

  /* cursor */
  .cursor { position: fixed; width: 14px; height: 14px; border-radius: 50%; background: var(--ink); pointer-events: none; z-index: 10000; transform: translate(-50%, -50%); transition: width .35s var(--ease), height .35s var(--ease), background .25s; mix-blend-mode: difference; will-change: transform; }
  .cursor.h { width: 80px; height: 80px; background: var(--cyan); }
  .cursor-text { position: fixed; color: var(--paper); font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.15em; pointer-events: none; z-index: 10001; transform: translate(-50%, -50%); opacity: 0; transition: opacity .3s; mix-blend-mode: difference; }
  .cursor-text.v { opacity: 1; }
  @media (max-width: 920px), (pointer: coarse) {
    body, a, button, [data-h] { cursor: auto; }
    .cursor, .cursor-text { display: none; }
  }

  /* nav */
  nav { position: fixed; top: 24px; left: 24px; right: 24px; z-index: 1000; display: flex; justify-content: space-between; align-items: flex-start; pointer-events: none; font-family: 'JetBrains Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.15em; }
  nav > * { pointer-events: auto; }
  .nav-brand { display: flex; align-items: center; gap: 12px; color: var(--ink); }
  .nav-brand-mark { width: 36px; height: 36px; border-radius: 50%; overflow: hidden; }
  .nav-brand-mark img, .nav-brand-mark svg { width: 100%; height: 100%; display: block; }
  .nav-brand-name { font-family: 'Inter Tight', sans-serif; font-weight: 700; font-size: 14px; letter-spacing: 0.1em; }
  .nav-stamp { text-align: right; color: var(--ink-mute); line-height: 1.5; }
  .nav-stamp strong { color: var(--ink); font-weight: 500; display: block; }
  .nav-links { position: fixed; top: 22px; left: 50%; transform: translateX(-50%); pointer-events: auto; display: flex; gap: 4px; background: var(--ink); padding: 6px; border-radius: 100px; color: var(--paper); }
  .nav-links a { padding: 8px 14px; border-radius: 100px; color: var(--paper); transition: background .2s, color .2s; }
  .nav-links a:hover { background: var(--paper); color: var(--ink); }
  .nav-links a.x { background: var(--cyan); color: var(--ink); }
  @media (max-width: 920px) {
    .nav-links { display: none; }
    .nav-stamp { display: none; }
  }

  /* type */
  .display { font-family: 'Inter Tight', sans-serif; font-weight: 300; letter-spacing: -0.045em; line-height: 0.88; }
  .display em, .ital { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; letter-spacing: -0.02em; }
  .label { font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--ink-mute); }
  .word { display: inline-block; overflow: hidden; vertical-align: bottom; line-height: 0.9; padding-bottom: 0.05em; padding-right: 0.18em; }
  .word > span { display: inline-block; transform: translateY(110%); transition: transform 1.1s var(--ease-out); }
  .in .word > span { transform: translateY(0); }
  .in .word:nth-child(2) > span { transition-delay: 0.05s; }
  .in .word:nth-child(3) > span { transition-delay: 0.1s; }
  .in .word:nth-child(4) > span { transition-delay: 0.15s; }
  .in .word:nth-child(5) > span { transition-delay: 0.2s; }
  .in .word:nth-child(6) > span { transition-delay: 0.25s; }

  /* chapter label — used for section nav indicators */
  .chapter {
    display: flex;
    align-items: center;
    gap: 16px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.25em;
    color: var(--ink-mute);
    margin-bottom: 32px;
  }
  .chapter strong { color: var(--ink); font-weight: 500; }
  .chapter::before {
    content: '';
    width: 32px;
    height: 1px;
    background: var(--ink);
  }
  .chapter-on-dark { color: rgba(239, 233, 220, 0.5); }
  .chapter-on-dark strong { color: var(--cyan); }
  .chapter-on-dark::before { background: var(--cyan); }

  /* HERO */
  .hero { min-height: 100vh; padding: 120px 32px 60px; position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: 1fr auto; gap: 40px; }
  @media (max-width: 920px) { .hero { grid-template-columns: 1fr; padding: 110px 20px 40px; min-height: 90vh; } }
  .hero-headline { grid-column: 1 / -1; align-self: end; font-size: clamp(56px, 12vw, 220px); color: var(--ink); z-index: 2; pointer-events: none; }
  .hero-headline em { color: var(--ink); background: var(--cyan); padding: 0 0.08em; margin-right: 0.05em; }
  .hero-3d-mount { position: absolute; top: 80px; right: -120px; width: 720px; height: 720px; z-index: 1; pointer-events: none; }
  @media (max-width: 920px) { .hero-3d-mount { right: -250px; top: 50px; width: 480px; height: 480px; opacity: 0.5; } }
  #hero-canvas { width: 100%; height: 100%; }
  .hero-meta { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(12, 1fr); gap: 32px; align-items: end; padding-top: 32px; border-top: 1px solid var(--line-ink); z-index: 2; }
  @media (max-width: 920px) { .hero-meta { grid-template-columns: 1fr; gap: 20px; } }
  .hero-meta-sub { grid-column: 1 / 6; font-size: 17px; line-height: 1.5; color: var(--ink-2); max-width: 36ch; }
  @media (max-width: 920px) { .hero-meta-sub { grid-column: 1; } }
  .hero-meta-stamps { grid-column: 6 / 10; display: flex; gap: 24px; flex-wrap: wrap; }
  @media (max-width: 920px) { .hero-meta-stamps { grid-column: 1; } }
  .stamp { display: flex; flex-direction: column; gap: 4px; }
  .stamp .v { font-family: 'Instrument Serif', serif; font-style: italic; font-size: 32px; color: var(--ink); letter-spacing: -0.02em; line-height: 1; }
  .hero-meta-cta { grid-column: 10 / -1; display: flex; flex-direction: column; gap: 12px; align-items: end; }
  @media (max-width: 920px) { .hero-meta-cta { grid-column: 1; align-items: flex-start; margin-top: 20px; } }

  .btn { display: inline-flex; align-items: center; gap: 12px; padding: 18px 28px; border-radius: 100px; font-family: 'Inter Tight', sans-serif; font-weight: 500; font-size: 14px; transition: all .4s var(--ease); will-change: transform; border: 1px solid transparent; position: relative; }
  .btn-ink { background: var(--ink); color: var(--paper); }
  .btn-ink:hover { background: var(--cyan); color: var(--ink); }
  .btn-ghost { background: transparent; color: var(--ink); border-color: var(--line-ink-strong); }
  .btn-ghost:hover { background: var(--ink); color: var(--paper); }
  .btn-cyan { background: var(--cyan); color: var(--ink); }
  .btn-cyan:hover { background: var(--ink); color: var(--paper); }
  .btn svg { transition: transform .35s var(--ease); }
  .btn:hover svg { transform: translate(4px, -4px); }

  /* ticker */
  .ticker { background: var(--ink); color: var(--paper); padding: 36px 0; overflow: hidden; position: relative; }
  .ticker-track { display: flex; gap: 60px; white-space: nowrap; animation: scrollT 50s linear infinite; will-change: transform; }
  @keyframes scrollT { from { transform: translateX(0); } to { transform: translateX(-50%); } }
  .ticker-item { font-family: 'Inter Tight', sans-serif; font-weight: 200; font-size: clamp(48px, 7vw, 112px); letter-spacing: -0.04em; display: inline-flex; align-items: center; gap: 40px; line-height: 1; }
  .ticker-item em { font-family: 'Instrument Serif', serif; font-style: italic; color: var(--cyan); }
  .ticker-dot { width: 14px; height: 14px; border-radius: 50%; background: var(--cyan); flex-shrink: 0; }

  /* manifesto */
  .manifesto { padding: 120px 32px; background: var(--paper); position: relative; }
  @media (max-width: 920px) { .manifesto { padding: 100px 20px; } }
  .manifesto-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; max-width: var(--grid); margin: 0 auto; }
  .manifesto-label { grid-column: 1 / 3; align-self: start; position: sticky; top: 100px; }
  @media (max-width: 920px) { .manifesto-label { grid-column: 1 / -1; position: static; margin-bottom: 32px; } }
  .manifesto-text { grid-column: 4 / 13; font-family: 'Inter Tight', sans-serif; font-weight: 300; font-size: clamp(28px, 4vw, 56px); line-height: 1.15; letter-spacing: -0.025em; color: var(--ink); }
  @media (max-width: 920px) { .manifesto-text { grid-column: 1 / -1; } }
  .manifesto-text em { font-family: 'Instrument Serif', serif; font-style: italic; color: var(--ink); }
  .manifesto-text p + p { margin-top: 1em; color: var(--ink-soft); }

  /* ============ PILLARS (now before Suite) ============ */
  .pillars { padding: 100px 32px; background: var(--paper); border-top: 1px solid var(--line-ink); }
  @media (max-width: 920px) { .pillars { padding: 100px 20px; } }
  .pillars-grid { max-width: var(--grid); margin: 0 auto; display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; }
  .pillars-head { grid-column: 1 / 13; display: flex; justify-content: space-between; align-items: end; border-bottom: 1px solid var(--line-ink); padding-bottom: 60px; margin-bottom: 80px; }
  @media (max-width: 920px) { .pillars-head { flex-direction: column; align-items: flex-start; gap: 24px; } }
  .pillars-headline { font-size: clamp(48px, 7vw, 120px); max-width: 14ch; }
  .pillars-headline em { color: var(--ink); }
  .pillars-row { grid-column: 1 / 13; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line-ink); border: 1px solid var(--line-ink); }
  @media (max-width: 920px) { .pillars-row { grid-template-columns: 1fr; } }

  .pillar { background: var(--paper); padding: 48px 32px; min-height: 520px; display: flex; flex-direction: column; justify-content: space-between; transition: background .5s var(--ease), color .5s var(--ease); position: relative; overflow: hidden; }
  .pillar:hover { background: var(--ink); color: var(--paper); }
  .pillar:hover .pillar-num { color: var(--cyan); }
  .pillar:hover .pillar-services { border-color: rgba(255,255,255,.15); }
  .pillar:hover .pillar-services li { color: var(--paper); opacity: .7; }
  .pillar:hover .pillar-services li::before { background: var(--cyan); }
  .pillar-shape { position: absolute; pointer-events: none; opacity: 0.15; }
  .pillar:hover .pillar-shape { opacity: 0.25; }
  .pillar-shape svg { width: 100%; height: 100%; }
  .pillar-shape [data-shard] { transition: transform 0.8s var(--ease), opacity 0.6s; transform-origin: center; transform-box: fill-box; }
  .pillar-num { font-family: 'Instrument Serif', serif; font-style: italic; font-size: 96px; line-height: 1; color: var(--ink); transition: color .5s; position: relative; z-index: 1; }
  .pillar-name { font-family: 'Inter Tight', sans-serif; font-size: 36px; font-weight: 400; letter-spacing: -0.025em; margin-top: 24px; position: relative; z-index: 1; }
  .pillar-desc { font-size: 14px; line-height: 1.5; margin-top: 16px; opacity: 0.7; position: relative; z-index: 1; }
  .pillar-services { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--line-ink); list-style: none; display: flex; flex-direction: column; gap: 8px; transition: border-color .5s; position: relative; z-index: 1; }
  .pillar-services li { font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--ink-soft); text-transform: uppercase; letter-spacing: 0.15em; display: flex; align-items: center; gap: 10px; transition: color .5s, opacity .5s; }
  .pillar-services li::before { content: ''; width: 4px; height: 4px; background: var(--ink); border-radius: 50%; transition: background .5s; }

  /* ============ SUITE V3 — Lead Story + Catalog ============ */
  .suite { background: var(--paper); position: relative; }
  .suite-intro { padding: 90px 32px 50px; max-width: var(--grid); margin: 0 auto; }
  @media (max-width: 920px) { .suite-intro { padding: 80px 20px 40px; } }
  .suite-intro-head {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 40px;
    align-items: end;
    border-bottom: 1px solid var(--line-ink);
    padding-bottom: 48px;
  }
  .suite-intro-title-block { grid-column: 1 / 9; }
  @media (max-width: 920px) { .suite-intro-title-block { grid-column: 1 / -1; } }
  .suite-intro-headline {
    font-size: clamp(48px, 7vw, 120px);
    max-width: 14ch;
  }
  .suite-intro-headline em { font-family: 'Instrument Serif', serif; font-style: italic; }
  .suite-intro-sub {
    grid-column: 9 / -1;
    font-size: 15px;
    line-height: 1.6;
    color: var(--ink-soft);
    max-width: 30ch;
  }
  @media (max-width: 920px) { .suite-intro-sub { grid-column: 1 / -1; margin-top: 32px; } }

  /* FEATURED MODULE (spotlight) */
  .featured {
    background: var(--paper-2);
    padding: 120px 32px;
    border-top: 1px solid var(--line-ink);
    border-bottom: 1px solid var(--line-ink);
    position: relative;
    overflow: hidden;
  }
  @media (max-width: 920px) { .featured { padding: 80px 20px; } }
  .featured-grid {
    max-width: var(--grid);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 7fr 5fr;
    gap: 80px;
    align-items: center;
    min-height: 70vh;
  }
  @media (max-width: 920px) { .featured-grid { grid-template-columns: 1fr; gap: 40px; min-height: auto; } }
  .featured-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    background: var(--ink);
    color: var(--paper);
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.25em;
    margin-bottom: 32px;
  }
  .featured-tag em {
    font-family: 'Instrument Serif', serif;
    font-style: italic;
    font-size: 14px;
    color: var(--cyan);
    text-transform: none;
    letter-spacing: 0;
    line-height: 1;
  }
  .featured-meta { font-family: 'JetBrains Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--ink-mute); margin-bottom: 20px; }
  .featured-title {
    font-family: 'Inter Tight', sans-serif;
    font-weight: 300;
    font-size: clamp(56px, 9vw, 156px);
    line-height: 0.88;
    letter-spacing: -0.04em;
    color: var(--ink);
  }
  .featured-title strong {
    font-family: 'Instrument Serif', serif;
    font-weight: 400;
    font-style: italic;
    display: block;
  }
  .featured-body {
    font-size: 17px;
    line-height: 1.6;
    color: var(--ink-soft);
    margin-top: 32px;
    max-width: 44ch;
  }
  .featured-pricing-row {
    display: flex;
    gap: 48px;
    margin-top: 40px;
    padding-top: 32px;
    border-top: 1px solid var(--line-ink);
    flex-wrap: wrap;
  }
  .featured-pricing-item { display: flex; flex-direction: column; gap: 4px; }
  .featured-pricing-item .ital { font-size: 36px; line-height: 1; }
  .featured-pricing-item .label { color: var(--ink-mute); }
  .featured-cta-row { margin-top: 40px; display: flex; gap: 12px; flex-wrap: wrap; }
  .featured-3d {
    aspect-ratio: 1;
    position: relative;
    width: 100%;
  }
  .featured-3d canvas { width: 100% !important; height: 100% !important; }

  /* CATALOG GRID */
  .catalog { background: var(--paper); padding: 70px 32px 90px; }
  @media (max-width: 920px) { .catalog { padding: 60px 20px 80px; } }
  .catalog-head {
    max-width: var(--grid);
    margin: 0 auto 48px;
    display: flex;
    justify-content: space-between;
    align-items: end;
    flex-wrap: wrap;
    gap: 24px;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--line-ink);
  }
  .catalog-head h3 {
    font-family: 'Inter Tight', sans-serif;
    font-weight: 300;
    font-size: clamp(28px, 3.5vw, 48px);
    letter-spacing: -0.03em;
    line-height: 1;
  }
  .catalog-head h3 em { font-family: 'Instrument Serif', serif; font-style: italic; }
  .catalog-grid {
    max-width: var(--grid);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
  }
  @media (min-width: 921px) and (max-width: 1200px) { .catalog-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 920px) { .catalog-grid { grid-template-columns: 1fr; } }

  .catalog-card {
    background: var(--paper-2);
    border: 1px solid var(--line-ink);
    padding: 24px 22px 22px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    transition: all 0.5s var(--ease);
    cursor: none;
    position: relative;
    overflow: hidden;
    min-height: 410px;
    will-change: transform;
  }
  .catalog-card:hover {
    background: var(--ink);
    color: var(--paper);
    transform: translateY(-8px);
  }
  .catalog-card:hover .catalog-card-num { color: var(--cyan); }
  .catalog-card:hover .catalog-card-arrow { background: var(--cyan); color: var(--ink); transform: rotate(-45deg); }
  .catalog-card:hover .catalog-card-divider { background: rgba(255,255,255,0.15); }
  .catalog-card:hover .catalog-card-price-label { color: var(--cyan); }
  .catalog-card-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--ink-mute);
    transition: color 0.5s;
  }
  .catalog-card-3d {
    height: 150px;
    margin: 0 -8px;
    position: relative;
  }
  .catalog-card-3d canvas { width: 100% !important; height: 100% !important; }
  .catalog-card-title {
    font-family: 'Inter Tight', sans-serif;
    font-weight: 300;
    font-size: 36px;
    letter-spacing: -0.025em;
    line-height: 0.95;
  }
  .catalog-card-title strong {
    font-family: 'Instrument Serif', serif;
    font-style: italic;
    font-weight: 400;
    display: block;
  }
  .catalog-card-desc {
    font-size: 13px;
    line-height: 1.55;
    opacity: 0.75;
    max-width: 36ch;
  }
  .catalog-card-divider { height: 1px; background: var(--line-ink); transition: background 0.5s; margin-top: auto; }
  .catalog-card-foot {
    display: flex;
    justify-content: space-between;
    align-items: end;
    padding-top: 20px;
  }
  .catalog-card-price-block { display: flex; flex-direction: column; gap: 2px; }
  .catalog-card-price-block .ital { font-size: 22px; line-height: 1; }
  .catalog-card-price-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--ink-mute);
    transition: color 0.5s;
  }
  .catalog-card-arrow {
    width: 44px; height: 44px;
    border: 1px solid currentColor;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: currentColor;
    transition: all 0.5s var(--ease);
  }

  /* AUDIT WEDGE */
  .audit-wedge { background: var(--cyan); color: var(--ink); padding: 120px 32px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
  .audit-wedge-grid { max-width: var(--grid); margin: 0 auto; display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; align-items: center; }
  .audit-wedge-num { grid-column: 1 / 3; font-family: 'Instrument Serif', serif; font-style: italic; font-size: 88px; line-height: 1; }
  @media (max-width: 920px) { .audit-wedge-num { grid-column: 1 / -1; font-size: 56px; } }
  .audit-wedge-title { grid-column: 3 / 9; font-family: 'Inter Tight', sans-serif; font-weight: 300; font-size: clamp(28px, 3.5vw, 48px); letter-spacing: -0.025em; line-height: 1.05; }
  @media (max-width: 920px) { .audit-wedge-title { grid-column: 1 / -1; } }
  .audit-wedge-title em { font-family: 'Instrument Serif', serif; font-style: italic; }
  .audit-wedge-cta { grid-column: 9 / -1; text-align: right; }
  @media (max-width: 920px) { .audit-wedge-cta { grid-column: 1 / -1; text-align: left; } }

  /* industries */
  .industries { background: var(--ink); color: var(--paper); padding: 120px 32px; }
  @media (max-width: 920px) { .industries { padding: 100px 20px; } }
  .industries-grid { max-width: var(--grid); margin: 0 auto; display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; }
  .industries-head { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: end; margin-bottom: 100px; }
  @media (max-width: 920px) { .industries-head { flex-direction: column; align-items: flex-start; gap: 24px; margin-bottom: 60px; } }
  .industries-head .label { color: var(--paper); opacity: 0.5; }
  .industries-head .display { color: var(--paper); font-size: clamp(48px, 7vw, 120px); max-width: 14ch; }
  .industries-head em { color: var(--cyan); }
  .industry { border: 1px solid rgba(255,255,255,0.12); padding: 48px 32px; min-height: 360px; display: flex; flex-direction: column; justify-content: space-between; transition: all .5s var(--ease); position: relative; overflow: hidden; }
  .industry:hover { background: var(--paper); color: var(--ink); transform: translateY(-6px); }
  .industry-1 { grid-column: 1 / 8; min-height: 480px; }
  .industry-2 { grid-column: 8 / -1; min-height: 480px; }
  .industry-3 { grid-column: 1 / 5; }
  .industry-4 { grid-column: 5 / 9; }
  .industry-5 { grid-column: 9 / -1; }
  @media (max-width: 920px) { .industry-1, .industry-2, .industry-3, .industry-4, .industry-5 { grid-column: 1 / -1; min-height: 320px; } }
  .industry-num { font-family: 'JetBrains Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.15em; color: var(--cyan); }
  .industry:hover .industry-num { color: var(--ink); }
  .industry-name { font-family: 'Inter Tight', sans-serif; font-weight: 300; font-size: clamp(32px, 4vw, 56px); line-height: 0.95; letter-spacing: -0.025em; margin-top: auto; }
  .industry-1 .industry-name { font-size: clamp(48px, 6vw, 88px); }
  .industry-name em { font-family: 'Instrument Serif', serif; font-style: italic; color: var(--cyan); }
  .industry:hover .industry-name em { color: var(--ink); }
  .industry-desc { font-size: 14px; line-height: 1.5; margin-top: 20px; max-width: 38ch; opacity: 0.7; }

  /* dsgvo */
  .dsgvo { background: var(--paper); color: var(--ink); padding: 140px 32px; position: relative; overflow: hidden; }
  @media (max-width: 920px) { .dsgvo { padding: 120px 20px; } }
  .dsgvo-grid { max-width: var(--grid); margin: 0 auto; display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; align-items: end; position: relative; z-index: 2; }
  .dsgvo-3d { position: absolute; top: 50%; right: -100px; transform: translateY(-50%); width: 600px; height: 600px; z-index: 1; pointer-events: none; opacity: 0.6; }
  @media (max-width: 920px) { .dsgvo-3d { display: none; } }
  .dsgvo-3d canvas { width: 100% !important; height: 100% !important; }
  .dsgvo-stat-block { grid-column: 1 / 8; }
  @media (max-width: 920px) { .dsgvo-stat-block { grid-column: 1 / -1; } }
  .dsgvo-stat { font-family: 'Inter Tight', sans-serif; font-weight: 200; font-size: clamp(180px, 30vw, 480px); line-height: 0.78; letter-spacing: -0.07em; color: var(--ink); }
  .dsgvo-stat em { font-family: 'Instrument Serif', serif; font-style: italic; color: var(--cyan); font-weight: 400; font-size: 0.5em; vertical-align: top; line-height: 1; display: inline-block; }
  .dsgvo-cap { font-family: 'Instrument Serif', serif; font-style: italic; font-size: clamp(20px, 2.2vw, 32px); line-height: 1.25; color: var(--ink); margin-top: 32px; max-width: 28ch; }
  .dsgvo-source { display: block; margin-top: 16px; color: var(--ink-mute); }
  .dsgvo-text { grid-column: 8 / -1; padding-bottom: 60px; }
  @media (max-width: 920px) { .dsgvo-text { grid-column: 1 / -1; padding-bottom: 0; margin-top: 60px; } }
  .dsgvo-label { margin-bottom: 32px; }
  .dsgvo-body { font-size: 17px; line-height: 1.65; color: var(--ink-soft); margin-bottom: 24px; }
  .dsgvo-body strong { color: var(--ink); font-weight: 600; }
  .dsgvo-pillars { margin-top: 40px; border-top: 1px solid var(--line-ink); padding-top: 24px; }
  .dsgvo-pillar { padding: 20px 0; border-bottom: 1px solid var(--line-ink); display: grid; grid-template-columns: 1fr 2fr; gap: 24px; }
  .dsgvo-pillar-tag { font-family: 'JetBrains Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.15em; color: var(--ink); }
  .dsgvo-pillar-body { font-size: 14px; color: var(--ink-soft); line-height: 1.5; }

  /* process */
  .process { padding: 120px 32px; background: var(--paper-2); position: relative; overflow: hidden; }
  @media (max-width: 920px) { .process { padding: 100px 20px; } }
  .process-grid { max-width: var(--grid); margin: 0 auto; display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; }
  .process-head { grid-column: 1 / 9; margin-bottom: 80px; }
  @media (max-width: 920px) { .process-head { grid-column: 1 / -1; margin-bottom: 60px; } }
  .process-head .display { font-size: clamp(48px, 7vw, 120px); max-width: 12ch; margin-top: 24px; }
  .process-3d { grid-column: 9 / 13; margin-bottom: 80px; min-height: 280px; align-self: stretch; }
  .process-3d canvas { width: 100% !important; height: 100% !important; display: block; }
  @media (max-width: 920px) { .process-3d { display: none; } }
  .process-step { grid-column: span 4; border-top: 1px solid var(--line-ink-strong); padding-top: 40px; padding-right: 32px; display: flex; flex-direction: column; gap: 24px; min-height: 360px; }
  @media (max-width: 920px) { .process-step { grid-column: 1 / -1; padding-right: 0; min-height: auto; } }
  .process-step-num { font-family: 'Instrument Serif', serif; font-style: italic; font-size: 88px; line-height: 1; color: var(--ink); }
  .process-step-title { font-family: 'Inter Tight', sans-serif; font-size: 32px; font-weight: 400; letter-spacing: -0.02em; }
  .process-step-desc { font-size: 15px; line-height: 1.55; color: var(--ink-soft); margin-top: auto; }
  .process-step-meta { margin-top: 16px; color: var(--ink); font-weight: 500; }

  /* founders */
  .founders { background: var(--paper-3); color: var(--ink); padding: 120px 32px; }
  @media (max-width: 920px) { .founders { padding: 100px 20px; } }
  .founders-grid { max-width: var(--grid); margin: 0 auto; display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; }
  .founders-head { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; margin-bottom: 100px; }
  .founders-head-title { grid-column: 1 / 8; font-size: clamp(48px, 7vw, 120px); max-width: 12ch; }
  @media (max-width: 920px) { .founders-head-title { grid-column: 1 / -1; } }
  .founders-head em { font-family: 'Instrument Serif', serif; font-style: italic; }
  .founders-head-story { grid-column: 8 / -1; font-family: 'Instrument Serif', serif; font-style: italic; font-size: clamp(18px, 1.6vw, 22px); line-height: 1.5; color: var(--ink); align-self: end; }
  @media (max-width: 920px) { .founders-head-story { grid-column: 1 / -1; margin-top: 32px; } }
  .founder { grid-column: span 6; display: flex; flex-direction: column; gap: 32px; }
  @media (max-width: 920px) { .founder { grid-column: 1 / -1; } }
  .founder-portrait { aspect-ratio: 4/5; background: var(--ink); color: var(--paper); overflow: hidden; position: relative; display: flex; align-items: flex-end; padding: 32px; transition: filter 0.6s var(--ease); }
  .founder-portrait::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 30% 30%, rgba(0, 194, 255, 0.25), transparent 60%), radial-gradient(circle at 70% 70%, rgba(232, 79, 27, 0.18), transparent 60%); }
  .founder-portrait-letter { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-family: 'Instrument Serif', serif; font-style: italic; font-size: 360px; line-height: 1; color: var(--paper); opacity: 0.95; z-index: 1; transition: transform 0.6s var(--ease), letter-spacing 0.6s; }
  .founder-portrait:hover .founder-portrait-letter { transform: translate(-50%, -50%) scale(1.1); letter-spacing: -0.05em; }
  .founder-portrait:hover { filter: hue-rotate(15deg); }
  .founder-portrait-stamp { position: relative; z-index: 2; font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--paper); opacity: 0.8; }
  .founder-name { font-family: 'Inter Tight', sans-serif; font-weight: 400; font-size: 44px; letter-spacing: -0.025em; line-height: 1; }
  .founder-name em { font-family: 'Instrument Serif', serif; font-style: italic; }
  .founder-role { font-family: 'JetBrains Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--ink-soft); margin-top: 8px; }
  .founder-bio { font-size: 16px; line-height: 1.6; color: var(--ink-soft); margin-top: 16px; }
  .founder-skills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 20px; }
  .founder-skill { padding: 6px 12px; border: 1px solid var(--line-ink-strong); border-radius: 100px; font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--ink); }

  /* cases */
  .cases { background: var(--ink); color: var(--paper); padding: 120px 32px; }
  @media (max-width: 920px) { .cases { padding: 100px 20px; } }
  .cases-grid { max-width: var(--grid); margin: 0 auto; display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; }
  .cases-head { grid-column: 1 / -1; margin-bottom: 100px; }
  .cases-head .label { color: var(--paper); opacity: 0.5; }
  .cases-head .display { color: var(--paper); font-size: clamp(48px, 7vw, 120px); max-width: 14ch; margin-top: 24px; }
  .cases-head em { color: var(--cyan); }
  .case { grid-column: span 4; display: flex; flex-direction: column; border-top: 1px solid rgba(255,255,255,0.18); padding-top: 32px; transition: padding-top .5s; }
  @media (max-width: 920px) { .case { grid-column: 1 / -1; } }
  .case:hover { padding-top: 16px; }
  .case-stat { font-family: 'Inter Tight', sans-serif; font-weight: 200; font-size: clamp(96px, 12vw, 200px); line-height: 0.85; letter-spacing: -0.05em; color: var(--paper); }
  .case-stat em { font-family: 'Instrument Serif', serif; font-style: italic; color: var(--cyan); font-weight: 400; }
  .case-title { font-family: 'Instrument Serif', serif; font-style: italic; font-size: 24px; margin-top: 24px; line-height: 1.2; }
  .case-body { font-size: 14px; line-height: 1.55; margin-top: 16px; color: rgba(239, 233, 220, 0.7); margin-bottom: 24px; }
  .case-tag { font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--cyan); padding-top: 24px; margin-top: auto; border-top: 1px solid rgba(255,255,255,0.15); }

  /* stack */
  .stack { background: var(--paper); color: var(--ink); padding: 120px 32px; border-top: 1px solid var(--line-ink); }
  @media (max-width: 920px) { .stack { padding: 100px 20px; } }
  .stack-grid { max-width: var(--grid); margin: 0 auto; }
  .stack-head { display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; margin-bottom: 80px; }
  .stack-head-title { grid-column: 1 / 9; font-size: clamp(48px, 7vw, 120px); max-width: 14ch; }
  @media (max-width: 920px) { .stack-head-title { grid-column: 1 / -1; } }
  .stack-head-title em { font-family: 'Instrument Serif', serif; font-style: italic; }
  .stack-list { border-top: 1px solid var(--line-ink-strong); }
  .stack-row { display: grid; grid-template-columns: 60px 1fr 1fr 80px; gap: 24px; padding: 28px 0; border-bottom: 1px solid var(--line-ink); align-items: center; transition: padding-left .4s var(--ease), background .4s; cursor: none; }
  .stack-row:hover { padding-left: 24px; background: var(--paper-2); }
  .stack-row-num { font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--ink-mute); letter-spacing: 0.15em; }
  .stack-row-name { font-family: 'Inter Tight', sans-serif; font-weight: 400; font-size: clamp(28px, 3vw, 48px); letter-spacing: -0.025em; color: var(--ink); }
  .stack-row-name em { font-family: 'Instrument Serif', serif; font-style: italic; }
  .stack-row-loc { font-family: 'JetBrains Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--ink-soft); }
  .stack-row-flag { width: 28px; height: 18px; background: linear-gradient(180deg, #000 33%, #DD0000 33%, #DD0000 66%, #FFCC00 66%); border-radius: 2px; justify-self: end; }
  .stack-row-flag.eu { background: #003399; color: #FFCC00; display: flex; align-items: center; justify-content: center; font-size: 12px; line-height: 1; }

  /* final */
  .final { padding: 140px 32px 110px; background: var(--cyan); color: var(--ink); text-align: center; position: relative; overflow: hidden; }
  @media (max-width: 920px) { .final { padding: 120px 20px; } }
  .final-inner { position: relative; z-index: 2; max-width: var(--grid); margin: 0 auto; }
  .final h2 { font-family: 'Inter Tight', sans-serif; font-weight: 200; font-size: clamp(56px, 11vw, 200px); line-height: 0.85; letter-spacing: -0.05em; margin: 32px auto; max-width: 12ch; }
  .final h2 em { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; }
  .final p { font-family: 'Instrument Serif', serif; font-style: italic; font-size: clamp(20px, 2.2vw, 28px); line-height: 1.5; max-width: 40ch; margin: 0 auto 48px; color: var(--ink); }
  .final-meta { display: flex; gap: 32px; justify-content: center; flex-wrap: wrap; margin-top: 60px; font-family: 'JetBrains Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.2em; }
  .final-meta div::before { content: '◆ '; color: var(--ink); }

  /* contact form */
  .contact-details { display: flex; gap: 56px; justify-content: center; flex-wrap: wrap; max-width: 640px; margin: 8px auto 0; text-align: left; }
  .contact-details .cd-item { display: flex; flex-direction: column; gap: 8px; }
  .contact-details .cd-label { font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.15em; color: var(--ink); opacity: 0.6; }
  .contact-details .cd-val { font-family: 'Inter Tight', sans-serif; font-size: 18px; font-weight: 500; color: var(--ink); text-decoration: none; line-height: 1.3; }
  .contact-details a.cd-val:hover { text-decoration: underline; }
  @media (max-width: 920px) { .contact-details { gap: 24px; } }
  .contact-form { max-width: 640px; margin: 48px auto 0; text-align: left; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  .contact-field { display: flex; flex-direction: column; gap: 8px; }
  .contact-field.full { grid-column: 1 / -1; }
  .contact-field label { font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.15em; color: var(--ink); }
  .contact-field input, .contact-field select, .contact-field textarea {
    font-family: 'Inter Tight', sans-serif; font-size: 15px; padding: 14px 16px;
    background: var(--paper); border: 1px solid var(--ink); border-radius: 4px; color: var(--ink); width: 100%;
    cursor: text; transition: box-shadow .25s var(--ease);
  }
  .contact-field select { cursor: pointer; }
  .contact-field input:focus, .contact-field select:focus, .contact-field textarea:focus { outline: none; box-shadow: 0 0 0 3px rgba(10,10,10,0.18); }
  .contact-field textarea { resize: vertical; min-height: 104px; }
  .contact-form .contact-submit { grid-column: 1 / -1; justify-self: start; cursor: none; }
  .contact-note { grid-column: 1 / -1; font-family: 'JetBrains Mono', monospace; font-size: 10px; letter-spacing: 0.05em; color: var(--ink); opacity: 0.65; line-height: 1.5; }
  @media (max-width: 920px) { .contact-form { grid-template-columns: 1fr; } }

  /* footer */
  footer { background: var(--ink); color: var(--paper); padding: 100px 32px 40px; }
  .footer-grid { max-width: var(--grid); margin: 0 auto; }
  .footer-top { display: grid; grid-template-columns: repeat(12, 1fr); gap: 40px; margin-bottom: 100px; border-bottom: 1px solid rgba(255,255,255,0.15); padding-bottom: 80px; }
  .footer-brand-block { grid-column: 1 / 7; }
  @media (max-width: 920px) { .footer-brand-block { grid-column: 1 / -1; } }
  .footer-tagline { font-family: 'Inter Tight', sans-serif; font-weight: 200; font-size: clamp(40px, 5vw, 88px); line-height: 0.95; letter-spacing: -0.03em; margin-top: 24px; max-width: 14ch; }
  .footer-tagline em { font-family: 'Instrument Serif', serif; font-style: italic; color: var(--cyan); }
  .footer-cta-block { grid-column: 9 / -1; align-self: end; text-align: right; }
  @media (max-width: 920px) { .footer-cta-block { grid-column: 1 / -1; text-align: left; margin-top: 32px; } }
  .footer-cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; margin-bottom: 60px; }
  @media (max-width: 920px) { .footer-cols { grid-template-columns: 1fr 1fr; gap: 32px; } }
  .footer-col h5 { font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--cyan); margin-bottom: 24px; }
  .footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 12px; }
  .footer-col a { font-size: 14px; color: rgba(239, 233, 220, 0.7); transition: color .2s; }
  .footer-col a:hover { color: var(--cyan); }
  .footer-bottom { border-top: 1px solid rgba(255,255,255,0.15); padding-top: 32px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 16px; font-family: 'JetBrains Mono', monospace; font-size: 11px; color: rgba(239, 233, 220, 0.4); text-transform: uppercase; letter-spacing: 0.15em; }
  .footer-bottom-links a { color: rgba(239, 233, 220, 0.6); margin-left: 24px; }
  .footer-bottom-links a:hover { color: var(--cyan); }

  /* reveal */
  .reveal { opacity: 0; transform: translateY(40px); transition: opacity 1.1s var(--ease-out), transform 1.1s var(--ease-out); }
  .reveal.in { opacity: 1; transform: translateY(0); }
  .reveal-d1 { transition-delay: 0.1s; }
  .reveal-d2 { transition-delay: 0.2s; }
  .reveal-d3 { transition-delay: 0.3s; }
  @media (prefers-reduced-motion) { .reveal { opacity: 1; transform: none; } .word > span { transform: none; } }

  /* language toggle */
  .nav-right { display: flex; gap: 14px; align-items: flex-start; }
  .lang-toggle { display: inline-flex; gap: 2px; background: var(--ink); border-radius: 100px; padding: 4px; }
  .lang-toggle button { padding: 5px 11px; border-radius: 100px; border: none; background: transparent; color: var(--paper); cursor: none; font-family: 'JetBrains Mono', monospace; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; transition: background .2s, color .2s; }
  .lang-toggle button.active { background: var(--cyan); color: var(--ink); }

/* native anchor navigation: smooth + clear the fixed nav */
html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 96px; }

/* active nav tab = current page */
.nav-links a.active { background: var(--cyan); color: var(--ink); }

/* pillars header — supporting text fills the right side */
.pillars-head-aside { display: flex; flex-direction: column; align-items: flex-end; text-align: right; gap: 20px; max-width: 34ch; align-self: end; }
.pillars-head-aside p { font-size: 15px; line-height: 1.6; color: var(--ink-soft); }
.pillars-head-aside p em { font-family: 'Instrument Serif', serif; font-style: italic; }
@media (max-width: 920px) { .pillars-head-aside { align-items: flex-start; text-align: left; max-width: 100%; } }

.module-tag { font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.16em; color: var(--ink-mute); transition: color .4s; }
.module-card h4 { font-family: 'Inter Tight', sans-serif; font-weight: 400; font-size: 25px; letter-spacing: -0.02em; line-height: 1; }
.module-card h4 em { font-family: 'Instrument Serif', serif; font-style: italic; }
.module-card p { font-size: 13px; line-height: 1.5; opacity: 0.82; flex-grow: 1; }
.module-price { font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: 0.08em; color: var(--ink-mute); transition: color .4s; }

/* contact form — consent + success / error (lead-capture backend, 4 Jun) */
.contact-consent{ align-items:flex-start; }
.consent-label{ display:flex; gap:10px; align-items:flex-start; font-size:13px; line-height:1.5; color:var(--ink-soft); cursor:pointer; }
.consent-label input[type="checkbox"]{ margin-top:3px; width:16px; height:16px; flex:0 0 auto; accent-color:var(--ink); }
.consent-label a{ color:var(--ink); text-decoration:underline; }
.contact-success{ padding:8px 0; }
.contact-success h3{ font-family:'Instrument Serif',serif; font-style:italic; font-weight:400; font-size:clamp(28px,4vw,44px); margin:0 0 12px; }
.contact-success p{ font-size:16px; line-height:1.6; color:var(--ink-soft); max-width:42ch; }
.contact-error{ color:#B23A1B; font-size:14px; margin-top:14px; }

/* ============================================================
   MOBILE / TABLET OPTIMISATION (appended last — wins the cascade;
   desktop >900px untouched). Compresses the long editorial layout
   so phones aren't an endless scroll. 4 Jun 2026.
   ============================================================ */
@media (max-width: 900px) {
  /* cards become content-height instead of fixed-tall (biggest win) */
  .pillar { min-height: 0; padding: 30px 24px; }
  .catalog-card { min-height: 0; padding: 26px 22px; }
  .catalog-card-3d { height: 150px; }
  .industry, .industry-1, .industry-2, .industry-3, .industry-4, .industry-5 { min-height: 0; padding: 30px 24px; }
  .featured-3d { max-width: 300px; margin: 0 auto; }
  .pillar-services { margin-top: 18px; padding-top: 16px; }
  .pillar-num { font-size: 60px; }

  /* slash the huge section vertical padding (was 100-140px) */
  .manifesto, .pillars, .industries, .dsgvo,
  .process, .founders, .cases, .stack { padding-top: 60px; padding-bottom: 60px; }
  .featured, .catalog, .audit-wedge { padding-top: 52px; padding-bottom: 52px; }
  .suite-intro { padding-top: 60px; padding-bottom: 24px; }
  .final { padding-top: 80px; padding-bottom: 80px; }
  footer { padding-top: 60px; }

  /* tighten section-header gaps */
  .industries-head, .process-head, .cases-head { margin-bottom: 40px; }
  .founders-head { margin-bottom: 52px; }
  .pillars-head { padding-bottom: 32px; margin-bottom: 32px; }
}

@media (max-width: 600px) {
  /* scale oversized display type down for phones */
  .hero { min-height: auto; padding-top: 100px; padding-bottom: 36px; }
  .hero-headline { font-size: clamp(38px, 12.5vw, 56px); }
  .pillars-headline, .suite-intro-headline,
  .industries-head .display, .founders-head-title,
  .stack-head-title, .cases-head .display,
  .process-head .display { font-size: clamp(30px, 8.5vw, 44px); }
  .featured-title { font-size: clamp(40px, 13vw, 60px); }
  .manifesto-text { font-size: clamp(23px, 6vw, 32px); }
  .dsgvo-stat { font-size: clamp(110px, 38vw, 160px); }
  .case-stat { font-size: clamp(68px, 22vw, 100px); }
  .final h2 { font-size: clamp(42px, 13vw, 60px); }
}

/* MOBILE pass 2 — compact the two monster sections (products + pillars).
   Keeps all content + the 3D scenes (just smaller). 4 Jun 2026. */
@media (max-width: 900px) {
  /* product catalog: shrink 3D + tighten each card (was ~500px each) */
  .catalog-card-3d { height: 92px; margin: 0 -6px; }
  .catalog-card { gap: 14px; padding: 20px 18px; }
  .catalog-card-title { font-size: 27px; }
  .catalog-card-desc { font-size: 12px; line-height: 1.5; }
  /* featured spotlight: smaller 3D, tighter */
  .featured { padding-top: 44px; padding-bottom: 44px; }
  .featured-3d { max-width: 200px; }
  .featured-grid { gap: 22px; }
  .featured-body { font-size: 15px; margin-top: 18px; }
  .featured-pricing-row { gap: 28px; margin-top: 24px; padding-top: 20px; }
  /* pillars: smaller number, tighter */
  .pillar { padding: 24px 20px; }
  .pillar-num { font-size: 44px; }
  .pillar-name { font-size: 28px; margin-top: 12px; }
  .pillar-desc { margin-top: 10px; }
  .pillar-services { margin-top: 14px; padding-top: 12px; gap: 6px; }
  /* a touch tighter on the big sections */
  .pillars, .suite-intro, .catalog, .dsgvo, .process, .founders, .cases, .stack { padding-top: 48px; padding-bottom: 48px; }
}

/* MOBILE pass 3 — quadrant pillars (+tap), 2-up products (+see-all),
   compact featured + process. 4 Jun 2026. Desktop (>900px) untouched. */
@media (max-width: 900px) {
  /* PILLARS -> 2x2 quadrant, compact (detail list dropped on mobile) */
  .pillars-row { grid-template-columns: 1fr 1fr; }
  .pillar { padding: 22px 15px; }
  .pillar-num { font-size: 34px; }
  .pillar-name { font-size: 19px; margin-top: 6px; }
  .pillar-desc { font-size: 11.5px; line-height: 1.45; margin-top: 8px; }
  .pillar-services { display: none; }
  .pillar-shape { width: 58px !important; height: 58px !important; top: 14px !important; right: 12px !important; }
  .pillar.tapped { background: var(--ink); color: var(--paper); }
  .pillar.tapped .pillar-num { color: var(--cyan); }
  .pillar.tapped .pillar-desc { opacity: 0.78; }

  /* PRODUCTS -> compact 2-up grid (JS shows 4 + "see all") */
  .catalog-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .catalog-card { padding: 15px 13px; gap: 9px; min-height: 0; }
  .catalog-card-num { font-size: 9px; }
  .catalog-card-3d { height: 66px; margin: 0; }
  .catalog-card-title { font-size: 17px; line-height: 1; }
  .catalog-card-desc { display: none; }
  .catalog-card-foot { padding-top: 10px; }
  .catalog-card-price-block .ital { font-size: 15px; }
  .catalog-card-price-label { font-size: 8px; }
  .catalog-card-arrow { width: 30px; height: 30px; }
  .catalog-more { display: block; width: 100%; margin-top: 14px; padding: 13px 16px;
    background: transparent; border: 1px solid rgba(10,10,10,0.28); border-radius: 100px;
    font-family: 'Inter Tight', sans-serif; font-weight: 500; font-size: 13px;
    color: var(--ink); cursor: pointer; transition: background .2s, color .2s; }
  .catalog-more:active { background: var(--ink); color: var(--paper); }

  /* FEATURED spotlight -> compact */
  .featured-3d { max-width: 148px; }
  .featured-grid { gap: 14px; }
  .featured-title { font-size: clamp(36px, 12vw, 50px); }
  .featured-body { font-size: 14px; margin-top: 14px; max-width: none; }
  .featured-tag { margin-bottom: 16px; }
  .featured-pricing-row { gap: 24px; margin-top: 20px; padding-top: 18px; }

  /* PROCESS -> tight 3-step sequence (reads as one block) */
  .process-grid { gap: 4px; }
  .process-step { padding-top: 16px; gap: 6px; }
  .process-step-num { font-size: 36px; }
  .process-step-title { font-size: 20px; }
  .process-step-desc { font-size: 13px; margin-top: 4px; }
  .process-head { margin-bottom: 24px; }
}

/* MOBILE — kill the horizontal slide: clip the bleeding hero 3D + belt-and-suspenders */
@media (max-width: 900px) {
  .hero { overflow: hidden; }
}
html { overflow-x: hidden; }