:root { box-sizing: border-box; padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }
  html{ scroll-padding-top: env(safe-area-inset-top, 0px); }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg: #0e0e11; --ink: #f2efe9; --ink-dim: #a29d95;
      --line: rgba(242,239,233,0.14); --grain-opacity: 0.05; --glow-opacity: 1; --surface: #14141a;
    }
  }
  :root[data-theme="dark"]{
    --bg: #0e0e11; --ink: #f2efe9; --ink-dim: #a29d95;
    --line: rgba(242,239,233,0.14); --grain-opacity: 0.05; --glow-opacity: 1; --surface: #14141a;
  }

  *{ margin:0; padding:0; box-sizing:border-box; }
  html{ background: var(--bg); }
  body{
    background: var(--bg);
    color: var(--ink);
    font-family: 'Geist', ui-sans-serif, system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
  }
  ::selection{ background: var(--accent); color: var(--on-accent); }
  a{ color: inherit; text-decoration: none; }
  :focus-visible{ outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 6px; }

  .glow{
    position: fixed; inset: 0; pointer-events: none; z-index: var(--z-canvas);
    opacity: var(--glow-opacity);
    background:
      radial-gradient(60% 50% at 10% 8%, color-mix(in srgb, var(--brand-a) 40%, transparent), transparent 70%),
      radial-gradient(55% 45% at 94% 94%, color-mix(in srgb, var(--brand-b) 32%, transparent), transparent 70%);
  }
  #bg-canvas{
    transition: opacity .8s cubic-bezier(.16,1,.3,1);
    position: fixed; inset: 0; width: 100%; height: 100%;
    z-index: var(--z-canvas);
  }
  #bg-canvas.is-hidden{ opacity: 0; }
  .grain{
    position: fixed; inset: 0; pointer-events: none; z-index: var(--z-grain);
    opacity: var(--grain-opacity);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    mix-blend-mode: overlay;
  }

  .nav{
    position: relative; z-index: var(--z-nav);
    height: var(--nav-h);
    max-width: 1400px; margin: 0 auto;
    padding: 0 clamp(1.25rem, 4vw, 3rem);
    display: flex; align-items: center; justify-content: space-between;
    white-space: nowrap;
  }
  .wordmark{ display: block; color: var(--ink); line-height: 0; }
  .wordmark svg{ display: block; height: 26px; width: auto; }
  .nav-links{ display: flex; align-items: center; gap: 2.2rem; font-size: 0.9rem; color: var(--ink-dim); }
  .nav-links a{ transition: color .3s cubic-bezier(.16,1,.3,1); }
  .nav-links a:hover{ color: var(--ink); }
  .nav-cta{
    padding: 0.55rem 1.1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-pill);
    color: var(--ink) !important;
    transition: background .3s cubic-bezier(.16,1,.3,1), border-color .3s cubic-bezier(.16,1,.3,1) !important;
  }
  .nav-cta:hover{ border-color: var(--ink); }

  .hero{
    position: relative; z-index: var(--z-content);
    min-height: calc(100dvh - var(--nav-h));
    max-width: 1400px; margin: 0 auto;
    padding: 2rem clamp(1.25rem, 4vw, 3rem) 3rem;
    display: grid;
    grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: center;
  }
  h1{
    font-weight: 600;
    font-size: clamp(2.5rem, 4.7vw, 4.6rem);
    line-height: 1.04;
    letter-spacing: -0.035em;
  }
  h1 .line{ display: block; overflow: hidden; padding-bottom: 0.12em; margin-bottom: -0.12em; }
  h1 .line > span{ display: inline-block; }
  h1 .dim{ color: var(--ink-dim); font-weight: 400; }
  .sub{
    margin-top: 1.6rem;
    max-width: 46ch;
    font-size: 1.05rem; line-height: 1.6;
    color: var(--ink-dim);
  }
  .cta-row{ margin-top: 2.2rem; display: flex; align-items: center; gap: 1.8rem; flex-wrap: wrap; }
  .btn-primary{
    display: inline-flex; align-items: center; gap: 0.6rem;
    padding: 1rem 1.6rem;
    background: var(--accent); color: var(--on-accent);
    border-radius: var(--radius-pill);
    font-size: 0.95rem; font-weight: 500;
    white-space: nowrap;
    transition: background .3s cubic-bezier(.16,1,.3,1), transform .2s cubic-bezier(.16,1,.3,1);
  }
  .btn-primary:hover{ background: var(--accent-press); }
  .btn-primary:active{ transform: scale(0.98); }
  .link-secondary{
    font-size: 0.95rem; color: var(--ink);
    padding-bottom: 3px;
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
    transition: border-color .3s cubic-bezier(.16,1,.3,1);
  }
  .link-secondary:hover{ border-color: var(--ink); }

  .tiles{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    align-items: start;
  }
  .tile-col{ display: grid; gap: 1rem; }
  .tile-col.offset{ margin-top: 3.5rem; }
  .tile figure{ margin: 0; }
  .tile .frame{
    overflow: hidden;
    border-radius: var(--radius-tile);
    background: var(--line);
  }
  .tile img{ display: block; width: 100%; height: 100%; object-fit: cover; will-change: transform; }
  .slot{
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    color: var(--ink-dim); font-size: 0.8rem;
    background: var(--line);
    will-change: transform;
  }
  .tile.tall .frame{ aspect-ratio: 3 / 4.6; }
  .tile.wide .frame{ aspect-ratio: 4 / 3; }
  .tile.square .frame{ aspect-ratio: 1 / 1; }
  .tile figcaption{ margin-top: 0.6rem; font-size: 0.82rem; color: var(--ink-dim); }

  .js:not(.reduce) h1 .line > span{ transform: translateY(112%); }
  .js:not(.reduce) [data-reveal]{ opacity: 0; transform: translateY(18px); }
  .js:not(.reduce) .tile{ opacity: 0; transform: translateY(40px); }

  html.lenis, html.lenis body{ height: auto; }
  .lenis.lenis-smooth{ scroll-behavior: auto !important; }

  .trust{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 4rem clamp(1.25rem, 4vw, 3rem) 6rem;
  }
  .stats{ display: flex; flex-wrap: wrap; gap: 2.5rem clamp(3rem, 7vw, 7rem); }
  .stat b{ display: block; font-weight: 600; font-size: clamp(2.8rem, 5.2vw, 4.4rem); letter-spacing: -0.04em; line-height: 1; }
  .stat span{ display: block; margin-top: 0.7rem; color: var(--ink-dim); font-size: 0.95rem; }
  .products-label{ margin-top: 4.5rem; color: var(--ink-dim); font-size: 0.95rem; }
  .marquee{
    margin-top: 1.2rem; overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  }
  .marquee-track{ display: flex; width: max-content; animation: marquee 40s linear infinite; }
  .marquee-group{ display: flex; flex-shrink: 0; gap: clamp(2.5rem, 5vw, 4.5rem); padding-right: clamp(2.5rem, 5vw, 4.5rem); }
  .marquee-group span{ font-size: clamp(1.7rem, 3.2vw, 2.6rem); font-weight: 500; letter-spacing: -0.03em; white-space: nowrap; }
  .marquee:hover .marquee-track{ animation-play-state: paused; }
  @keyframes marquee{ to{ transform: translateX(-50%); } }
  @media (prefers-reduced-motion: reduce){
    .marquee-track{ animation: none; width: auto; flex-wrap: wrap; }
    .marquee-group[aria-hidden="true"]{ display: none; }
    .marquee{ -webkit-mask-image: none; mask-image: none; }
  }

  .work{ position: relative; z-index: var(--z-content); }
  .work-head{ max-width: 1400px; margin: 0 auto; padding: 2rem clamp(1.25rem, 4vw, 3rem) 2.5rem; }
  .work-head h2{ font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 3.8rem); letter-spacing: -0.035em; line-height: 1.05; }
  .case{
    position: relative; min-height: 100dvh;
    display: flex; align-items: center;
    background: var(--surface);
    border-top: 1px solid var(--line);
    border-radius: var(--radius-tile) var(--radius-tile) 0 0;
    overflow: hidden;
    transform-origin: 50% 0;
  }
  .case-dim{ position: absolute; inset: 0; z-index: 2; background: var(--bg); opacity: 0; pointer-events: none; }
  .case-inner{
    width: 100%; max-width: 1400px; margin: 0 auto;
    padding: 4rem clamp(1.25rem, 4vw, 3rem);
    display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    gap: clamp(2rem, 5vw, 5rem); align-items: center;
  }
  .case.reverse .case-inner{ grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
  .case.reverse .case-copy{ order: 2; }
  .case-media{ overflow: hidden; border-radius: var(--radius-tile); background: var(--line); }
  .case-media img{ display: block; width: 100%; height: 100%; object-fit: cover; }
  .case.tall .case-media{ aspect-ratio: 4 / 5; width: min(100%, calc(72dvh * 0.8)); justify-self: end; }
  .case.reverse .case-media{ aspect-ratio: 4 / 3; width: min(100%, calc(66dvh * 1.333)); justify-self: start; }
  .case-tag{ color: var(--ink-dim); font-size: 0.95rem; }
  .case h3{ margin-top: 0.8rem; font-weight: 600; font-size: clamp(2rem, 3.6vw, 3.2rem); letter-spacing: -0.035em; line-height: 1.05; }
  .case p{ margin-top: 1.2rem; max-width: 44ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  .case-link{
    display: inline-block; margin-top: 2rem; padding-bottom: 3px;
    border-bottom: 1px solid var(--line);
    transition: border-color .3s cubic-bezier(.16,1,.3,1);
  }
  .case-link:hover{ border-color: currentColor; }
  .case.bleed{ align-items: flex-end; color: #f2efe9; }
  .case.bleed .case-bg{ position: absolute; inset: 0; }
  .case.bleed .case-bg img{ display: block; width: 100%; height: 100%; object-fit: cover; }
  .case.bleed .case-bg::after{
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(14,14,17,0.9), rgba(14,14,17,0.3) 55%, rgba(14,14,17,0.1));
  }
  .case.bleed .case-inner{ position: relative; display: block; padding-bottom: 4.5rem; }
  .case.bleed .case-tag, .case.bleed p{ color: rgba(242,239,233,0.82); }
  .case.bleed .case-link{ border-color: rgba(242,239,233,0.45); }
  @media (max-width: 767px){
    .case{ min-height: auto; }
    .case-inner, .case.reverse .case-inner{ grid-template-columns: 1fr; gap: 2rem; }
    .case.reverse .case-copy{ order: 0; }
    .case.tall .case-media, .case.reverse .case-media{ width: 100%; justify-self: stretch; }
    .case.bleed{ min-height: 72dvh; }
  }

  .services{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 8rem clamp(1.25rem, 4vw, 3rem);
    display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
    gap: clamp(2rem, 6vw, 6rem);
  }
  .services-head{ position: sticky; top: 6rem; align-self: start; }
  .services-head h2{ font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 3.8rem); letter-spacing: -0.035em; line-height: 1.05; }
  .services-head p{ margin-top: 1.2rem; max-width: 30ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  .service-list{ border-top: 1px solid var(--line); }
  .service{ position: relative; padding: 2.6rem 0 2.8rem; border-bottom: 1px solid var(--line); }
  .service h3{
    font-weight: 600; font-size: clamp(1.9rem, 3.6vw, 3.2rem); letter-spacing: -0.035em; line-height: 1.05;
    transition: transform .5s cubic-bezier(.16,1,.3,1);
  }
  .service p{ margin-top: 1rem; max-width: 48ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  .service::after{
    content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
    background: linear-gradient(90deg, var(--brand-a), var(--brand-b));
    transform: scaleX(0); transform-origin: left;
    transition: transform .7s cubic-bezier(.16,1,.3,1);
  }
  .service:hover::after{ transform: scaleX(1); }
  .service:hover h3{ transform: translateX(12px); }
  @media (prefers-reduced-motion: reduce){
    .service h3, .service::after{ transition: none; }
  }
  @media (max-width: 767px){
    .services{ grid-template-columns: 1fr; padding-top: 5rem; padding-bottom: 5rem; }
    .services-head{ position: static; }
  }

  .process{ position: relative; z-index: var(--z-content); }
  .process-pin{ padding: 6rem 0; }
  .process-head{ max-width: 1400px; margin: 0 auto; padding: 0 clamp(1.25rem, 4vw, 3rem); }
  .process-head h2{ font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 3.8rem); letter-spacing: -0.035em; line-height: 1.05; }
  .process-head p{ margin-top: 1.2rem; max-width: 36ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  .process-track{
    display: grid; gap: 3.5rem;
    max-width: 1400px; margin: 3.5rem auto 0;
    padding: 0 clamp(1.25rem, 4vw, 3rem);
  }
  .step{ padding-top: 2rem; border-top: 1px solid var(--line); }
  .step h3{ font-weight: 600; font-size: clamp(2.6rem, 7vw, 5.6rem); letter-spacing: -0.04em; line-height: 1; }
  .step p{ margin-top: 1.2rem; max-width: 34ch; color: var(--ink-dim); font-size: 1.1rem; line-height: 1.6; }
  .process-progress{ display: none; }
  .process.is-horizontal .process-pin{
    height: 100dvh; padding: 0; overflow: hidden;
    display: flex; flex-direction: column; justify-content: center;
  }
  .process.is-horizontal .process-head{ width: 100%; }
  .process.is-horizontal .process-track{
    display: flex; gap: clamp(3rem, 7vw, 7rem);
    width: max-content; max-width: none; margin: 5rem 0 0;
  }
  .process.is-horizontal .step{
    flex: none; width: min(78vw, 560px);
    padding-top: 0; border-top: 0;
    opacity: 0.3; transition: opacity .5s cubic-bezier(.16,1,.3,1);
  }
  .process.is-horizontal .step.is-active{ opacity: 1; }
  .process.is-horizontal .process-progress{
    display: block; position: relative; height: 2px;
    margin: 4.5rem clamp(1.25rem, 4vw, 3rem) 0;
    background: var(--line);
  }
  .process-progress i{
    position: absolute; inset: 0;
    background: linear-gradient(90deg, var(--brand-a), var(--brand-b));
    transform: scaleX(0); transform-origin: left;
  }

  .models{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 8rem clamp(1.25rem, 4vw, 3rem);
  }
  .models-head h2{ font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 3.8rem); letter-spacing: -0.035em; line-height: 1.05; }
  .models-head p{ margin-top: 1.2rem; max-width: 40ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  .bento{
    margin-top: 3rem;
    display: grid; gap: 1rem;
    grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
    grid-template-rows: 1fr 1fr;
    min-height: min(72dvh, 660px);
  }
  .cell{
    position: relative; overflow: hidden;
    display: flex; flex-direction: column; justify-content: flex-end;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border-radius: var(--radius-tile);
    border: 1px solid var(--line);
    background: var(--surface);
  }
  .cell > *{ position: relative; }
  .cell h3{ font-weight: 600; font-size: clamp(1.8rem, 3vw, 2.6rem); letter-spacing: -0.035em; line-height: 1.05; }
  .cell p{ margin-top: 0.9rem; max-width: 40ch; color: var(--ink-dim); font-size: 1.02rem; line-height: 1.6; }
  .cell .best{ margin-top: 1.2rem; font-size: 0.95rem; color: var(--ink); }
  .cell.team{
    grid-row: 1 / span 2; border: 0; color: #fff;
    background: linear-gradient(200deg, var(--brand-b) 0%, var(--brand-a) 62%);
  }
  .cell.team::before{
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(14,12,40,0.62), transparent 65%);
  }
  .cell.team p{ color: rgba(255,255,255,0.9); }
  .cell.team .best{ color: #fff; }
  .cell.project{
    background:
      radial-gradient(70% 90% at 100% 0%, color-mix(in srgb, var(--brand-a) 35%, transparent), transparent 70%),
      var(--surface);
  }
  .cell.hourly{
    background:
      radial-gradient(70% 90% at 100% 0%, color-mix(in srgb, var(--brand-b) 30%, transparent), transparent 70%),
      var(--surface);
  }
  @media (max-width: 767px){
    .models{ padding-top: 5rem; padding-bottom: 5rem; }
    .bento{ grid-template-columns: 1fr; grid-template-rows: none; min-height: 0; }
    .cell{ min-height: 280px; }
    .cell.team{ grid-row: auto; min-height: 360px; }
  }

  .sr-only{
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
  }
  .why{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 8rem clamp(1.25rem, 4vw, 3rem);
  }
  .manifesto{
    font-weight: 500; font-size: clamp(1.9rem, 3.8vw, 3.4rem);
    line-height: 1.18; letter-spacing: -0.03em; max-width: 26ch;
  }
  .why-points{
    margin-top: 6rem;
    display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2rem;
  }
  .point:nth-child(1){ grid-column: 1 / span 4; }
  .point:nth-child(2){ grid-column: 5 / span 4; margin-top: 4rem; }
  .point:nth-child(3){ grid-column: 9 / span 4; margin-top: 8rem; }
  .point::before{
    content: ""; display: block; width: 48px; height: 2px; margin-bottom: 1.4rem;
    background: linear-gradient(90deg, var(--brand-a), var(--brand-b));
  }
  .point h3{ font-weight: 600; font-size: 1.5rem; letter-spacing: -0.02em; }
  .point p{ margin-top: 0.8rem; max-width: 34ch; color: var(--ink-dim); font-size: 1.02rem; line-height: 1.6; }
  @media (max-width: 767px){
    .why{ padding-top: 5rem; padding-bottom: 5rem; }
    .why-points{ grid-template-columns: 1fr; margin-top: 4rem; gap: 2.5rem; }
    .point:nth-child(n){ grid-column: auto; margin-top: 0; }
  }

  .globe-section{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 6rem clamp(1.25rem, 4vw, 3rem);
    display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: clamp(2rem, 5vw, 5rem); align-items: center;
  }
  .globe-copy h2{ font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 3.8rem); letter-spacing: -0.035em; line-height: 1.05; }
  .globe-copy p{ margin-top: 1.2rem; max-width: 38ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  .globe-wrap{ position: relative; width: 100%; max-width: 720px; aspect-ratio: 1 / 1; justify-self: end; }
  .globe-wrap canvas{ display: block; width: 100%; height: 100%; cursor: grab; touch-action: pan-y; }
  .globe-wrap canvas:active{ cursor: grabbing; }
  @media (max-width: 767px){
    .globe-section{ grid-template-columns: 1fr; padding-top: 4rem; padding-bottom: 4rem; }
    .globe-wrap{ justify-self: center; }
  }

  .industries{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 8rem clamp(1.25rem, 4vw, 3rem);
  }
  .ind-head h2{ font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 3.8rem); letter-spacing: -0.035em; line-height: 1.05; }
  .ind-head p{ margin-top: 1.2rem; max-width: 40ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  .ind-body{
    margin-top: 3rem;
    display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: clamp(2rem, 5vw, 5rem); align-items: start;
  }
  .ind-tabs{ display: flex; flex-direction: column; }
  .ind-tab{
    position: relative; appearance: none; background: none; border: 0; cursor: pointer;
    font: inherit; font-size: clamp(1.4rem, 2.4vw, 2.1rem); font-weight: 500; letter-spacing: -0.03em;
    text-align: left; color: var(--ink-dim);
    padding: 0.55rem 0 0.55rem 1.2rem;
    transition: color .3s cubic-bezier(.16,1,.3,1);
  }
  .ind-tab::before{
    content: ""; position: absolute; left: 0; top: 20%; bottom: 20%; width: 2px;
    background: linear-gradient(var(--brand-a), var(--brand-b));
    transform: scaleY(0); transform-origin: top;
    transition: transform .5s cubic-bezier(.16,1,.3,1);
  }
  .ind-tab:hover, .ind-tab[aria-selected="true"]{ color: var(--ink); }
  .ind-tab[aria-selected="true"]::before{ transform: scaleY(1); }
  .ind-panel{
    position: sticky; top: 6rem;
    min-height: 380px;
    display: flex; flex-direction: column; justify-content: flex-end;
    padding: clamp(1.8rem, 4vw, 3.2rem);
    border-radius: var(--radius-tile); border: 1px solid var(--line);
    background:
      radial-gradient(80% 100% at 100% 0%, color-mix(in srgb, var(--brand-a) 30%, transparent), transparent 70%),
      radial-gradient(70% 90% at 0% 100%, color-mix(in srgb, var(--brand-b) 20%, transparent), transparent 70%),
      var(--surface);
  }
  .ind-panel[hidden]{ display: none; }
  .ind-panel h3{ font-weight: 600; font-size: clamp(2rem, 3.8vw, 3.2rem); letter-spacing: -0.035em; line-height: 1.05; }
  .ind-panel p{ margin-top: 1rem; max-width: 42ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  .ind-panel .builds{ margin-top: 1.8rem; font-size: 0.98rem; line-height: 1.5; }
  .ind-panel .builds span{ display: block; color: var(--ink-dim); font-size: 0.9rem; margin-bottom: 0.3rem; }
  @media (prefers-reduced-motion: reduce){
    .ind-tab, .ind-tab::before{ transition: none; }
  }
  @media (max-width: 767px){
    .industries{ padding-top: 5rem; padding-bottom: 5rem; }
    .ind-body{ grid-template-columns: 1fr; gap: 1.5rem; }
    .ind-tabs{ flex-direction: row; gap: 1.4rem; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 0.4rem; }
    .ind-tab{ white-space: nowrap; font-size: 1.2rem; padding: 0.4rem 0 0.7rem; scroll-snap-align: start; }
    .ind-tab::before{ top: auto; bottom: 0; right: 0; width: auto; height: 2px; transform: scaleX(0); transform-origin: left; }
    .ind-tab[aria-selected="true"]::before{ transform: scaleX(1); }
    .ind-panel{ position: static; min-height: 300px; }
  }

  .testimonials{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 8rem clamp(1.25rem, 4vw, 3rem);
  }
  .t-head{ display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; flex-wrap: wrap; }
  .t-head h2{ font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 3.8rem); letter-spacing: -0.035em; line-height: 1.05; }
  .q-controls{ display: flex; gap: 0.6rem; }
  .q-btn{
    appearance: none; font: inherit; font-size: 0.92rem; color: var(--ink); cursor: pointer;
    background: transparent; border: 1px solid var(--line); border-radius: var(--radius-pill);
    padding: 0.7rem 1.2rem; white-space: nowrap;
    transition: border-color .3s cubic-bezier(.16,1,.3,1), transform .2s cubic-bezier(.16,1,.3,1);
  }
  .q-btn:hover:not(:disabled){ border-color: var(--ink); }
  .q-btn:active:not(:disabled){ transform: scale(0.98); }
  .q-btn:disabled{ opacity: 0.35; cursor: default; }
  .quotes-track{
    position: relative; margin-top: 3rem;
    display: flex; gap: clamp(1.5rem, 4vw, 4rem);
    overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
  }
  .quotes-track::-webkit-scrollbar{ display: none; }
  .quote{ flex: 0 0 min(82%, 820px); margin: 0; scroll-snap-align: start; opacity: 0.3; transition: opacity .5s cubic-bezier(.16,1,.3,1); }
  .quote.is-active{ opacity: 1; }
  .quote blockquote{ margin: 0; font-weight: 500; font-size: clamp(1.5rem, 2.6vw, 2.3rem); line-height: 1.3; letter-spacing: -0.025em; max-width: 32ch; }
  .quote figcaption{ margin-top: 2rem; display: flex; align-items: center; gap: 1rem; }
  .avatar{ flex: none; width: 48px; height: 48px; border-radius: 50%; background: linear-gradient(135deg, var(--brand-a), var(--brand-b)); }
  .who b{ display: block; font-weight: 600; }
  .who span{ color: var(--ink-dim); font-size: 0.92rem; }
  @media (prefers-reduced-motion: reduce){ .quote{ transition: none; } }
  @media (max-width: 767px){
    .testimonials{ padding-top: 5rem; padding-bottom: 5rem; }
    .quote{ flex-basis: 88%; }
  }

  .stack-section{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 6rem clamp(1.25rem, 4vw, 3rem);
  }
  .stack-head h2{ font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 3.8rem); letter-spacing: -0.035em; line-height: 1.05; }
  .stack-head p{ margin-top: 1.2rem; max-width: 40ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  .logo-grid{
    margin-top: 3rem;
    display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
    border-top: 1px solid var(--line); border-left: 1px solid var(--line);
  }
  .logo-cell{
    display: flex; align-items: center; justify-content: center;
    aspect-ratio: 16 / 10;
    border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
    color: var(--ink);
  }
  .logo-cell svg{
    width: clamp(28px, 3.2vw, 44px); height: auto;
    opacity: 0.55;
    transition: opacity .4s cubic-bezier(.16,1,.3,1), transform .4s cubic-bezier(.16,1,.3,1);
  }
  .logo-cell:hover svg{ opacity: 1; transform: translateY(-3px); }
  @media (prefers-reduced-motion: reduce){ .logo-cell svg{ transition: none; } }
  @media (max-width: 767px){
    .stack-section{ padding-top: 4rem; padding-bottom: 4rem; }
    .logo-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }

  .creds{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 6rem clamp(1.25rem, 4vw, 3rem);
    display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
    gap: clamp(2rem, 6vw, 6rem); align-items: start;
  }
  .creds-head h2{ font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 3.8rem); letter-spacing: -0.035em; line-height: 1.05; }
  .creds-head p{ margin-top: 1.2rem; max-width: 30ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  .cred-grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .cred{
    position: relative; isolation: isolate;
    display: flex; align-items: center; gap: 1.3rem;
    padding: 1.6rem;
    border-radius: var(--radius-tile);
    background: var(--surface);
    border: 1px solid var(--line);
    --mx: -500px; --my: -500px;
  }
  .cred::before{
    content: ""; position: absolute; inset: -1px; z-index: -1; border-radius: inherit; padding: 1px;
    background: radial-gradient(220px circle at var(--mx) var(--my), var(--brand-b), var(--brand-a) 40%, transparent 70%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
    pointer-events: none;
  }
  .seal{
    flex: none; width: 64px; height: 64px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--radius-tile);
    background: linear-gradient(135deg, var(--brand-a), var(--brand-b));
    color: #fff; font-weight: 600; font-size: 0.95rem; letter-spacing: -0.01em;
  }
  .cred h3{ font-weight: 600; font-size: 1.2rem; letter-spacing: -0.02em; line-height: 1.25; }
  .cred p{ margin-top: 0.3rem; color: var(--ink-dim); font-size: 0.95rem; }
  @media (max-width: 767px){
    .creds{ grid-template-columns: 1fr; padding-top: 4rem; padding-bottom: 4rem; }
    .cred-grid{ grid-template-columns: 1fr; }
  }

  .careers{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 4rem clamp(1.25rem, 4vw, 3rem);
  }
  .careers-band{
    display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap;
    padding: clamp(2rem, 5vw, 4rem);
    border-radius: var(--radius-tile); border: 1px solid var(--line);
    background:
      linear-gradient(100deg, color-mix(in srgb, var(--brand-a) 22%, transparent), color-mix(in srgb, var(--brand-b) 16%, transparent)),
      var(--surface);
  }
  .careers-band h2{ font-weight: 600; font-size: clamp(2rem, 3.6vw, 3.2rem); letter-spacing: -0.035em; line-height: 1.05; }
  .careers-band p{ margin-top: 0.9rem; max-width: 46ch; color: var(--ink-dim); font-size: 1.05rem; line-height: 1.6; }
  @media (max-width: 767px){
    .careers{ padding-top: 2rem; padding-bottom: 2rem; }
    .careers-band{ flex-direction: column; align-items: flex-start; }
  }

  .cta{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 4rem clamp(1.25rem, 4vw, 3rem) 6rem;
  }
  .cta-panel{
    position: relative; overflow: hidden;
    min-height: min(70dvh, 620px);
    display: flex; flex-direction: column; justify-content: center;
    padding: clamp(3rem, 8vw, 7rem) clamp(1.8rem, 6vw, 5rem);
    border-radius: var(--radius-tile);
    color: #fff;
    background: linear-gradient(90.565deg, var(--brand-a) 0%, var(--brand-b) 100%);
    transform-origin: 50% 100%;
  }
  .cta-panel::before{
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(90deg, rgba(14,12,40,0.6), rgba(14,12,40,0.18) 60%, transparent);
  }
  .cta-rings{ position: absolute; right: -8%; top: 50%; width: min(60vw, 640px); aspect-ratio: 1 / 1; transform: translateY(-50%); pointer-events: none; }
  .cta-rings span{ position: absolute; inset: calc(var(--i) * 9%); border-radius: 50%; border: 1.5px solid rgba(255,255,255,0.28); }
  .cta-copy{ position: relative; }
  .cta h2{ font-weight: 600; font-size: clamp(2.6rem, 6vw, 5.6rem); letter-spacing: -0.04em; line-height: 1.02; max-width: 14ch; }
  .cta p{ margin-top: 1.4rem; max-width: 40ch; font-size: 1.1rem; line-height: 1.6; color: rgba(255,255,255,0.9); }
  .btn-light{
    display: inline-flex; margin-top: 2.4rem;
    padding: 1.05rem 1.8rem; border-radius: var(--radius-pill);
    background: #fff; color: #1b1640; font-weight: 600; font-size: 1rem; white-space: nowrap;
    transition: background .3s cubic-bezier(.16,1,.3,1), transform .2s cubic-bezier(.16,1,.3,1);
  }
  .btn-light:hover{ background: #eeecfb; }
  .btn-light:active{ transform: scale(0.98); }

  .footer{
    position: relative; z-index: var(--z-content);
    max-width: 1400px; margin: 0 auto;
    padding: 4rem clamp(1.25rem, 4vw, 3rem) 2rem;
    border-top: 1px solid var(--line);
  }
  .footer-grid{ display: grid; grid-template-columns: minmax(0, 5fr) repeat(3, minmax(0, 2.4fr)); gap: 2rem; }
  .footer-intro p{ max-width: 32ch; color: var(--ink-dim); line-height: 1.6; }
  .footer h3{ font-size: 0.95rem; font-weight: 600; margin-bottom: 1rem; }
  .footer ul{ list-style: none; padding: 0; margin: 0; display: grid; gap: 0.6rem; }
  .footer ul a, .footer ul span{ color: var(--ink-dim); font-size: 0.95rem; transition: color .3s cubic-bezier(.16,1,.3,1); }
  .footer ul a:hover{ color: var(--ink); }
  .footer-logo{ margin-top: 5rem; }
  .footer-logo svg{ display: block; width: 100%; height: auto; }
  .footer-legal{
    margin-top: 2rem; display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
    color: var(--ink-dim); font-size: 0.9rem;
  }
  .footer-legal nav{ display: flex; gap: 1.5rem; }
  .footer-legal a:hover{ color: var(--ink); }
  @media (max-width: 767px){
    .cta{ padding-bottom: 4rem; }
    .cta-rings{ width: 90vw; right: -40%; opacity: 0.6; }
    .footer-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .footer-intro{ grid-column: 1 / -1; }
    .footer-logo{ margin-top: 3rem; }
  }

  @media (max-width: 767px){
    .nav-links a:not(.nav-cta){ display: none; }
    .hero{ grid-template-columns: 1fr; align-items: start; padding-top: 1.5rem; gap: 2.5rem; }
    h1{ font-size: clamp(2.2rem, 10vw, 3rem); }
    .tile-col.offset{ margin-top: 1.5rem; }
  }