:root {
      color-scheme: dark;
      --ink: #050607;
      --ink-rgb: 5, 6, 7;
      --panel: #0a0c0e;
      --paper: #f2f4f2;
      --soft: #b8bfbd;
      --muted: #7f8986;
      --line: rgba(226, 237, 233, .16);
      --line-strong: rgba(226, 237, 233, .36);
      --stage: #8fd3ff;
      --stage-rgb: 143, 211, 255;
      --max: 1440px;
      --nav-h: 76px;
      --ease: cubic-bezier(.16, 1, .3, 1);
      --px: 50%;
      --py: 50%;
      --system-drift-x: 0px;
      --system-drift-y: 0px;
      --system-scale: 1.035;
      --system-backdrop-opacity: .045;
      --system-light-x: 72%;
      --system-light-y: 44%;
      --focus-drift-x: 0px;
      --focus-drift-y: 0px;
    }

    * { box-sizing: border-box; }
    html { overflow-x: clip; scroll-behavior: smooth; scroll-padding-top: calc(var(--nav-h) + 20px); }
    body {
      margin: 0;
      overflow-x: clip;
      background: var(--ink);
      color: var(--paper);
      font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
      font-size: 16px;
      line-height: 1.55;
      -webkit-font-smoothing: antialiased;
    }
    body::before {
      position: fixed;
      inset: 0;
      z-index: 60;
      pointer-events: none;
      content: "";
      opacity: .026;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitchTiles'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    }
    a { color: inherit; text-decoration: none; }
    a, button, [role="button"] { -webkit-tap-highlight-color: transparent; }
    button, input, select, textarea { font: inherit; }
    button {
      -webkit-appearance: none;
      appearance: none;
      color: inherit;
      touch-action: manipulation;
    }
    img, svg { display: block; max-width: 100%; }
    ::selection { background: var(--stage); color: var(--ink); }
    :focus-visible { outline: 2px solid var(--stage); outline-offset: 4px; }

    .skip-link {
      position: fixed;
      top: 10px;
      left: 10px;
      z-index: 120;
      padding: 10px 14px;
      background: var(--paper);
      color: var(--ink);
      transform: translateY(-150%);
    }
    .skip-link:focus { transform: none; }
    .shell { width: min(calc(100% - 80px), var(--max)); margin-inline: auto; }
    .mono {
      font-family: "Cascadia Mono", "SFMono-Regular", Consolas, monospace;
      font-size: .7rem;
      letter-spacing: .13em;
      text-transform: uppercase;
    }
    .muted { color: var(--muted); }
    .system-canvas {
      position: fixed;
      inset: 0;
      z-index: 1;
      width: 100%;
      height: 100%;
      pointer-events: none;
      opacity: .58;
    }
    .site-content, .site-footer { position: relative; }
    .section {
      position: relative;
      border-top: 1px solid var(--line);
      background: linear-gradient(180deg, rgba(var(--ink-rgb), .78), rgba(var(--ink-rgb), .93));
    }
    .section::before {
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      content: "";
      background: radial-gradient(circle at var(--signal-x, 75%) var(--signal-y, 24%), rgba(var(--stage-rgb), .08), transparent 28rem);
      transition: background-color .6s;
    }
    .section > .shell, .site-footer > .shell { position: relative; z-index: 2; }
    .section-backdrop {
      position: absolute;
      inset: 0;
      z-index: 0;
      overflow: hidden;
      pointer-events: none;
    }
    .section-backdrop img {
      position: absolute;
      inset: -7%;
      width: 114%;
      height: 114%;
      object-fit: cover;
      object-position: var(--backdrop-position, 76% 50%);
      opacity: var(--system-backdrop-opacity);
      filter: grayscale(.78) saturate(.44) contrast(1.12) brightness(.58) sepia(.08) hue-rotate(155deg);
      transform:
        translate3d(
          var(--system-drift-x),
          var(--system-drift-y),
          0
        )
        scale(var(--system-scale));
      transition: opacity 1.2s var(--ease);
      will-change: transform;
      mask-image: linear-gradient(90deg, transparent 4%, rgba(0,0,0,.22) 32%, #000 73%, transparent 100%);
    }
    .section-backdrop::after {
      position: absolute;
      inset: 0;
      content: "";
      background:
        radial-gradient(circle at var(--system-light-x) var(--system-light-y), rgba(var(--stage-rgb), .055), transparent 25%),
        linear-gradient(90deg, var(--ink) 0%, rgba(5,6,7,.94) 34%, rgba(5,6,7,.48) 72%, var(--ink) 100%),
        linear-gradient(180deg, var(--ink), transparent 28%, transparent 70%, var(--ink));
    }
    .section-heading {
      max-width: 930px;
      margin: 0;
      font-size: clamp(2.55rem, 6.5vw, 6rem);
      font-weight: 300;
      line-height: .94;
      letter-spacing: -.04em;
      text-wrap: balance;
    }
    .section-intro {
      max-width: 68ch;
      margin: 28px 0 0;
      color: var(--soft);
      font-size: clamp(1rem, 1.5vw, 1.22rem);
    }
    .section-rule {
      display: flex;
      margin-bottom: clamp(70px, 9vw, 138px);
      align-items: center;
      gap: 20px;
      color: var(--soft);
    }
    .section-rule::after {
      height: 1px;
      flex: 1;
      content: "";
      background: linear-gradient(90deg, var(--stage), var(--line) 22%, transparent);
      transform-origin: left;
      transform: scaleX(var(--signal, .35));
      transition: transform .8s var(--ease);
    }
    .section.is-visible .section-rule::after { --signal: 1; }
    .reveal {
      opacity: 1;
      filter: none;
      transform: none;
    }
    .motion-ready .section:not(.is-in-view) *,
    .motion-ready .section:not(.is-in-view) *::before,
    .motion-ready .section:not(.is-in-view) *::after {
      animation: none !important;
      transition: none !important;
    }

    /* Navigation */
    .nav {
      position: fixed;
      inset: 0 0 auto;
      z-index: 70;
      height: var(--nav-h);
      border-bottom: 1px solid var(--line);
      background: #050607;
      backface-visibility: hidden;
      isolation: isolate;
    }
    .nav-inner {
      display: grid;
      height: 100%;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
      gap: 28px;
    }
    .brand { display: inline-flex; width: max-content; align-items: center; gap: 12px; }
    .brand img {
      width: 38px;
      height: 38px;
      border-radius: 50%;
      object-fit: cover;
      filter: saturate(.8) contrast(1.1);
      mix-blend-mode: screen;
    }
    .brand span { font-size: .92rem; letter-spacing: .24em; text-transform: uppercase; }
    .nav-links { display: flex; align-items: center; gap: clamp(16px, 1.7vw, 28px); }
    .nav-links a {
      position: relative;
      color: var(--soft);
      font-size: .76rem;
    }
    .nav-links a::after {
      position: absolute;
      right: 0;
      bottom: -11px;
      left: 0;
      height: 1px;
      content: "";
      background: #8fd3ff;
      transform: scaleX(0);
      transition: transform .3s var(--ease);
    }
    .nav-links a:hover { color: var(--paper); }
    .nav-links a[aria-current]::after { transform: scaleX(1); }
    .nav-cta { justify-self: end; }
    .menu-button {
      display: none;
      width: 44px;
      height: 44px;
      padding: 0;
      border: 1px solid var(--line);
      background: var(--ink);
      place-items: center;
      cursor: pointer;
    }
    .menu-button svg { width: 22px; }

    .button {
      position: relative;
      display: inline-flex;
      min-height: 48px;
      padding: 0 20px;
      align-items: center;
      justify-content: center;
      gap: 18px;
      border: 1px solid var(--line-strong);
      background: rgba(5, 6, 7, .3);
      color: var(--paper);
      font-size: .78rem;
      cursor: pointer;
      transition: background .25s, color .25s, border-color .25s, transform .25s;
    }
    .button::after { content: "↗"; }
    .button:hover { border-color: var(--stage); background: var(--stage); color: var(--ink); transform: translateY(-2px); }

    /* Hero */
    .hero {
      min-height: 100svh;
      padding: calc(var(--nav-h) + clamp(62px, 8vw, 120px)) 0 clamp(64px, 8vw, 110px);
      overflow: hidden;
      background: #050607;
    }
    .hero-media {
      position: absolute;
      inset: 0;
      z-index: 0;
      overflow: hidden;
      pointer-events: none;
    }
    .hero-scene-group {
      position: absolute;
      inset: 0;
      opacity: 0;
      filter: blur(10px);
      transform: scale(1.045);
      transition: opacity 1.1s var(--ease), filter 1.4s var(--ease), transform 1.8s var(--ease);
    }
    .hero-scene-group[data-capability-scene="isaac"] { opacity: 1; filter: none; transform: scale(1); }
    .hero[data-active-capability="custom"] .hero-scene-group[data-capability-scene],
    .hero[data-active-capability="physical"] .hero-scene-group[data-capability-scene] { opacity: 0; filter: blur(10px); transform: scale(1.045); }
    .hero[data-active-capability="isaac"] .hero-scene-group[data-capability-scene="isaac"],
    .hero[data-active-capability="custom"] .hero-scene-group[data-capability-scene="custom"],
    .hero[data-active-capability="physical"] .hero-scene-group[data-capability-scene="physical"] { opacity: 1; filter: none; transform: scale(1); }
    .hero-scene {
      position: absolute;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      transition: transform 14s cubic-bezier(.37, 0, .63, 1), opacity 1.2s var(--ease);
    }
    .hero-scene-world {
      inset: 0;
      opacity: .28;
      filter: saturate(.62) contrast(1.12) brightness(.74);
      transform: scale(1.035);
      animation: sceneWorldDrift 46s cubic-bezier(.37, 0, .63, 1) infinite alternate;
    }
    .hero-scene-team {
      inset: 8% -3% 0 auto;
      width: 68%;
      height: 92%;
      opacity: .32;
      filter: saturate(.72) contrast(1.15) brightness(.72);
      mask-image: radial-gradient(ellipse at 66% 52%, #000 0 35%, rgba(0,0,0,.72) 55%, transparent 78%);
      transform: scale(1.06) translate3d(var(--system-drift-x), var(--system-drift-y), 0);
      animation: sceneTeamDrift 31s cubic-bezier(.37, 0, .63, 1) infinite alternate;
    }
    .hero-scene-micro {
      top: 10%;
      right: 26%;
      width: 37%;
      height: 48%;
      opacity: .22;
      filter: saturate(.9) contrast(1.28) brightness(.82);
      mix-blend-mode: screen;
      mask-image: radial-gradient(circle, #000, transparent 72%);
      transform: rotate(-7deg) scale(1.05);
      animation: sceneMicroDrift 23s cubic-bezier(.37, 0, .63, 1) infinite alternate;
    }
    @keyframes sceneWorldDrift { to { transform: scale(1.07) translate3d(-1.4%, .8%, 0); } }
    @keyframes sceneTeamDrift { to { transform: scale(1.025) translate3d(calc(var(--system-drift-x) - 1.1%), calc(var(--system-drift-y) + .6%), 0); } }
    @keyframes sceneMicroDrift { to { transform: rotate(4deg) scale(1.11) translate3d(2%, -1%, 0); } }
    .hero-media::after {
      position: absolute;
      inset: 0;
      content: "";
      background:
        linear-gradient(90deg, #050607 3%, rgba(5,6,7,.92) 37%, rgba(5,6,7,.35) 75%, #050607 100%),
        linear-gradient(180deg, rgba(5,6,7,.35), #050607 94%);
    }
    .hero-grid {
      position: relative;
      display: grid;
      min-height: calc(100svh - var(--nav-h) - 170px);
      grid-template-columns: minmax(0, 1.05fr) minmax(460px, .95fr);
      align-items: center;
      gap: clamp(40px, 7vw, 120px);
    }
    .hero-copy { position: relative; z-index: 2; max-width: 790px; }
    .capability-map {
      max-width: 690px;
      margin-bottom: 30px;
      scroll-margin-top: calc(var(--nav-h) + 18px);
    }
    .capability-map-head {
      display: flex;
      margin-bottom: 12px;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }
    .capability-map-head > span {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      color: var(--stage);
    }
    .capability-map-head > span::before { width: 32px; height: 1px; content: ""; background: currentColor; }
    .capability-map-head p { margin: 0; color: var(--muted); font-size: .72rem; }
    .capability-tabs {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      border-top: 1px solid var(--line-strong);
      border-bottom: 1px solid var(--line-strong);
    }
    .capability-tab {
      position: relative;
      min-height: 42px;
      padding: 0 12px;
      border: 0;
      border-right: 1px solid var(--line);
      background: transparent;
      color: var(--soft);
      font: 500 .66rem/1.2 "Cascadia Mono", Consolas, monospace;
      letter-spacing: .06em;
      text-align: left;
      text-transform: uppercase;
      cursor: pointer;
      transition: color .25s, background .35s;
    }
    .capability-tab:last-child { border-right: 0; }
    .capability-tab::after {
      position: absolute;
      right: 12px;
      bottom: -1px;
      left: 12px;
      height: 1px;
      content: "";
      background: var(--stage);
      transform: scaleX(0);
      transition: transform .45s var(--ease);
    }
    .capability-tab:hover, .capability-tab[aria-pressed="true"] { color: var(--paper); background: rgba(255,255,255,.035); }
    .capability-tab[aria-pressed="true"]::after { transform: scaleX(1); }
    .capability-map-flow {
      display: grid;
      padding-top: 13px;
      grid-template-columns: minmax(185px, .72fr) minmax(0, 1fr);
      align-items: center;
      gap: 18px;
    }
    .capability-map-copy strong { display: block; font-size: .82rem; font-weight: 500; }
    .capability-map-copy p { margin: 3px 0 0; color: var(--muted); font-size: .7rem; line-height: 1.4; }
    .capability-stage-map { display: flex; min-width: 0; align-items: center; gap: 5px; }
    .capability-stage-token {
      display: grid;
      min-width: 0;
      height: 27px;
      padding: 0 8px;
      border: 1px solid var(--line);
      color: #626967;
      place-items: center;
      font: 500 .57rem/1 "Cascadia Mono", Consolas, monospace;
      text-transform: uppercase;
      transition: color .3s, border-color .3s, background .3s;
    }
    .capability-stage-token.is-mapped {
      border-color: color-mix(in srgb, var(--map-color) 58%, transparent);
      background: color-mix(in srgb, var(--map-color) 9%, transparent);
      color: var(--map-color);
    }
    .capability-engine-link {
      margin-left: auto;
      color: var(--paper);
      font-size: .6rem;
      white-space: nowrap;
      border-bottom: 1px solid var(--stage);
    }
    .hero h1 {
      margin: 0;
      max-width: 770px;
      font-size: clamp(3.7rem, 7.8vw, 7.5rem);
      font-weight: 250;
      line-height: .86;
      letter-spacing: -.04em;
      text-wrap: balance;
    }
    .hero h1 em { display: block; color: var(--stage); font-style: normal; font-weight: 500; }
    .hero-lead {
      max-width: 59ch;
      margin: 38px 0 0;
      color: #d0d5d3;
      font-size: clamp(1.08rem, 1.6vw, 1.32rem);
    }
    .hero-actions { display: flex; margin-top: 38px; align-items: center; gap: 28px; flex-wrap: wrap; }
    .hero-actions .text-link { color: var(--soft); font-size: .8rem; border-bottom: 1px solid var(--line-strong); }

    .hero-orbit {
      position: relative;
      width: min(43vw, 620px);
      aspect-ratio: 1;
      justify-self: end;
    }
    .hero-orbit::before, .hero-orbit::after {
      position: absolute;
      inset: 8%;
      border: 1px solid rgba(var(--stage-rgb), .32);
      border-radius: 50%;
      content: "";
    }
    .hero-orbit::after { inset: 24%; border-style: dashed; opacity: .55; }
    .hero-core {
      position: absolute;
      inset: 27%;
      display: grid;
      overflow: hidden;
      border: 1px solid var(--stage);
      border-radius: 50%;
      background: rgba(5,6,7,.78);
      place-items: center;
      box-shadow: 0 18px 60px rgba(0,0,0,.38);
      transition: border-color .55s, box-shadow .55s;
    }
    .hero-core::after {
      position: absolute;
      inset: 0;
      z-index: 1;
      content: "";
      background: radial-gradient(circle, rgba(5,6,7,.28), rgba(5,6,7,.9) 78%);
    }
    .hero-core img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: .42;
      filter: saturate(.72) contrast(1.12);
      transition: opacity .35s, filter .45s, transform .7s var(--ease);
    }
    .hero-core.is-changing img { opacity: .08; filter: blur(5px); transform: scale(1.08); }
    .hero-core-data {
      position: absolute;
      inset: 12%;
      z-index: 2;
      display: grid;
      place-content: center;
      text-align: center;
      transition: opacity .25s, transform .45s var(--ease);
    }
    .hero-core-data span { color: var(--stage); }
    .hero-core-data strong {
      display: block;
      margin: 9px auto;
      max-width: 13ch;
      font-size: clamp(.9rem, 1.35vw, 1.16rem);
      font-weight: 450;
      line-height: 1.08;
    }
    .hero-core-data code { color: #d8dfdc; font: 400 clamp(.62rem, .8vw, .76rem)/1.4 "Cascadia Mono", Consolas, monospace; }
    .hero-stage {
      position: absolute;
      width: 78px;
      height: 78px;
      overflow: hidden;
      padding: 0;
      border: 1px solid var(--line-strong);
      border-radius: 50%;
      background: #080a0b;
      color: var(--soft);
      cursor: pointer;
      transform: translate(-50%, -50%);
      transition: color .3s, background .3s, border-color .3s, box-shadow .3s, scale .3s;
    }
    .hero-stage:nth-of-type(1) { left: 50%; top: 8%; }
    .hero-stage:nth-of-type(2) { left: 86%; top: 29%; }
    .hero-stage:nth-of-type(3) { left: 86%; top: 71%; }
    .hero-stage:nth-of-type(4) { left: 50%; top: 92%; }
    .hero-stage:nth-of-type(5) { left: 14%; top: 71%; }
    .hero-stage:nth-of-type(6) { left: 14%; top: 29%; }
    .hero-stage:hover, .hero-stage.is-active {
      border-color: var(--stage);
      color: var(--paper);
      box-shadow: 0 8px 28px rgba(0, 0, 0, .48);
      scale: 1.08;
    }
    .hero-stage img, .engine-node img, .role-node img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: .48;
      filter: grayscale(.35) saturate(.72) contrast(1.18);
      transition: opacity .45s, filter .45s, scale .7s var(--ease);
    }
    .hero-stage::after, .engine-node::after, .role-node::after {
      position: absolute;
      inset: 0;
      content: "";
      border-radius: inherit;
      background: radial-gradient(circle at 50% 35%, transparent 10%, rgba(5,6,7,.28) 54%, rgba(5,6,7,.92));
      pointer-events: none;
    }
    .hero-stage:hover img, .hero-stage.is-active img,
    .engine-node:hover img, .engine-node.is-active img,
    .role-node:hover img, .role-node.is-active img { opacity: .88; filter: grayscale(0) saturate(.92) contrast(1.1); scale: 1.1; }
    .hero-stage img { animation: orbitReverse 94s linear infinite; }
    .hero-stage:nth-of-type(even) img { animation-direction: reverse; animation-duration: 121s; }
    .engine-node img { animation: orbitClockwise 118s linear infinite; }
    .engine-node:nth-of-type(3n) img { animation-direction: reverse; animation-duration: 87s; }
    .role-node img { animation: orbitReverse 103s linear infinite; }
    .role-node:nth-of-type(odd) img { animation-direction: reverse; animation-duration: 137s; }
    .hero-stage span {
      position: relative;
      z-index: 2;
      display: block;
      text-shadow: 0 2px 8px #000;
      font: 600 .62rem/1 "Cascadia Mono", Consolas, monospace;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .loop-trajectories {
      position: absolute;
      inset: 0;
      z-index: 3;
      width: 100%;
      height: 100%;
      overflow: visible;
      pointer-events: none;
    }
    .trajectory-edge { color: var(--stage); pointer-events: none; outline: none; }
    .trajectory-line {
      fill: none;
      stroke: currentColor;
      stroke-width: .26;
      stroke-linecap: round;
      opacity: .42;
      transition: opacity .35s, stroke-width .35s, filter .35s;
    }
    .trajectory-guide {
      fill: none;
      stroke: rgba(255,255,255,.12);
      stroke-width: .12;
      stroke-dasharray: .8 2.4;
    }
    .trajectory-hit { fill: none; stroke: transparent; stroke-width: 5; pointer-events: stroke; cursor: pointer; }
    .trajectory-packet {
      fill: currentColor;
      opacity: .56;
      filter: drop-shadow(0 0 2px currentColor);
      transition: opacity .3s;
    }
    .trajectory-edge:hover .trajectory-line,
    .trajectory-edge:focus-visible .trajectory-line,
    .trajectory-edge.is-active .trajectory-line {
      stroke-width: .62;
      opacity: 1;
      filter: drop-shadow(0 0 3px currentColor);
    }
    .trajectory-edge:hover .trajectory-packet,
    .trajectory-edge:focus-visible .trajectory-packet,
    .trajectory-edge.is-active .trajectory-packet { opacity: 1; }
    .loop-readout {
      position: absolute;
      right: 10%;
      bottom: 4%;
      left: 10%;
      display: flex;
      justify-content: space-between;
      color: var(--muted);
    }
    .motion-toggle {
      position: absolute;
      right: 0;
      top: 2%;
      z-index: 4;
      padding: 7px 0;
      border: 0;
      border-bottom: 1px solid var(--line-strong);
      background: transparent;
      color: var(--soft);
      cursor: pointer;
    }
    .motion-toggle[aria-pressed="true"] { color: var(--stage); border-color: var(--stage); }
    .hero-stage-response {
      display: grid;
      overflow: hidden;
      max-width: 650px;
      margin-top: 42px;
      padding-top: 19px;
      grid-template-columns: 115px minmax(0, 1fr) auto;
      align-items: center;
      gap: 22px;
      border-top: 1px solid var(--line-strong);
      transition: border-color .5s;
    }
    .hero-stage-response span { color: var(--stage); }
    .hero-stage-response strong { font-size: .9rem; font-weight: 450; }
    .hero-stage-response code { color: #d8dfdc; font: 400 .72rem/1.4 "Cascadia Mono", Consolas, monospace; white-space: nowrap; }
    .hero-stage-response > * { transition: opacity .22s, transform .4s var(--ease); }

    /* Engineering spectrum */
    .expertise-spectrum { padding: clamp(90px, 11vw, 160px) 0; overflow: hidden; }
    .expertise-intro {
      display: grid;
      grid-template-columns: 1.1fr .9fr;
      align-items: end;
      gap: 70px;
      margin-bottom: 70px;
    }
    .expertise-intro p { justify-self: end; }
    .expertise-rail { border-top: 1px solid var(--line-strong); }
    .expertise-node {
      position: relative;
      display: grid;
      width: 100%;
      min-height: 150px;
      overflow: hidden;
      padding: 22px 0;
      border: 0;
      border-bottom: 1px solid var(--line);
      background: transparent;
      grid-template-columns: 76px minmax(260px, .85fr) minmax(280px, 1fr) 160px;
      align-items: center;
      gap: 34px;
      text-align: left;
      cursor: pointer;
      isolation: isolate;
    }
    .expertise-node::before {
      position: absolute;
      inset: 0;
      z-index: -1;
      content: "";
      background: linear-gradient(90deg, rgba(var(--stage-rgb),.11), transparent 72%);
      opacity: 0;
      transform: scaleX(.2);
      transform-origin: left;
      transition: opacity .5s, transform .9s var(--ease);
    }
    .expertise-backdrop {
      position: absolute;
      inset: 0;
      z-index: -2;
      overflow: hidden;
      pointer-events: none;
      mask-image: linear-gradient(90deg, transparent 18%, rgba(0,0,0,.2) 42%, #000 72%, transparent 100%);
    }
    .expertise-backdrop img {
      position: absolute;
      top: -18%;
      right: 4%;
      width: 64%;
      height: 136%;
      object-fit: cover;
      opacity: .13;
      filter: grayscale(.28) saturate(.72) contrast(1.18) brightness(.65) blur(1.1px);
      transform: scale(1.06) translate3d(calc(var(--system-drift-x) * -.35), calc(var(--system-drift-y) * -.35), 0);
      transition: opacity .65s, filter .8s var(--ease), transform 1.4s var(--ease);
    }
    .expertise-node:hover .expertise-backdrop img,
    .expertise-node.is-active .expertise-backdrop img {
      opacity: .34;
      filter: grayscale(.06) saturate(.86) contrast(1.2) brightness(.72);
      transform: scale(1.015) translate3d(var(--system-drift-x), var(--system-drift-y), 0);
    }
    .expertise-node:hover::before, .expertise-node.is-active::before { opacity: 1; transform: scaleX(1); }
    .expertise-node > span.mono { color: var(--stage); }
    .expertise-node h3 { margin: 0; font-size: clamp(2rem, 4.5vw, 4.8rem); font-weight: 300; line-height: .9; letter-spacing: -.045em; }
    .expertise-node p { margin: 0; color: var(--soft); }
    .expertise-node figure {
      position: relative;
      width: 124px;
      aspect-ratio: 1;
      margin: 0;
      overflow: hidden;
      border: 1px solid var(--line-strong);
      border-radius: 50%;
      justify-self: end;
      transition: border-color .4s, scale .7s var(--ease);
    }
    .expertise-node figure img { width: 100%; height: 100%; object-fit: cover; opacity: .48; filter: grayscale(.4); transition: opacity .45s, filter .45s, rotate 18s linear; }
    .expertise-node:hover figure, .expertise-node.is-active figure { border-color: var(--stage); scale: 1.08; }
    .expertise-node:hover figure img, .expertise-node.is-active figure img { opacity: .88; filter: grayscale(0); rotate: 8deg; }
    .scene-metrics {
      display: grid;
      grid-column: 1 / -1;
      grid-template-columns: repeat(3, 1fr);
      gap: 1px;
      background: var(--line);
    }
    .scene-metrics div { min-width: 0; padding: 12px 14px; background: rgba(5,6,7,.84); }
    .scene-metrics small, .scene-metrics strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .scene-metrics small { color: var(--muted); font: 500 .56rem/1.4 "Cascadia Mono", Consolas, monospace; letter-spacing: .1em; text-transform: uppercase; }
    .scene-metrics strong { margin-top: 5px; color: var(--paper); font: 500 .68rem/1.3 "Cascadia Mono", Consolas, monospace; }
    .stage-telemetry { position: absolute; inset: 7%; z-index: 2; border-radius: 50%; pointer-events: none; }
    .telemetry-mode {
      position: absolute;
      inset: 0;
      border-radius: inherit;
      opacity: 0;
      transform: scale(.72);
      transition: opacity .65s var(--ease), transform 1.05s var(--ease), filter .65s var(--ease);
    }
    .telemetry-mode::before, .telemetry-mode::after { position: absolute; content: ""; }
    .telemetry-sense { background: conic-gradient(from 20deg, transparent 0 76%, rgba(var(--stage-rgb),.35) 79%, transparent 84%); }
    .telemetry-sense::after { inset: 16%; border: 1px dashed rgba(var(--stage-rgb),.48); border-radius: 50%; }
    .telemetry-model { background-image: linear-gradient(rgba(var(--stage-rgb),.18) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--stage-rgb),.18) 1px, transparent 1px); background-size: 18px 18px; mask-image: radial-gradient(circle, #000, transparent 72%); }
    .telemetry-simulate::before { inset: 12%; border: 1px solid rgba(var(--stage-rgb),.55); border-radius: 34% 66% 58% 42%; transform: rotate(27deg); }
    .telemetry-simulate::after { inset: 28%; border: 1px dashed rgba(var(--stage-rgb),.72); border-radius: 50%; box-shadow: 0 0 30px rgba(var(--stage-rgb),.18); }
    .telemetry-learn { background: repeating-conic-gradient(from 10deg, rgba(var(--stage-rgb),.28) 0 1deg, transparent 1deg 23deg); mask-image: radial-gradient(circle, transparent 19%, #000 20% 62%, transparent 64%); }
    .telemetry-act::before { left: 13%; top: 49%; width: 74%; height: 1px; background: var(--stage); box-shadow: 24px -19px 0 -0.2px var(--stage), 48px 13px 0 -0.2px var(--stage); transform: rotate(-24deg); }
    .telemetry-act::after { right: 10%; top: 20%; width: 12px; height: 12px; border-top: 1px solid var(--stage); border-right: 1px solid var(--stage); transform: rotate(18deg); }
    .telemetry-measure { background: radial-gradient(circle at 30% 45%, rgba(var(--stage-rgb),.42) 0 2px, transparent 3px), radial-gradient(circle at 63% 30%, rgba(var(--stage-rgb),.5) 0 2px, transparent 3px), radial-gradient(circle at 70% 66%, rgba(var(--stage-rgb),.4) 0 2px, transparent 3px); }
    .telemetry-measure::after { inset: 8%; border: 1px dotted rgba(var(--stage-rgb),.65); border-radius: 50%; }
    .hero[data-active-stage="sense"] .telemetry-sense,
    .hero[data-active-stage="model"] .telemetry-model,
    .hero[data-active-stage="simulate"] .telemetry-simulate,
    .hero[data-active-stage="learn"] .telemetry-learn,
    .hero[data-active-stage="act"] .telemetry-act,
    .hero[data-active-stage="measure"] .telemetry-measure { opacity: 1; transform: scale(1); }
    .hero[data-active-stage="sense"] .telemetry-sense { animation: telemetryScan 9s linear infinite; }
    .hero[data-active-stage="simulate"] .telemetry-simulate { animation: telemetryImpact 4.6s ease-in-out infinite; }
    .hero[data-active-stage="learn"] .telemetry-learn { animation: telemetryBranch 12s linear infinite; }
    .hero[data-active-stage="measure"] .telemetry-measure { animation: telemetryMeasure 5.5s ease-in-out infinite; }
    @keyframes telemetryScan { to { rotate: 360deg; } }
    @keyframes telemetryImpact { 50% { scale: 1.08; filter: drop-shadow(0 0 12px rgba(var(--stage-rgb),.4)); } }
    @keyframes telemetryBranch { to { rotate: -360deg; } }
    @keyframes telemetryMeasure { 50% { opacity: .58; scale: .94; } }
    .hero-core-data,
    .engine-copy,
    .devmind-stage-detail,
    .role-detail,
    .process-center > span {
      transition: opacity .24s ease-in, filter .24s ease-in, scale .68s var(--ease), transform .45s var(--ease);
    }

    /* Capability engine */
    .engine { overflow: hidden; padding: clamp(100px, 12vw, 190px) 0; }
    .engine-scene-field {
      position: absolute;
      inset: 0;
      z-index: 0;
      overflow: hidden;
      pointer-events: none;
    }
    .engine-scene-field img {
      position: absolute;
      inset: -7%;
      width: 114%;
      height: 114%;
      object-fit: cover;
      opacity: 0;
      filter: blur(12px) saturate(.5) contrast(1.18) brightness(.55);
      transform: scale(1.09);
      transition: opacity 1s var(--ease), filter 1.4s var(--ease), transform 1.8s var(--ease);
      mask-image: linear-gradient(90deg, transparent 2%, rgba(0,0,0,.74) 32%, #000 70%, transparent 100%);
    }
    .engine[data-active-stage="sense"] .engine-scene-field [data-engine-scene="sense"],
    .engine[data-active-stage="model"] .engine-scene-field [data-engine-scene="model"],
    .engine[data-active-stage="simulate"] .engine-scene-field [data-engine-scene="simulate"],
    .engine[data-active-stage="learn"] .engine-scene-field [data-engine-scene="learn"],
    .engine[data-active-stage="act"] .engine-scene-field [data-engine-scene="act"],
    .engine[data-active-stage="measure"] .engine-scene-field [data-engine-scene="measure"] {
      opacity: .19;
      filter: blur(.8px) saturate(.78) contrast(1.16) brightness(.66);
      transform: scale(1.025) translate3d(var(--system-drift-x), var(--system-drift-y), 0);
      animation: engineSceneDrift 36s cubic-bezier(.37, 0, .63, 1) infinite alternate;
    }
    @keyframes engineSceneDrift { to { transform: scale(1.055) translate3d(calc(var(--system-drift-x) - 1%), calc(var(--system-drift-y) + .7%), 0); } }
    .engine-scene-field::after {
      position: absolute;
      inset: 0;
      content: "";
      background: linear-gradient(180deg, rgba(5,6,7,.78), rgba(5,6,7,.48) 46%, rgba(5,6,7,.92));
    }
    .engine-head {
      display: grid;
      margin-bottom: clamp(70px, 10vw, 145px);
      grid-template-columns: 1.25fr .75fr;
      align-items: end;
      gap: 60px;
    }
    .engine-head .section-intro { justify-self: end; }
    .engine-shell {
      position: relative;
      display: grid;
      min-height: 760px;
      place-items: center;
    }
    .engine-ring {
      position: relative;
      width: min(80vw, 790px);
      aspect-ratio: 1;
      border: 1px solid var(--line);
      border-radius: 50%;
      background: radial-gradient(circle, rgba(var(--stage-rgb), .09), transparent 54%);
    }
    .engine-ring::before {
      position: absolute;
      inset: 13%;
      border: 1px dashed rgba(var(--stage-rgb), .26);
      border-radius: inherit;
      content: "";
    }
    .engine-node {
      position: absolute;
      z-index: 4;
      display: grid;
      width: 120px;
      aspect-ratio: 1;
      padding: 12px;
      border: 1px solid var(--line-strong);
      border-radius: 50%;
      overflow: hidden;
      background: #080a0b;
      color: var(--soft);
      place-content: center;
      text-align: center;
      cursor: pointer;
      transform: translate(-50%, -50%) perspective(500px) rotateX(var(--tilt-y, 0deg)) rotateY(var(--tilt-x, 0deg));
      transition: background .35s, color .35s, border .35s, box-shadow .35s, scale .35s;
    }
    .engine-node:nth-of-type(1) { left: 50%; top: 0; }
    .engine-node:nth-of-type(2) { left: 93.3%; top: 25%; }
    .engine-node:nth-of-type(3) { left: 93.3%; top: 75%; }
    .engine-node:nth-of-type(4) { left: 50%; top: 100%; }
    .engine-node:nth-of-type(5) { left: 6.7%; top: 75%; }
    .engine-node:nth-of-type(6) { left: 6.7%; top: 25%; }
    .engine-node small { display: block; margin-bottom: 8px; color: var(--muted); }
    .engine-node strong { font-size: .9rem; font-weight: 550; }
    .engine-node:hover, .engine-node.is-active {
      border-color: var(--stage);
      color: var(--paper);
      box-shadow: 0 18px 50px rgba(0, 0, 0, .52);
      scale: 1.08;
    }
    .hero-stage.is-domain-mapped,
    .engine-node.is-domain-mapped {
      box-shadow: 0 0 0 4px #050607, 0 0 0 5px rgba(255,255,255,.42);
    }
    .hero-stage.is-domain-mapped:hover,
    .hero-stage.is-domain-mapped.is-active {
      box-shadow: 0 8px 28px rgba(0, 0, 0, .48), 0 0 0 4px #050607, 0 0 0 5px rgba(255,255,255,.42);
    }
    .engine-node.is-domain-mapped:hover,
    .engine-node.is-domain-mapped.is-active {
      box-shadow: 0 18px 50px rgba(0, 0, 0, .52), 0 0 0 4px #050607, 0 0 0 5px rgba(255,255,255,.42);
    }
    :is(.hero-stage, .engine-node, .role-node):focus-visible {
      outline: 0;
      box-shadow: 0 0 0 3px #050607, 0 0 0 5px var(--stage), 0 12px 34px rgba(0, 0, 0, .5) !important;
    }
    .engine-node > span { position: relative; z-index: 2; display: block; text-shadow: 0 2px 10px #000; }
    .engine-node.is-active small { color: var(--stage); }
    .engine-core {
      position: absolute;
      inset: 25%;
      z-index: 2;
      overflow: hidden;
      border: 1px solid var(--line-strong);
      border-radius: 50%;
      background: #090b0c;
      box-shadow: 0 28px 100px rgba(0,0,0,.55);
    }
    .engine-core img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: .33;
      filter: grayscale(.2) saturate(.72) contrast(1.12);
      transition: opacity .35s, transform .65s var(--ease), filter .35s;
    }
    .engine-core.is-changing img { opacity: .1; transform: scale(1.06); filter: blur(4px); }
    .engine-core::after {
      position: absolute;
      inset: 0;
      content: "";
      background: radial-gradient(circle, rgba(5,6,7,.2), rgba(5,6,7,.91) 82%);
    }
    .engine-copy {
      position: absolute;
      inset: 0;
      z-index: 2;
      display: grid;
      padding: 18%;
      align-content: center;
      text-align: center;
    }
    .engine-index { color: var(--stage); }
    .engine-copy h3 { margin: 14px 0 10px; font-size: clamp(1.45rem, 2.5vw, 2.35rem); font-weight: 400; line-height: 1.05; }
    .engine-copy p { margin: 0; color: #c3cac7; font-size: clamp(.8rem, 1vw, .95rem); line-height: 1.55; }
    .lock-status {
      position: absolute;
      right: 0;
      bottom: 0;
      display: flex;
      align-items: center;
      gap: 10px;
      color: var(--muted);
    }
    .lock-status::before { width: 7px; height: 7px; border: 1px solid currentColor; border-radius: 50%; content: ""; }
    .lock-status.is-locked { color: var(--stage); }

    /* Multiscale simulation theater */
    .simulation-theater { padding: clamp(110px, 14vw, 210px) 0; }
    .theater-head {
      display: grid;
      grid-template-columns: 1.15fr .85fr;
      align-items: end;
      gap: 70px;
      margin-bottom: 72px;
    }
    .theater-head .section-intro { justify-self: end; }
    .theater-stage {
      position: relative;
      min-height: min(78vw, 920px);
      overflow: hidden;
      border: 1px solid var(--line);
      background: #050607;
      isolation: isolate;
    }
    .theater-stage::before {
      position: absolute;
      inset: 0;
      z-index: 2;
      content: "";
      pointer-events: none;
      background:
        linear-gradient(90deg, rgba(5,6,7,.96), transparent 42%, rgba(5,6,7,.26)),
        linear-gradient(0deg, rgba(5,6,7,.97), transparent 48%);
    }
    .theater-stage-art {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: .52;
      filter: saturate(.7) contrast(1.18);
      transform: scale(1.035);
      transition: opacity .45s, filter .8s var(--ease), transform 1.6s var(--ease);
    }
    .theater-stage-art-main { z-index: 0; }
    .theater-stage-art-team {
      z-index: 1;
      inset: 7% -3% auto auto;
      width: 58%;
      height: 69%;
      opacity: .34;
      mix-blend-mode: screen;
      mask-image: radial-gradient(ellipse, #000 15%, transparent 72%);
      transform: scale(1.08) translate3d(var(--system-drift-x), var(--system-drift-y), 0);
    }
    .theater-stage-art-detail {
      z-index: 4;
      top: auto;
      right: 5%;
      bottom: 27%;
      left: auto;
      width: 25%;
      height: 27%;
      border: 1px solid rgba(var(--stage-rgb),.24);
      opacity: .7;
      filter: saturate(.78) contrast(1.2) brightness(.76);
      mask-image: radial-gradient(circle, #000 0 56%, transparent 76%);
    }
    .theater-stage.is-changing .theater-stage-art { opacity: .08; filter: blur(16px) saturate(.4); transform: scale(1.11); }
    .theater-vector-field {
      position: absolute;
      inset: 0;
      z-index: 3;
      pointer-events: none;
      opacity: .46;
      background-image:
        radial-gradient(circle at 72% 32%, rgba(var(--stage-rgb),.8) 0 1px, transparent 2px),
        radial-gradient(circle at 78% 44%, rgba(var(--stage-rgb),.55) 0 1px, transparent 2px),
        radial-gradient(circle at 65% 57%, rgba(var(--stage-rgb),.7) 0 1px, transparent 2px);
      background-size: 42px 37px, 57px 49px, 71px 63px;
      mask-image: linear-gradient(90deg, transparent 30%, #000);
      animation: vectorFieldDrift 32s linear infinite;
    }
    .theater-vector-field::before, .theater-vector-field::after {
      position: absolute;
      border: 1px solid rgba(var(--stage-rgb),.4);
      border-radius: 50%;
      content: "";
    }
    .theater-vector-field::before { width: 52%; aspect-ratio: 1; right: -10%; top: -16%; animation: orbitClockwise 100s linear infinite; }
    .theater-vector-field::after { width: 28%; aspect-ratio: 1; right: 18%; top: 21%; border-style: dashed; animation: orbitReverse 76s linear infinite; }
    @keyframes vectorFieldDrift { to { background-position: 42px 37px, -57px 49px, 71px -63px; } }
    .theater-readout {
      position: absolute;
      z-index: 5;
      top: 9%;
      left: 6%;
      width: min(520px, 45%);
    }
    .theater-readout > span { color: var(--stage); }
    .theater-readout h3 { margin: 20px 0; font-size: clamp(2.8rem, 6vw, 6.8rem); font-weight: 280; line-height: .87; letter-spacing: -.055em; }
    .theater-readout p { max-width: 50ch; color: var(--soft); }
    .theater-equation { display: block; margin-top: 30px; color: var(--stage); font: 500 .82rem/1.4 "Cascadia Mono", Consolas, monospace; }
    .scale-probes {
      position: absolute;
      right: 4%;
      bottom: 5%;
      left: 4%;
      z-index: 6;
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 1px;
      background: var(--line);
    }
    .scale-probe {
      position: relative;
      min-width: 0;
      min-height: 170px;
      overflow: hidden;
      padding: 0;
      border: 0;
      background: #090b0c;
      text-align: left;
      cursor: pointer;
    }
    .scale-probe img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .24; filter: grayscale(.5); transition: opacity .55s, filter .55s, transform 1.1s var(--ease); }
    .scale-probe::after { position: absolute; inset: 0; content: ""; background: linear-gradient(0deg, rgba(5,6,7,.96), transparent 76%); }
    .scale-probe span { position: absolute; z-index: 2; right: 14px; bottom: 12px; left: 14px; color: var(--soft); }
    .scale-probe small { display: block; margin-bottom: 6px; color: var(--stage); }
    .scale-probe:hover img, .scale-probe.is-active img { opacity: .7; filter: grayscale(0) saturate(.8); transform: scale(1.08); }
    .scale-probe.is-active { box-shadow: inset 0 -2px 0 var(--stage); }
    .lock-status.is-locked::before { background: currentColor; }

    /* Harness */
    .harness { padding: clamp(105px, 13vw, 190px) 0; overflow: hidden; }
    .harness-intro {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 400px;
      gap: 80px;
      align-items: end;
    }
    .harness-diagram {
      position: relative;
      margin-top: clamp(85px, 11vw, 150px);
      padding: 82px 0 60px;
    }
    .harness-rail {
      position: absolute;
      top: 116px;
      right: 5%;
      left: 5%;
      height: 1px;
      background: var(--line-strong);
    }
    .harness-rail::after {
      position: absolute;
      top: -2px;
      width: 44px;
      height: 5px;
      border-radius: 50%;
      content: "";
      background: var(--stage);
      animation: railSignal 7s linear infinite;
    }
    .harness-rail::before {
      position: absolute;
      inset: -14px 0 auto;
      overflow: hidden;
      content: "→   →   →   →   →   →";
      color: rgba(var(--stage-rgb), .55);
      font: 400 .72rem/1 "Cascadia Mono", Consolas, monospace;
      letter-spacing: clamp(2.8rem, 8vw, 8.5rem);
      white-space: nowrap;
    }
    @keyframes railSignal { from { left: 0; } to { left: calc(100% - 44px); } }
    @keyframes orbitClockwise {
      0% { rotate: 0deg; }
      25% { rotate: 89.7deg; }
      50% { rotate: 180.4deg; }
      75% { rotate: 269.8deg; }
      100% { rotate: 360deg; }
    }
    @keyframes orbitCounter {
      0% { rotate: 0deg; }
      25% { rotate: -89.7deg; }
      50% { rotate: -180.4deg; }
      75% { rotate: -269.8deg; }
      100% { rotate: -360deg; }
    }
    @keyframes orbitReverse {
      0% { rotate: 0deg; }
      25% { rotate: -90.2deg; }
      50% { rotate: -179.6deg; }
      75% { rotate: -270.3deg; }
      100% { rotate: -360deg; }
    }
    @keyframes orbitReverseCounter {
      0% { rotate: 0deg; }
      25% { rotate: 90.2deg; }
      50% { rotate: 179.6deg; }
      75% { rotate: 270.3deg; }
      100% { rotate: 360deg; }
    }
    .engine-ring {
      transform: perspective(1400px) rotateX(.45deg);
      animation: orbitClockwise 210s linear infinite;
    }
    .engine-ring::before { animation: orbitReverse 173s linear infinite; }
    .engine-node > span, .engine-core > * { animation: orbitCounter 210s linear infinite; }
    .constellation {
      transform: perspective(1500px) rotateX(-.35deg);
      animation: orbitReverse 232s linear infinite;
    }
    .constellation::before { animation: orbitClockwise 181s linear infinite; }
    .outcome-node > *, .constellation-core > *, .outcome-media > * { animation: orbitReverseCounter 232s linear infinite; }
    .process-orbit {
      transform: perspective(1400px) rotateX(.5deg);
      animation: orbitClockwise 240s linear infinite;
    }
    .process-orbit::before { animation: orbitReverse 187s linear infinite; }
    .process-orbit::after { animation: orbitClockwise 153s linear infinite; }
    .process-step-content, .process-center > span { animation: orbitCounter 240s linear infinite; }
    .hero-orbit { animation: orbitClockwise 150s linear infinite; }
    .hero-orbit::after { animation: orbitReverse 113s linear infinite; }
    .hero-stage > span, .hero-core > *, .loop-readout > span { animation: orbitCounter 150s linear infinite; }
    body.motion-disabled .hero-orbit,
    body.motion-disabled .hero-orbit::after,
    body.motion-disabled .hero-stage > span,
    body.motion-disabled .hero-core > *,
    body.motion-disabled .loop-readout > span,
    body.motion-disabled .motion-toggle,
    body.motion-disabled .engine-ring,
    body.motion-disabled .engine-ring::before,
    body.motion-disabled .engine-node > span,
    body.motion-disabled .engine-core > *,
    body.motion-disabled .constellation,
    body.motion-disabled .constellation::before,
    body.motion-disabled .outcome-node > *,
    body.motion-disabled .constellation-core > *,
    body.motion-disabled .outcome-media > *,
    body.motion-disabled .process-orbit,
    body.motion-disabled .process-orbit::before,
    body.motion-disabled .process-orbit::after,
    body.motion-disabled .process-step-content,
    body.motion-disabled .process-step-art,
    body.motion-disabled .process-center > span,
    body.motion-disabled .hero-scene,
    body.motion-disabled .engine-scene-field img,
    body.motion-disabled .role-world img,
    body.motion-disabled .telemetry-mode,
    body.motion-disabled .theater-vector-field,
    body.motion-disabled .theater-vector-field::before,
    body.motion-disabled .theater-vector-field::after,
    body.motion-disabled .role-orbit,
    body.motion-disabled .role-orbit::before,
    body.motion-disabled .role-node > span,
    body.motion-disabled .role-core > span,
    body.motion-disabled .hero-stage img,
    body.motion-disabled .engine-node img,
    body.motion-disabled .role-node img,
    body.motion-disabled .role-core img { animation: none !important; rotate: 0deg !important; }
    .harness-modules {
      position: relative;
      z-index: 2;
      display: grid;
      grid-template-columns: repeat(7, 1fr);
      gap: 10px;
    }
    .harness-module {
      position: relative;
      display: grid;
      min-width: 0;
      padding: 0;
      border: 0;
      background: transparent;
      justify-items: center;
      gap: 22px;
      color: var(--muted);
      text-align: center;
      cursor: pointer;
    }
    .module-dot {
      display: grid;
      width: 70px;
      height: 70px;
      border: 1px solid var(--line-strong);
      border-radius: 50%;
      background: var(--ink);
      place-items: center;
      transition: border .3s, background .3s, color .3s, transform .3s;
    }
    .module-dot svg { width: 24px; height: 24px; }
    .module-label { max-width: 14ch; font-size: .68rem; line-height: 1.35; }
    .harness-module:hover .module-dot, .harness-module.is-active .module-dot {
      border-color: var(--stage);
      background: var(--stage);
      color: var(--ink);
      transform: translateY(-5px);
    }
    .harness-module.is-upstream .module-dot { border-color: rgba(var(--stage-rgb), .55); color: var(--paper); }
    .harness-module.is-downstream .module-dot { box-shadow: inset 0 0 0 4px rgba(var(--stage-rgb), .12); color: var(--paper); }
    .module-detail {
      display: grid;
      min-height: 250px;
      margin: 74px auto 0;
      padding-top: 34px;
      border-top: 1px solid var(--line);
      grid-template-columns: 180px minmax(0, 1fr) 280px;
      gap: 40px;
      align-items: start;
    }
    .module-detail h3 { margin: 0; max-width: 18ch; font-size: clamp(1.75rem, 3.5vw, 3.4rem); font-weight: 350; line-height: 1; letter-spacing: -.03em; }
    .module-detail p { max-width: 62ch; margin: 0; color: var(--soft); font-size: 1.05rem; }
    .dependency-readout { display: grid; gap: 12px; color: var(--muted); }
    .dependency-readout span { display: block; color: var(--paper); margin-top: 3px; font-size: .78rem; letter-spacing: 0; text-transform: none; }

    .role-system {
      position: relative;
      display: grid;
      margin-top: clamp(85px, 11vw, 150px);
      padding-top: clamp(65px, 8vw, 110px);
      grid-template-columns: minmax(440px, .9fr) minmax(0, 1.1fr);
      align-items: center;
      gap: clamp(55px, 8vw, 120px);
      border-top: 1px solid var(--line);
      isolation: isolate;
    }
    .role-world {
      position: absolute;
      inset: 3% -8% -8%;
      z-index: 0;
      margin: 0;
      overflow: hidden;
      opacity: .28;
      pointer-events: none;
      mask-image: linear-gradient(90deg, transparent, #000 18%, #000 84%, transparent);
    }
    .role-world img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: saturate(.65) contrast(1.18) brightness(.58);
      transform: scale(1.05) translate3d(var(--system-drift-x), var(--system-drift-y), 0);
      transition: opacity .45s, filter .8s var(--ease), transform 1.4s var(--ease);
    }
    .role-world.is-changing img { opacity: .08; filter: blur(14px) saturate(.35); transform: scale(1.11); }
    .role-world figcaption {
      position: absolute;
      right: 5%;
      bottom: 4%;
      color: var(--stage);
      font-size: .6rem;
    }
    .role-orbit, .role-detail { position: relative; z-index: 2; }
    .role-orbit {
      position: relative;
      width: min(42vw, 540px);
      aspect-ratio: 1;
      border: 1px solid rgba(var(--stage-rgb), .26);
      border-radius: 50%;
      background: radial-gradient(circle, rgba(var(--stage-rgb), .1), transparent 58%);
      animation: orbitClockwise 286s linear infinite;
    }
    .role-orbit::before { position: absolute; inset: 18%; border: 1px dashed var(--line-strong); border-radius: 50%; content: ""; animation: orbitReverse 193s linear infinite; }
    .role-core {
      position: absolute;
      inset: 34%;
      z-index: 2;
      display: grid;
      overflow: hidden;
      border: 1px solid var(--stage);
      border-radius: 50%;
      background: rgba(5,6,7,.94);
      color: var(--stage);
      place-content: center;
      text-align: center;
    }
    .role-core img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .5; animation: orbitReverse 64s linear infinite; }
    .role-core::after { position: absolute; inset: 0; content: ""; background: radial-gradient(circle, transparent, rgba(5,6,7,.9)); }
    .role-core > span { position: relative; z-index: 2; text-shadow: 0 2px 10px #000; }
    .role-node {
      position: absolute;
      z-index: 3;
      width: 112px;
      aspect-ratio: 1;
      overflow: hidden;
      padding: 10px;
      border: 1px solid var(--line-strong);
      border-radius: 50%;
      background: #080a0b;
      color: var(--soft);
      font: 500 .65rem/1.25 "Cascadia Mono", Consolas, monospace;
      text-transform: uppercase;
      cursor: pointer;
      transform: translate(-50%, -50%);
      transition: background .3s, color .3s, border-color .3s, scale .3s;
    }
    .role-node:nth-of-type(1) { left: 50%; top: 0; }
    .role-node:nth-of-type(2) { left: 93.3%; top: 25%; }
    .role-node:nth-of-type(3) { left: 93.3%; top: 75%; }
    .role-node:nth-of-type(4) { left: 50%; top: 100%; }
    .role-node:nth-of-type(5) { left: 6.7%; top: 75%; }
    .role-node:nth-of-type(6) { left: 6.7%; top: 25%; }
    .role-node:hover, .role-node.is-active { border-color: var(--stage); background: #080a0b; color: var(--paper); scale: 1.08; }
    .role-node.is-linked:not(.is-active) { border-color: var(--stage); color: var(--stage); }
    .role-node > span, .role-core > span { display: block; animation: orbitCounter 286s linear infinite; }
    .role-node > span { position: relative; z-index: 2; text-shadow: 0 2px 9px #000; }
    .role-detail > span { color: var(--stage); }
    .role-detail h3 { margin: 18px 0; font-size: clamp(2rem, 4vw, 4.5rem); font-weight: 300; line-height: .94; letter-spacing: -.035em; }
    .role-detail > p { max-width: 58ch; margin: 0; color: var(--soft); font-size: 1rem; line-height: 1.7; }
    .role-constraints { display: grid; margin-top: 35px; border-top: 1px solid var(--line); }
    .role-constraints div { display: grid; padding: 13px 0; grid-template-columns: 105px 1fr; gap: 18px; border-bottom: 1px solid var(--line); color: var(--soft); font-size: .78rem; }
    .role-constraints span { color: var(--muted); }

    /* Outcomes constellation */
    .outcomes { min-height: 980px; padding: clamp(110px, 14vw, 210px) 0; overflow: hidden; }
    .outcomes-head { position: relative; z-index: 3; max-width: 850px; }
    .constellation {
      position: relative;
      height: 600px;
      margin-top: 50px;
    }
    .constellation::before {
      position: absolute;
      left: 50%;
      top: 50%;
      width: min(56vw, 720px);
      aspect-ratio: 1;
      border: 1px solid var(--line);
      border-radius: 50%;
      content: "";
      transform: translate(-50%, -50%);
    }
    .process-step-art {
      position: absolute;
      inset: -24px -18px;
      z-index: -1;
      width: calc(100% + 36px);
      height: calc(100% + 48px);
      object-fit: cover;
      opacity: .12;
      filter: grayscale(.42) saturate(.65) contrast(1.18) brightness(.58) blur(.6px);
      mask-image: radial-gradient(ellipse, #000 0 34%, transparent 76%);
      animation: orbitCounter 240s linear infinite;
      transition: opacity .55s, filter .65s var(--ease), transform 1s var(--ease);
    }
    .process-step:hover .process-step-art, .process-step.is-active .process-step-art {
      opacity: .48;
      filter: grayscale(.05) saturate(.86) contrast(1.2) brightness(.72);
      transform: scale(1.08);
    }
    .process-step-content { position: relative; z-index: 2; }
    .constellation-core {
      position: absolute;
      left: 50%;
      top: 50%;
      z-index: 2;
      display: grid;
      width: 150px;
      aspect-ratio: 1;
      border: 1px solid var(--stage);
      border-radius: 50%;
      background: rgba(5,6,7,.9);
      color: var(--stage);
      place-items: center;
      text-align: center;
      transform: translate(-50%, -50%);
    }
    .outcome-node {
      position: absolute;
      z-index: 3;
      width: min(250px, 22vw);
      padding: 15px 0;
      border: 0;
      border-top: 1px solid var(--line-strong);
      background: transparent;
      color: var(--muted);
      text-align: left;
      cursor: pointer;
      transition: color .35s, border-color .35s, transform .35s, opacity .35s;
    }
    .outcome-node:nth-of-type(1) { left: 6%; top: 13%; }
    .outcome-node:nth-of-type(2) { right: 6%; top: 13%; }
    .outcome-node:nth-of-type(3) { right: 0; top: 47%; }
    .outcome-node:nth-of-type(4) { right: 13%; bottom: 5%; }
    .outcome-node:nth-of-type(5) { left: 13%; bottom: 5%; }
    .outcome-node:nth-of-type(6) { left: 0; top: 47%; }
    .outcome-node strong { display: block; margin-bottom: 7px; color: var(--paper); font-size: 1rem; font-weight: 500; }
    .outcome-node span { display: block; font-size: .82rem; line-height: 1.45; }
    .outcome-node.is-linked {
      border-color: var(--stage);
      color: var(--soft);
      transform: translateY(-7px);
    }
    .outcome-node.is-linked strong { color: var(--stage); }
    .outcome-node.is-active {
      border-color: var(--paper);
      color: var(--paper);
      filter: drop-shadow(0 0 12px rgba(var(--stage-rgb), .28));
    }
    .outcome-node:not(.is-linked) { opacity: .58; }

    .outcome-media {
      position: absolute;
      inset: auto 50% 10px auto;
      z-index: 1;
      width: min(52vw, 700px);
      height: 440px;
      overflow: hidden;
      opacity: .33;
      transform: translateX(50%);
      mask-image: radial-gradient(ellipse at var(--px) var(--py), #000 0, rgba(0,0,0,.85) 32%, transparent 72%);
    }
    .outcome-media img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: grayscale(.35) saturate(.65);
      opacity: 0;
      transform: scale(1.09) translate3d(var(--depth-x, 0), var(--depth-y, 0), 0);
      transition: opacity .65s var(--ease), transform .8s var(--ease), filter .65s;
    }
    .outcome-media img.is-active {
      opacity: 1;
      transform: scale(1.05) translate3d(var(--depth-x, 0), var(--depth-y, 0), 0);
    }

    /* DevMind proof */
    .devmind { padding: clamp(110px, 14vw, 205px) 0; }
    .devmind-grid {
      display: grid;
      grid-template-columns: .9fr 1.1fr;
      gap: clamp(60px, 9vw, 140px);
      align-items: center;
    }
    .devmind-copy h2 { margin: 0; max-width: 11ch; font-size: clamp(3rem, 6.6vw, 6rem); font-weight: 300; line-height: .92; letter-spacing: -.04em; }
    .devmind-copy > p { max-width: 58ch; margin: 30px 0 0; color: var(--soft); font-size: 1.08rem; }
    .devmind-links { display: flex; margin: 34px 0; gap: 10px; flex-wrap: wrap; }
    .stage-link {
      padding: 9px 12px;
      border: 1px solid var(--line);
      background: transparent;
      color: var(--soft);
      cursor: pointer;
    }
    .stage-link:hover, .stage-link.is-active { border-color: var(--stage); color: var(--stage); }
    .devmind-stage-detail {
      min-height: 150px;
      margin: 0 0 34px;
      padding: 22px 0;
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
      transition: border-color .4s, opacity .25s, transform .4s var(--ease);
    }
    .devmind-stage-detail span { color: var(--stage); }
    .devmind-stage-detail strong { display: block; margin: 10px 0 8px; font-size: 1.05rem; font-weight: 500; }
    .devmind-stage-detail p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.6; }
    .devmind-stage-detail.is-changing { opacity: .2; transform: translateY(7px); }
    .devmind-visual {
      position: relative;
      min-height: 610px;
      overflow: hidden;
      border-top: 1px solid var(--line-strong);
      border-bottom: 1px solid var(--line);
      background: #080a0c;
      transform: perspective(1000px) rotateX(var(--tilt-y, 0deg)) rotateY(var(--tilt-x, 0deg));
      transition: transform .2s;
    }
    .devmind-visual img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      min-height: 610px;
      object-fit: cover;
      opacity: 0;
      filter: grayscale(.22) saturate(.72) brightness(.72);
      mask-image: radial-gradient(circle at var(--px) var(--py), #000 0, rgba(0,0,0,.78) 45%, transparent 88%);
      transform: scale(1.06);
      transition: opacity .7s var(--ease), filter .9s var(--ease), transform 1.2s var(--ease);
    }
    .devmind-visual img.is-active { opacity: .62; filter: grayscale(0) saturate(.82) brightness(.78); transform: scale(1.015); }
    .devmind-map {
      position: absolute;
      inset: 0;
      display: grid;
      padding: 9%;
      grid-template-columns: repeat(2, 1fr);
      align-content: space-between;
      gap: 30px;
      pointer-events: none;
    }
    .devmind-map span { display: inline-flex; width: max-content; padding: 7px 9px; border: 1px solid var(--line-strong); background: rgba(5,6,7,.84); }
    .devmind-map span:nth-child(even) { justify-self: end; }

    /* Process */
    .process { overflow: hidden; padding: clamp(110px, 14vw, 210px) 0; min-height: 1050px; }
    .process-scene-field {
      position: absolute;
      inset: 0;
      z-index: 0;
      overflow: hidden;
      pointer-events: none;
    }
    .process-scene-field img {
      position: absolute;
      inset: -6%;
      width: 112%;
      height: 112%;
      object-fit: cover;
      opacity: 0;
      filter: blur(12px) saturate(.48) contrast(1.15) brightness(.53);
      transform: scale(1.1);
      transition: opacity 1s var(--ease), filter 1.5s var(--ease), transform 1.8s var(--ease);
      mask-image: radial-gradient(ellipse at 53% 61%, #000 4%, rgba(0,0,0,.78) 46%, transparent 80%);
    }
    .process-scene-field img.is-active {
      opacity: .2;
      filter: blur(.7px) saturate(.72) contrast(1.18) brightness(.62);
      transform: scale(1.025) translate3d(var(--system-drift-x), var(--system-drift-y), 0);
    }
    .hero-core, .engine-core, .theater-stage, .role-world, .outcome-media, .devmind-visual, .process-scene-field { contain: paint; }
    .process-scene-field::after {
      position: absolute;
      inset: 0;
      content: "";
      background: linear-gradient(180deg, rgba(5,6,7,.88), transparent 42%, rgba(5,6,7,.88));
    }
    .process-head { max-width: 870px; }
    .process-orbit {
      position: relative;
      width: min(78vw, 780px);
      aspect-ratio: 1;
      margin: 120px auto 20px;
      border: 1px solid var(--line-strong);
      border-radius: 50%;
    }
    .process-orbit::before, .process-orbit::after {
      position: absolute;
      border: 1px dashed var(--line);
      border-radius: 50%;
      content: "";
    }
    .process-orbit::before { inset: 17%; }
    .process-orbit::after { inset: 35%; border-style: solid; border-color: rgba(var(--stage-rgb), .5); }
    .process-center {
      position: absolute;
      inset: 39%;
      display: grid;
      border-radius: 50%;
      background: var(--stage);
      color: var(--ink);
      place-items: center;
      text-align: center;
    }
    .process-step {
      position: absolute;
      width: 240px;
      padding-block: 12px;
      border: 0;
      background: transparent;
      color: inherit;
      cursor: pointer;
      transform: translate(-50%, -50%);
    }
    .process-step:nth-of-type(1) { left: 50%; top: 0; text-align: center; }
    .process-step:nth-of-type(2) { left: 100%; top: 50%; padding-left: 38px; }
    .process-step:nth-of-type(3) { left: 50%; top: 100%; text-align: center; }
    .process-step:nth-of-type(4) { left: 0; top: 50%; padding-right: 38px; text-align: right; }
    .process-step i {
      display: inline-grid;
      width: 36px;
      height: 36px;
      margin-bottom: 12px;
      border: 1px solid var(--stage);
      border-radius: 50%;
      background: var(--ink);
      color: var(--stage);
      place-items: center;
      font: normal .7rem "Cascadia Mono", Consolas, monospace;
    }
    .process-step strong { display: block; margin: 0 0 8px; font-size: 1.05rem; font-weight: 500; }
    .process-step-content, .process-step-copy { display: block; }
    .process-step-copy { color: var(--muted); font-size: .85rem; line-height: 1.45; }
    .process-step:hover i, .process-step.is-active i { background: var(--stage); color: var(--ink); }
    .process-step.is-active strong { color: var(--stage); }

    /* Studio + contact */
    .studio { overflow: hidden; padding: clamp(100px, 12vw, 180px) 0; }
    .studio::before {
      position: absolute;
      top: 2%;
      right: -9%;
      width: min(760px, 58vw);
      aspect-ratio: 1;
      content: "";
      background: url("../brand/amastack-lockup.jpg") center / contain no-repeat;
      filter: saturate(.55) brightness(.72);
      mask-image: radial-gradient(circle, #000 14%, rgba(0,0,0,.75) 42%, transparent 73%);
      opacity: .032;
      pointer-events: none;
      transform: translate3d(calc(var(--system-drift-x) * -.35), calc(var(--system-drift-y) * -.35), 0) rotate(-7deg);
    }
    .studio-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: clamp(60px, 10vw, 160px);
      align-items: end;
    }
    .studio h2 { margin: 0; font-size: clamp(3rem, 6vw, 5.8rem); font-weight: 300; line-height: .95; letter-spacing: -.04em; }
    .studio-lead { min-width: 0; }
    .studio-visual {
      position: relative;
      height: clamp(330px, 31vw, 470px);
      margin: 58px 0 0;
      overflow: hidden;
      border-top: 1px solid var(--line-strong);
      border-bottom: 1px solid var(--line);
      mask-image: linear-gradient(90deg, transparent, #000 10%, #000 88%, transparent);
      background: #030405;
      isolation: isolate;
    }
    .studio-visual img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform:
        translate3d(
          calc(var(--depth-x, 0px) + var(--system-drift-x)),
          calc(var(--depth-y, 0px) + var(--system-drift-y)),
          0
        )
        scale(calc(var(--system-scale) + .02));
      transition: transform .7s var(--ease), filter .7s, opacity .7s;
    }
    .studio-people {
      z-index: 1;
      right: auto !important;
      width: 72% !important;
      object-position: 51% center;
      opacity: .9;
      filter: grayscale(.18) saturate(.72) contrast(1.14) brightness(.78);
      mask-image: linear-gradient(90deg, #000 0 68%, transparent 100%);
    }
    .studio-machine {
      z-index: 2;
      right: 0 !important;
      left: auto !important;
      width: 61% !important;
      object-position: center;
      opacity: .8;
      filter: grayscale(.08) saturate(.88) contrast(1.16) brightness(.72) blur(.35px);
      mask-image: linear-gradient(90deg, transparent 0, rgba(0,0,0,.74) 24%, #000 48%, #000 100%);
      transform:
        translate3d(
          calc(var(--depth-x, 0px) * -.42 + var(--system-drift-x)),
          calc(var(--depth-y, 0px) * -.42 + var(--system-drift-y)),
          0
        )
        scale(1.11);
    }
    .studio-twin {
      z-index: 3;
      top: 2% !important;
      right: 4% !important;
      bottom: auto !important;
      left: auto !important;
      width: 27% !important;
      height: 86% !important;
      object-position: 63% center;
      opacity: .25;
      filter: saturate(.86) contrast(1.2) brightness(.82) blur(1px);
      mix-blend-mode: screen;
      mask-image: radial-gradient(ellipse at 68% 48%, #000, transparent 70%);
      transform: translate3d(calc(var(--depth-x, 0px) * -.9), calc(var(--depth-y, 0px) * -.9), 0) scale(1.08);
    }
    .studio-dof {
      position: absolute;
      inset: 0;
      z-index: 4;
      pointer-events: none;
      background:
        radial-gradient(circle at 71% 26%, rgba(var(--stage-rgb),.16) 0 1px, transparent 3px),
        radial-gradient(circle at 87% 42%, rgba(255,255,255,.14) 0 2px, transparent 10px),
        radial-gradient(circle at 14% 17%, rgba(255,255,255,.11) 0 2px, transparent 15px),
        linear-gradient(90deg, rgba(3,4,5,.48), transparent 28%, transparent 72%, rgba(3,4,5,.28));
    }
    .studio-dof::before {
      position: absolute;
      top: 14%;
      right: 9%;
      width: 31%;
      aspect-ratio: 1;
      border: 1px solid rgba(var(--stage-rgb),.22);
      border-radius: 50%;
      content: "";
      box-shadow: inset 0 0 48px rgba(var(--stage-rgb),.05);
      animation: orbitClockwise 64s linear infinite;
    }
    .studio-dof::after {
      position: absolute;
      right: 7%;
      bottom: 10%;
      width: 34%;
      height: 1px;
      content: "";
      background: linear-gradient(90deg, transparent, rgba(var(--stage-rgb),.46), transparent);
      box-shadow: 0 -72px 0 rgba(var(--stage-rgb),.1), 0 -144px 0 rgba(var(--stage-rgb),.06);
    }
    .studio-visual::after {
      position: absolute;
      inset: 0;
      content: "";
      pointer-events: none;
      background:
        radial-gradient(circle at var(--px) var(--py), rgba(var(--stage-rgb), .09), transparent 28%),
        linear-gradient(180deg, rgba(5,6,7,.12), rgba(5,6,7,.56));
    }
    .studio-visual figcaption {
      position: absolute;
      right: 18px;
      top: 14px;
      z-index: 5;
      color: var(--soft);
    }
    .studio-scene-readout {
      position: absolute;
      bottom: 14px;
      left: 18px;
      z-index: 5;
      display: flex;
      align-items: center;
      gap: 12px;
      color: var(--stage);
      font-size: .6rem;
    }
    .studio-scene-readout::before { width: 30px; height: 1px; content: ""; background: currentColor; }
    .studio-copy p { max-width: 62ch; margin: 0 0 18px; color: var(--soft); }
    .studio-facts { display: flex; margin-top: 32px; gap: 12px 36px; flex-wrap: wrap; color: var(--muted); }

    .contact { padding: clamp(110px, 14vw, 210px) 0 90px; background: rgba(5,6,7,.92); }
    .contact-orbit-art {
      position: absolute;
      top: 7%;
      right: -4%;
      z-index: 0;
      width: min(52vw, 760px);
      height: 86%;
      margin: 0;
      overflow: hidden;
      pointer-events: none;
      mask-image: radial-gradient(ellipse at 58% 48%, #000, rgba(0,0,0,.72) 43%, transparent 76%);
    }
    .contact-orbit-art img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      opacity: .16;
      filter: grayscale(.72) saturate(.5) contrast(1.12) brightness(.66);
      transform:
        translate3d(
          var(--system-drift-x),
          var(--system-drift-y),
          0
        )
        scale(var(--system-scale));
    }
    .contact-orbit-art::after {
      position: absolute;
      inset: 0;
      content: "";
      background: linear-gradient(90deg, var(--ink) 4%, rgba(5,6,7,.88) 26%, transparent 72%);
    }
    .contact-grid {
      display: grid;
      grid-template-columns: .85fr 1.15fr;
      gap: clamp(60px, 9vw, 140px);
      align-items: start;
    }
    .contact-copy { position: sticky; top: calc(var(--nav-h) + 40px); }
    .contact-sense {
      display: grid;
      width: 72px;
      height: 72px;
      margin-bottom: 42px;
      border: 1px solid var(--stage);
      border-radius: 50%;
      color: var(--stage);
      place-items: center;
    }
    .contact h2 { margin: 0; max-width: 8ch; font-size: clamp(3.6rem, 7vw, 7rem); font-weight: 300; line-height: .86; letter-spacing: -.04em; }
    .contact-copy p { max-width: 48ch; margin: 30px 0 0; color: var(--soft); }
    .contact-form { display: grid; gap: 30px; }
    .field { position: relative; display: grid; gap: 9px; }
    .field label { color: var(--soft); }
    .field input, .field select, .field textarea {
      width: 100%;
      min-height: 60px;
      padding: 10px 0;
      border: 0;
      border-bottom: 1px solid var(--line-strong);
      border-radius: 0;
      outline: 0;
      background: transparent;
      color: var(--paper);
      font-size: 1.08rem;
      transition: border-color .25s, background .25s;
    }
    .field select { color-scheme: dark; }
    .field textarea { min-height: 130px; resize: vertical; }
    .field input:focus, .field select:focus, .field textarea:focus { border-color: var(--stage); background: rgba(var(--stage-rgb), .025); }
    .field input::placeholder, .field textarea::placeholder { color: #707a77; opacity: 1; }
    .form-end { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
    .form-note { max-width: 44ch; margin: 0; color: var(--muted); font-size: .78rem; }
    .form-status { min-height: 20px; margin: 0; color: var(--stage); }

    .site-footer {
      border-top: 1px solid var(--line);
      background: var(--ink);
    }
    .footer-main {
      display: grid;
      padding: 54px 0;
      grid-template-columns: 1fr auto;
      gap: 30px;
      align-items: center;
    }
    .footer-main p { margin: 0; color: var(--muted); }
    .footer-links { display: flex; gap: 28px; color: var(--soft); font-size: .8rem; }
    .footer-meta {
      display: flex;
      padding: 20px 0;
      border-top: 1px solid var(--line);
      justify-content: space-between;
      color: var(--muted);
    }

    @media (max-width: 1080px) {
      .shell { width: min(calc(100% - 48px), var(--max)); }
      .nav-inner { grid-template-columns: 1fr auto; }
      .nav-links {
        position: absolute;
        top: var(--nav-h);
        right: 0;
        left: 0;
        display: none;
        padding: 22px 24px 30px;
        border-bottom: 1px solid var(--line);
        background: #050607;
        flex-direction: column;
        align-items: flex-start;
      }
      .nav-links.is-open { display: flex; }
      .nav-links a { font-size: .92rem; }
      .nav-cta { display: none; }
      .menu-button { display: grid; justify-self: end; }
      .hero-grid { grid-template-columns: 1fr minmax(390px, .75fr); }
      .capability-map-flow { grid-template-columns: 1fr; gap: 10px; }
      .hero-orbit { width: min(48vw, 560px); }
      .engine-shell { min-height: 680px; }
      .engine-ring { width: min(72vw, 680px); }
      .engine-node { width: 104px; }
      .harness-modules { grid-template-columns: repeat(4, 1fr); gap: 38px 8px; }
      .role-system { grid-template-columns: 1fr; }
      .role-orbit { width: min(72vw, 520px); margin-inline: auto; }
      .harness-rail { display: none; }
      .module-detail { grid-template-columns: 130px 1fr; }
      .dependency-readout { grid-column: 2; }
      .outcome-node { width: 210px; }
    }

    @media (max-width: 780px) {
      :root { --nav-h: 68px; }
      .shell { width: min(calc(100% - 32px), var(--max)); }
      .section-heading { font-size: clamp(2.55rem, 13vw, 4.6rem); }
      .section-rule { margin-bottom: 72px; }
      .hero { padding-top: calc(var(--nav-h) + 66px); }
      .hero-grid { display: block; min-height: auto; }
      .hero h1 { font-size: clamp(3.5rem, 17vw, 6rem); }
      .hero-scene-world { opacity: .2; object-position: 62% center; }
      .hero-scene-team { top: 35%; right: -30%; width: 118%; height: 65%; opacity: .25; }
      .hero-scene-micro { top: 18%; right: -6%; width: 60%; height: 35%; opacity: .15; }
      .hero-lead { margin-top: 28px; }
      .hero-orbit { width: min(92vw, 520px); margin: 70px auto 10px; }
      .motion-toggle { position: relative; inset: auto; margin: 28px 0 0 auto; }
      .hero-stage-response { grid-template-columns: 100px 1fr; }
      .hero-stage-response code { grid-column: 2; white-space: normal; }
      .hero-stage { width: 64px; height: 64px; }
      .hero-stage img, .engine-node img, .role-node img {
        animation: none;
        filter: saturate(.76) contrast(1.12);
        transition: opacity .28s, scale .38s var(--ease);
      }
      .hero-stage:hover img, .hero-stage.is-active img,
      .engine-node:hover img, .engine-node.is-active img,
      .role-node:hover img, .role-node.is-active img {
        filter: saturate(.76) contrast(1.12);
      }
      .hero[data-active-stage] .stage-telemetry { animation: none; }
      .loop-readout { bottom: -4%; }
      .engine-head, .harness-intro, .devmind-grid, .studio-grid, .contact-grid { grid-template-columns: 1fr; gap: 40px; }
      .theater-head { grid-template-columns: 1fr; gap: 40px; }
      .expertise-intro { grid-template-columns: 1fr; gap: 34px; }
      .expertise-intro p { justify-self: auto; }
      .expertise-node { grid-template-columns: 52px minmax(0, 1fr) 100px; gap: 18px; }
      .expertise-node p { grid-column: 2; }
      .expertise-node figure { grid-column: 3; grid-row: 1 / span 2; width: 92px; }
      .expertise-backdrop { mask-image: linear-gradient(90deg, transparent 12%, #000 64%, transparent); }
      .expertise-backdrop img { right: -16%; width: 92%; opacity: .1; }
      .theater-stage { min-height: 1050px; }
      .theater-stage-art-team { top: 32%; width: 100%; height: 46%; opacity: .27; }
      .theater-stage-art-detail { right: 4%; bottom: 23%; width: 42%; height: 22%; opacity: .58; }
      .theater-readout { top: 6%; left: 6%; width: 88%; }
      .theater-readout h3 { font-size: clamp(2.8rem, 13vw, 5.6rem); }
      .scale-probes { grid-template-columns: repeat(2, 1fr); }
      .scale-probe { min-height: 132px; }
      .studio-visual { height: 330px; margin-top: 38px; }
      .studio::before { top: 8%; right: -42%; width: 120vw; opacity: .04; }
      .studio-people { width: 86% !important; object-position: 56% center; }
      .studio-machine { width: 72% !important; opacity: .73; object-position: 43% center; }
      .studio-twin { right: -5% !important; width: 34% !important; opacity: .2; }
      .studio-visual figcaption { display: none; }
      .studio-scene-readout { right: 14px; left: 14px; font-size: .5rem; white-space: nowrap; }
      .engine-head .section-intro { justify-self: auto; }
      .engine-shell { min-height: 570px; }
      .engine-ring { width: min(78vw, 500px); }
      .engine-node { width: 84px; font-size: .72rem; }
      .engine-node small { margin-bottom: 4px; font-size: .56rem; }
      .engine-core { inset: 27%; }
      .engine-copy { padding: 14%; }
      .engine-copy p { display: none; }
      .lock-status { bottom: -22px; }
      .harness-modules { grid-template-columns: repeat(2, 1fr); }
      .role-system { gap: 90px; }
      .role-world { inset: 3% -12% 26%; opacity: .2; }
      .role-world figcaption { right: 14%; bottom: 2%; }
      .role-orbit { width: min(72vw, 400px); }
      .role-node { width: 88px; font-size: .55rem; }
      .module-detail { min-height: auto; grid-template-columns: 1fr; gap: 22px; }
      .dependency-readout { grid-column: auto; }
      .constellation { height: auto; margin-top: 70px; padding: 110px 0; display: grid; gap: 28px; }
      .constellation, .outcome-node, .constellation-core, .outcome-media,
      .outcome-node > *, .constellation-core > *, .outcome-media > * { animation: none; rotate: 0deg; transform: none; }
      .constellation::before { width: 360px; top: 20px; transform: translate(-50%, 0); }
      .constellation-core { top: 0; width: 112px; }
      .outcome-node {
        position: relative;
        inset: auto !important;
        width: 100%;
        padding-left: 22%;
      }
      .outcome-node::before { position: absolute; top: -1px; left: 0; width: 18%; height: 1px; content: ""; background: var(--stage); }
      .outcome-media { inset: 0; width: 100%; height: 100%; transform: none; opacity: .14; }
      .devmind-visual, .devmind-visual img { min-height: 470px; }
      .hero-core img, .engine-core img, .theater-stage-art, .role-world img,
      .devmind-visual img, .process-scene-field img {
        transition-property: opacity, transform;
        transition-duration: .45s, .7s;
      }
      .hero-core.is-changing img {
        opacity: .32;
        filter: saturate(.72) contrast(1.12);
        transform: scale(1.025);
      }
      .engine-core.is-changing img {
        opacity: .28;
        filter: grayscale(.2) saturate(.72) contrast(1.12);
        transform: scale(1.025);
      }
      .theater-stage.is-changing .theater-stage-art,
      .role-world.is-changing img {
        opacity: .24;
        filter: saturate(.68) contrast(1.08);
        transform: scale(1.045);
      }
      .devmind-visual img,
      .devmind-visual img.is-active {
        filter: saturate(.74) brightness(.74);
      }
      .process-scene-field img,
      .process-scene-field img.is-active {
        filter: saturate(.68) contrast(1.12) brightness(.58);
        mask-image: none;
      }
      .process-scene-field::after {
        background:
          radial-gradient(ellipse at 53% 61%, transparent 5%, rgba(5,6,7,.2) 48%, #050607 82%),
          linear-gradient(180deg, rgba(5,6,7,.88), transparent 42%, rgba(5,6,7,.88));
      }
      .process { min-height: auto; }
      .process-orbit { width: min(68vw, 420px); margin: 170px auto; }
      .process-step { width: 170px; }
      .process-step:nth-of-type(2) { padding-left: 24px; }
      .process-step:nth-of-type(4) { padding-right: 24px; }
      .process-step-copy { font-size: .75rem; }
      .contact-copy { position: static; }
      .contact-orbit-art { top: 2%; right: -35%; width: 120%; height: 58%; opacity: .62; }
      .form-end { align-items: flex-start; flex-direction: column; }
      .footer-main { grid-template-columns: 1fr; }
      .footer-links, .footer-meta { flex-wrap: wrap; gap: 16px 28px; }
    }

    @media (max-width: 480px) {
      .hero-stage { width: 58px; height: 58px; }
      .capability-map { margin-bottom: 24px; }
      .capability-map-head { align-items: flex-start; flex-direction: column; gap: 6px; }
      .capability-map-head p { max-width: 36ch; }
      .capability-tab { min-height: 48px; padding: 0 8px; font-size: .56rem; text-align: center; }
      .capability-stage-map { display: grid; grid-template-columns: repeat(3, 1fr); }
      .capability-stage-token { padding: 0 5px; }
      .capability-engine-link { grid-column: 1 / -1; width: max-content; margin: 5px 0 0; }
      .expertise-node { min-height: 170px; grid-template-columns: 34px minmax(0, 1fr) 68px; gap: 13px; }
      .expertise-node h3 { font-size: 2rem; }
      .expertise-node p { grid-column: 2 / -1; font-size: .82rem; }
      .expertise-node figure { width: 64px; }
      .trajectory-line { stroke-width: .4; }
      .trajectory-edge:hover .trajectory-line,
      .trajectory-edge:focus-visible .trajectory-line,
      .trajectory-edge.is-active .trajectory-line { stroke-width: .8; }
      .hero-core { inset: 25%; }
      .hero-core-data strong { font-size: .78rem; }
      .hero-core-data code { font-size: .52rem; }
      .hero-stage-response { grid-template-columns: 1fr; gap: 8px; }
      .hero-stage-response code { grid-column: auto; }
      .engine-shell { min-height: 450px; }
      .engine-ring { width: min(76vw, 350px); }
      .engine-node { width: 68px; }
      .engine-node strong { font-size: .68rem; }
      .engine-core { inset: 28%; }
      .engine-copy h3 { margin-top: 7px; font-size: 1.1rem; }
      .process-orbit { width: 54vw; margin: 180px auto; }
      .scene-metrics { grid-template-columns: 1fr; }
      .theater-stage { min-height: 1120px; }
      .process-step { width: 145px; }
      .process-step:nth-of-type(1) { top: -10%; }
      .process-step:nth-of-type(2) { left: 112%; }
      .process-step:nth-of-type(3) { top: 110%; }
      .process-step:nth-of-type(4) { left: -12%; }
    }

    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      body:not(.motion-override) *, body:not(.motion-override) *::before, body:not(.motion-override) *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
      }
      body:not(.motion-override) .system-canvas { opacity: .38; }
      body:not(.motion-override) .section-backdrop img { transform: scale(1.035); }
      body:not(.motion-override) .studio-visual img,
      body:not(.motion-override) .contact-orbit-art img { transform: scale(1.04); }
      body:not(.motion-override) .hero-orbit,
      body:not(.motion-override) .hero-orbit::after,
      body:not(.motion-override) .hero-stage,
      body:not(.motion-override) .hero-core,
      body:not(.motion-override) .loop-readout,
      body:not(.motion-override) .motion-toggle,
      body:not(.motion-override) .engine-ring,
      body:not(.motion-override) .engine-ring::before,
      body:not(.motion-override) .engine-node,
      body:not(.motion-override) .engine-core,
      body:not(.motion-override) .constellation,
      body:not(.motion-override) .constellation::before,
      body:not(.motion-override) .outcome-node,
      body:not(.motion-override) .constellation-core,
      body:not(.motion-override) .outcome-media,
      body:not(.motion-override) .process-orbit,
      body:not(.motion-override) .process-orbit::before,
      body:not(.motion-override) .process-orbit::after,
      body:not(.motion-override) .process-step,
      body:not(.motion-override) .process-center {
        animation: none !important;
        rotate: 0deg !important;
      }
    }

    /* Multipage composition */
    body[data-page="expertise"] { --stage: #78e6c8; --stage-rgb: 120, 230, 200; }
    body[data-page="systems"] { --stage: #b9a7ff; --stage-rgb: 185, 167, 255; }
    body[data-page="applications"] { --stage: #d5e45d; --stage-rgb: 213, 228, 93; }
    body[data-page="studio"] { --stage: #ff8fa3; --stage-rgb: 255, 143, 163; }
    .nav-links a[aria-current="page"] { color: var(--paper); }
    .nav-links a[aria-current="page"]::after { transform: scaleX(1); }
    .page-hero {
      min-height: min(920px, 100svh);
      padding: calc(var(--nav-h) + clamp(80px, 10vw, 150px)) 0 clamp(100px, 12vw, 170px);
      overflow: hidden;
    }
    .page-hero-media {
      position: absolute;
      inset: 0;
      z-index: 0;
      overflow: hidden;
      pointer-events: none;
      background: linear-gradient(90deg, #050607 0 22%, transparent 68%), linear-gradient(180deg, rgba(5,6,7,.24), #050607);
    }
    .page-hero-layer {
      position: absolute;
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: saturate(.68) contrast(1.16) brightness(.58);
    }
    .page-hero-layer-1 {
      inset: 0;
      opacity: .34;
      mask-image: linear-gradient(90deg, transparent 4%, rgba(0,0,0,.28) 34%, #000 74%, transparent);
      transform: scale(1.045);
    }
    .page-hero-layer-2 {
      top: 8%;
      right: -4%;
      width: 62%;
      height: 78%;
      opacity: .25;
      mix-blend-mode: screen;
      mask-image: radial-gradient(ellipse, #000 12%, transparent 72%);
      transform: translate3d(var(--system-drift-x), var(--system-drift-y), 0) scale(1.06);
    }
    .page-hero-layer-3 {
      top: 18%;
      right: 12%;
      width: 32%;
      height: 42%;
      opacity: .16;
      mix-blend-mode: screen;
      mask-image: radial-gradient(circle, #000, transparent 70%);
    }
    .page-hero-grid {
      position: relative;
      z-index: 2;
      display: grid;
      min-height: 630px;
      grid-template-columns: minmax(0, 1fr) minmax(380px, .72fr);
      align-items: center;
      gap: clamp(70px, 10vw, 160px);
    }
    .page-hero-copy { max-width: 850px; }
    .page-index { display: block; margin-bottom: 34px; color: var(--stage); }
    .page-hero h1 {
      margin: 0;
      max-width: 10ch;
      font-size: clamp(4.5rem, 8.4vw, 8.4rem);
      font-weight: 280;
      line-height: .84;
      letter-spacing: -.055em;
      text-wrap: balance;
    }
    .page-hero-copy > p {
      max-width: 61ch;
      margin: 38px 0 0;
      color: var(--soft);
      font-size: clamp(1.06rem, 1.35vw, 1.28rem);
    }
    .page-hero-instrument {
      position: relative;
      width: min(34vw, 490px);
      aspect-ratio: 1;
      justify-self: end;
      border: 1px solid rgba(var(--stage-rgb),.28);
      border-radius: 50%;
      background: radial-gradient(circle, rgba(var(--stage-rgb),.06), transparent 60%);
    }
    .instrument-axis, .instrument-axis::before {
      position: absolute;
      inset: 50% -16% auto;
      height: 1px;
      content: "";
      background: linear-gradient(90deg, transparent, rgba(var(--stage-rgb),.48), transparent);
    }
    .instrument-axis::before { inset: auto; width: 132%; transform: rotate(90deg); transform-origin: center; }
    .instrument-orbit {
      position: absolute;
      inset: 12%;
      border: 1px dashed rgba(var(--stage-rgb),.46);
      border-radius: 50%;
      animation: orbitClockwise 190s linear infinite;
    }
    .instrument-orbit-b { inset: 29% 5%; animation: orbitReverse 143s linear infinite; }
    .instrument-core {
      position: absolute;
      inset: 37%;
      border: 1px solid var(--stage);
      border-radius: 50%;
      background: radial-gradient(circle, rgba(var(--stage-rgb),.22), transparent 70%);
    }
    .instrument-readout {
      position: absolute;
      right: 8%;
      bottom: 11%;
      padding: 10px 12px;
      border: 1px solid var(--line-strong);
      background: rgba(5,6,7,.84);
      color: var(--stage);
      line-height: 1.7;
    }
    .page-hero .motion-toggle { top: auto; right: 0; bottom: 0; }

    .page-subnav {
      position: sticky;
      top: var(--nav-h);
      z-index: 40;
      border-block: 1px solid var(--line);
      background: rgba(5,6,7,.96);
    }
    .page-subnav .shell { display: flex; min-height: 58px; align-items: center; gap: 32px; }
    .page-subnav a { color: var(--soft); font-size: .78rem; }
    .page-subnav a:hover, .page-subnav a[aria-current] { color: var(--stage); }

    .pathways, .technology-field, .application-contexts, .contact-expectation { padding: clamp(110px, 14vw, 210px) 0; overflow: hidden; }
    .pathways-head, .technology-head {
      display: grid;
      margin-bottom: clamp(70px, 9vw, 130px);
      grid-template-columns: 1.2fr .8fr;
      align-items: end;
      gap: 70px;
    }
    .pathways-head .section-intro, .technology-head .section-intro { justify-self: end; }
    .pathway-rail { border-top: 1px solid var(--line-strong); }
    .pathway-row {
      position: relative;
      display: grid;
      min-height: 250px;
      overflow: hidden;
      padding: 44px 34px;
      border-bottom: 1px solid var(--line);
      grid-template-columns: 150px minmax(280px, .8fr) minmax(320px, 1fr) 42px;
      align-items: center;
      gap: clamp(24px, 4vw, 70px);
      isolation: isolate;
    }
    .pathway-row::after {
      position: absolute;
      inset: 0;
      z-index: -1;
      content: "";
      background: linear-gradient(90deg, rgba(var(--stage-rgb),.08), transparent 46%);
      opacity: 0;
      transition: opacity .45s;
    }
    .pathway-row > img {
      position: absolute;
      inset: 0 0 0 auto;
      z-index: -2;
      width: 62%;
      height: 100%;
      object-fit: cover;
      opacity: .13;
      filter: saturate(.66) contrast(1.18);
      mask-image: linear-gradient(90deg, transparent, #000);
      transition: opacity .5s, transform 1s var(--ease);
    }
    .pathway-row > span { color: var(--stage); }
    .pathway-row > strong { max-width: 17ch; font-size: clamp(2rem, 3.4vw, 4rem); font-weight: 320; line-height: .96; letter-spacing: -.035em; }
    .pathway-row > p { max-width: 50ch; margin: 0; color: var(--soft); }
    .pathway-row > i { color: var(--stage); font-size: 1.6rem; font-style: normal; transition: transform .4s var(--ease); }
    .pathway-row:hover::after { opacity: 1; }
    .pathway-row:hover > img { opacity: .22; transform: scale(1.035); }
    .pathway-row:hover > i { transform: translate(6px, -6px); }

    .home-proof { padding: clamp(110px, 14vw, 210px) 0; }
    .home-proof-grid { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(60px, 9vw, 140px); }
    .home-proof-copy h2 { margin: 0; max-width: 12ch; font-size: clamp(3.2rem, 6vw, 6.7rem); font-weight: 280; line-height: .9; letter-spacing: -.045em; }
    .home-proof-copy p { max-width: 58ch; margin: 30px 0 36px; color: var(--soft); }
    .home-proof-visual { position: relative; height: min(62vw, 650px); margin: 0; overflow: hidden; border-block: 1px solid var(--line); }
    .home-proof-visual img { width: 100%; height: 100%; object-fit: cover; opacity: .62; filter: saturate(.76) contrast(1.14); mask-image: radial-gradient(ellipse, #000 15%, transparent 78%); }

    .technology-rail { border-top: 1px solid var(--line-strong); }
    .technology-rail > div {
      display: grid;
      min-height: 150px;
      padding: 34px 0;
      border-bottom: 1px solid var(--line);
      grid-template-columns: minmax(160px, .55fr) minmax(280px, .9fr) 1fr;
      align-items: center;
      gap: 44px;
    }
    .technology-rail span { color: var(--stage); }
    .technology-rail strong { font-size: clamp(1.4rem, 2.3vw, 2.5rem); font-weight: 380; }
    .technology-rail p { max-width: 54ch; margin: 0; color: var(--soft); }

    .context-rail { border-top: 1px solid var(--line-strong); }
    .context-row {
      position: relative;
      display: grid;
      min-height: 420px;
      overflow: hidden;
      padding: 60px 44% 60px 0;
      border-bottom: 1px solid var(--line);
      align-content: center;
    }
    .context-row > span { margin-bottom: 25px; color: var(--stage); }
    .context-row h2 { margin: 0; max-width: 16ch; font-size: clamp(2.7rem, 5vw, 5.7rem); font-weight: 280; line-height: .9; letter-spacing: -.045em; }
    .context-row p { max-width: 58ch; margin: 28px 0 0; color: var(--soft); }
    .context-row img {
      position: absolute;
      inset: 0 0 0 auto;
      width: 48%;
      height: 100%;
      object-fit: cover;
      opacity: .26;
      filter: saturate(.7) contrast(1.16);
      mask-image: linear-gradient(90deg, transparent, #000 32%, transparent 100%);
    }

    .page-cta { padding: clamp(100px, 12vw, 180px) 0; }
    .page-cta-grid { display: grid; grid-template-columns: minmax(130px, .35fr) 1fr minmax(280px, .65fr) auto; align-items: center; gap: clamp(30px, 5vw, 80px); }
    .page-cta-grid > span { color: var(--stage); }
    .page-cta h2 { margin: 0; max-width: 16ch; font-size: clamp(2.8rem, 5vw, 5.8rem); font-weight: 280; line-height: .9; letter-spacing: -.045em; }
    .page-cta p { max-width: 42ch; margin: 0; color: var(--soft); }

    .contact-expectation-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(60px, 9vw, 140px); }
    .contact-expectation h2 { margin: 22px 0 0; max-width: 11ch; font-size: clamp(3rem, 5vw, 5.8rem); font-weight: 280; line-height: .9; letter-spacing: -.045em; }
    .contact-expectation .technology-rail > div { grid-template-columns: .55fr 1fr; }
    .contact-expectation .technology-rail strong { font-size: 1.25rem; }
    .footer-links { flex-wrap: wrap; justify-content: flex-end; }

    @media (max-width: 1080px) {
      .page-hero-grid { grid-template-columns: 1fr minmax(300px, .62fr); }
      .pathway-row { grid-template-columns: 110px minmax(240px, .8fr) 1fr 32px; padding-inline: 18px; }
      .page-cta-grid { grid-template-columns: 120px 1fr; }
      .page-cta-grid > p, .page-cta-grid > a, .page-cta-grid > div { grid-column: 2; }
    }

    @media (max-width: 780px) {
      .page-hero { min-height: auto; padding-top: calc(var(--nav-h) + 76px); }
      .page-hero-grid { min-height: 760px; grid-template-columns: 1fr; align-content: start; gap: 70px; }
      .page-hero h1 { font-size: clamp(3.7rem, 16vw, 6.2rem); }
      .page-hero-copy > p { margin-top: 28px; }
      .page-hero-instrument { width: min(78vw, 380px); justify-self: center; }
      .page-hero .motion-toggle { position: relative; inset: auto; justify-self: end; margin: 0; }
      .page-hero-layer-1 { opacity: .24; }
      .page-hero-layer-2 { top: 34%; right: -24%; width: 110%; height: 58%; }
      .page-hero-layer-3 { display: none; }
      .page-subnav { overflow-x: auto; }
      .page-subnav .shell { width: max-content; min-width: calc(100% - 32px); }
      .pathways-head, .technology-head, .home-proof-grid, .contact-expectation-grid { grid-template-columns: 1fr; gap: 38px; }
      .pathways-head .section-intro, .technology-head .section-intro { justify-self: auto; }
      .pathway-row { min-height: 310px; padding: 36px 18px; grid-template-columns: 1fr 28px; align-content: center; gap: 18px; }
      .pathway-row > span, .pathway-row > strong, .pathway-row > p { grid-column: 1; }
      .pathway-row > i { grid-column: 2; grid-row: 1 / span 3; }
      .pathway-row > img { width: 100%; opacity: .11; mask-image: linear-gradient(90deg, transparent, #000 60%, transparent); }
      .home-proof-visual { height: 470px; }
      .technology-rail > div, .contact-expectation .technology-rail > div { grid-template-columns: 1fr; gap: 15px; }
      .technology-rail > div { padding: 30px 0; }
      .context-row { min-height: 620px; padding: 50px 0 300px; align-content: start; }
      .context-row img { inset: auto 0 0; width: 100%; height: 320px; mask-image: linear-gradient(180deg, transparent, #000 32%, transparent); }
      .page-cta-grid { grid-template-columns: 1fr; gap: 28px; }
      .page-cta-grid > p, .page-cta-grid > a, .page-cta-grid > div { grid-column: auto; }
      .footer-links { justify-content: flex-start; }
    }