/* ONYX LABS: company pages (about, technology, contact). Loaded after css/styles.css; reuses its tokens, nav, footer, buttons. */

/* ============ LAYERS ============ */
#co-film{position:fixed;inset:0;width:100vw;height:100vh;height:100lvh;max-width:none;z-index:0;pointer-events:none;background:#000;filter:saturate(.6) contrast(1.05)}
#co-nodes{position:fixed;inset:0;width:100vw;height:100vh;height:100lvh;max-width:none;z-index:1;pointer-events:none}
.no-film #co-film{display:none}
.co main{position:relative;z-index:2}
.co .footer{z-index:2}

.dd-panel{opacity:0;transform:translateY(-4px) scale(.98);transition:opacity 180ms ease,transform 220ms var(--ease-out)}
.dd-panel.is-open{opacity:1;transform:none}

/* ============ CHAPTER RAIL ============ */
.co-rail{position:fixed;right:max(20px,env(safe-area-inset-right));top:50%;z-index:40;transform:translateY(-50%);pointer-events:none;opacity:0;transition:opacity 400ms ease;
  font-family:"Martian Mono",ui-monospace,monospace;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(233,236,239,.42)}
.co-rail.is-shown{opacity:1}
.co-rail ol{display:flex;flex-direction:column;align-items:flex-end;gap:14px}
.co-rail li{display:flex;align-items:center;gap:10px}
.co-rail .r-name{max-width:0;overflow:hidden;white-space:nowrap;opacity:0;transition:max-width 500ms var(--ease-out),opacity 300ms ease}
.co-rail i{display:block;width:12px;height:1px;background:rgba(233,236,239,.3);transition:width 500ms var(--ease-out),background-color 300ms ease}
.co-rail li.is-past{color:rgba(233,236,239,.62)}
.co-rail li.is-past i{background:rgba(233,236,239,.6)}
.co-rail li.is-on{color:var(--chrome-hi)}
.co-rail li.is-on .r-name{max-width:16em;opacity:1}
.co-rail li.is-on i{width:36px;background:var(--chrome-1)}
@media (max-width:1279px){.co-rail{display:none}}
.menu-open .co-rail{opacity:0}

/* ============ TYPE ============ */
.co-h1{font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:112%;font-weight:400;font-size:clamp(2.6rem,min(6.4vw,10.5svh),6.5rem);line-height:1.02;letter-spacing:-.025em;color:var(--text);text-wrap:balance}
.co-display{font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:106%;font-weight:400;font-size:clamp(1.75rem,3.6vw,3.6rem);line-height:1.14;letter-spacing:-.018em;color:var(--text);text-wrap:balance}
.co-lead{font-size:clamp(1.0625rem,1.35vw,1.3125rem);line-height:1.55;color:var(--body);font-weight:450;letter-spacing:.005em}
.co-eyebrow{display:inline-flex;align-items:center;gap:12px;color:var(--chrome-2);margin-bottom:22px}
.co-eyebrow::before{content:"";width:28px;height:1px;background:linear-gradient(90deg,var(--chrome-1),transparent)}
.co-center .co-eyebrow::after{content:"";width:28px;height:1px;background:linear-gradient(270deg,var(--chrome-1),transparent)}
.co-mute{color:var(--mute)}
.co-text{color:var(--body);max-width:40rem}
.co-text + .co-text{margin-top:14px}
.co h2.h2 + .co-lead,.co .h2 + .co-text{margin-top:22px}

/* split + reveals (CSS driven, js/company.js adds .is-in) */
.co-ready [data-split]:not(.is-in) .wi{transform:translateY(112%)}
.co [data-split] .wi{transition:transform 1000ms var(--ease-reveal);transition-delay:calc(var(--i,0) * 38ms)}
.co-ready [data-reveal]:not(.is-in){opacity:0;transform:translateY(22px)}
.co [data-reveal]{transition:opacity 900ms var(--ease-reveal),transform 1000ms var(--ease-reveal);transition-delay:var(--d,0ms)}
.co-ready [data-reveal="fade"]:not(.is-in){transform:none}
.co-ready [data-reveal="media"]:not(.is-in){opacity:1;transform:none}
.co-ready [data-reveal="media"]:not(.is-in) > *{clip-path:inset(0 0 100% 0)}
.co [data-reveal="media"] > *{transition:clip-path 1200ms var(--ease-io)}

/* scrubbed statement */
[data-scrub] .wi{opacity:.16;transition:opacity 420ms ease}
[data-scrub] .wi.lit{opacity:1}

/* ============ LAYOUT ============ */
.co-sec{position:relative;padding-block:var(--sec-pad)}
.co-sec--s{padding-block:clamp(5rem,8vw,8rem)}
.co-center{text-align:center;display:flex;flex-direction:column;align-items:center}
.co-center p{margin-inline:auto}
.co-head{max-width:56rem;margin-bottom:clamp(40px,5vw,72px)}
.co-split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);align-items:start}
.co-split > .l{grid-column:1/6}
.co-split > .r{grid-column:7/13}
@media (max-width:1023px){.co-split > .l,.co-split > .r{grid-column:1/-1}.co-split{row-gap:40px}}

.co-scrim{position:relative;isolation:isolate}
.co-scrim::before{content:"";position:absolute;inset:-18% -14%;z-index:-1;pointer-events:none;background:radial-gradient(58% 58% at 50% 50%,rgba(5,5,6,.82),rgba(5,5,6,.5) 45%,rgba(5,5,6,0) 74%)}

/* glass-free panel (no backdrop blur over the moving film: cheaper and crisper) */
.co-card{position:relative;isolation:isolate;background:linear-gradient(180deg,rgba(18,19,21,.86),rgba(9,9,10,.86));border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--shadow-card);padding:clamp(22px,2.4vw,34px);overflow:hidden}
.co-card::before{content:"";position:absolute;top:0;left:12%;right:12%;height:1px;background:linear-gradient(90deg,transparent,rgba(233,236,239,.45),transparent);pointer-events:none}
.co-card h3{margin-top:4px}
.co-card p{color:var(--body);margin-top:12px;font-size:16px;line-height:1.6}
@media (hover:hover) and (pointer:fine){.co-card{transition:border-color 300ms ease}.co-card:hover{border-color:var(--line-hi)}}
.co-ico{width:46px;height:46px;border-radius:50%;border:1px solid var(--line-hi);display:grid;place-items:center;font-size:21px;color:var(--chrome-1);background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.12),rgba(255,255,255,.02) 60%);margin-bottom:18px}
.co-fact{display:block;margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-family:"Martian Mono",ui-monospace,monospace;font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--chrome-2)}
.co-grid{display:grid;gap:var(--gap)}
.co-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.co-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.co-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1023px){.co-grid--3,.co-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.co-grid--3,.co-grid--2,.co-grid--4{grid-template-columns:minmax(0,1fr)}}

/* ============ HERO ============ */
.co-hero{height:185vh}
.co-hero-stage{position:sticky;top:0;height:100vh;height:100svh;display:grid;place-items:center;overflow:hidden}
.co-hero-stage::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(46% 42% at 50% 50%,rgba(5,5,6,.72),rgba(5,5,6,0) 100%)}
.co-hero-copy{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px;max-width:min(100%,74rem);padding:var(--nav-h) var(--gutter) 0;will-change:opacity,transform}
.co-hero-copy .co-lead{max-width:44rem}
.co-hero-copy .co-eyebrow{margin-bottom:0}
.co-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px;color:var(--chrome-2)}
.co-meta span{display:inline-flex;align-items:center;gap:22px}
.co-meta span + span::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--chrome-3)}
.co-hero .cta-row{margin-top:4px}
.co-cue{position:absolute;left:50%;bottom:max(28px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--mute)}
.co-cue i{display:block;width:1px;height:46px;background:linear-gradient(var(--chrome-1),transparent);transform-origin:top;animation:co-cue 2.4s var(--ease-io) infinite}
@keyframes co-cue{0%{transform:scaleY(0);opacity:1}55%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
[data-motion="paused"] .co-cue i{animation:none}
.co-index{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:6px}
.co-index a{font-family:"Martian Mono",ui-monospace,monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--body);padding:9px 12px;border:1px solid var(--line-hi);border-radius:var(--r-pill);background:rgba(8,8,10,.5);transition:color 200ms ease,border-color 200ms ease}
.co-index a b{color:var(--chrome-3);font-weight:400;margin-right:6px}
@media (hover:hover) and (pointer:fine){.co-index a:hover{color:var(--text);border-color:rgba(255,255,255,.4)}}
@media (max-width:767px){.co-hero{height:165vh}.co-index{display:none}.co-hero .cta-row .btn{flex:1 1 auto}}

/* ============ PINNED STATEMENT ============ */
.co-pin{height:260vh}
.co-pin-stage{position:sticky;top:0;height:100vh;height:100svh;display:grid;place-items:center;overflow:hidden}
.co-pin-inner{max-width:68rem;padding:var(--nav-h) var(--gutter) 0;text-align:center}
.co-pin-inner .co-display{max-width:none}
.co-chapter{display:inline-flex;align-items:center;gap:14px;color:var(--chrome-2);margin-bottom:28px}
.co-chapter b{font-weight:400;color:var(--chrome-hi)}
.co-chapter i{width:44px;height:1px;background:var(--chrome-3)}
@media (max-width:767px){.co-pin{height:200vh}}

/* ============ STATS BAND ============ */
.co-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line-hi);border-bottom:1px solid var(--line)}
.co-stat{padding:clamp(24px,3vw,40px) clamp(14px,1.6vw,24px) clamp(24px,3vw,36px) 0;position:relative}
.co-stat + .co-stat{padding-left:clamp(14px,1.6vw,24px);border-left:1px solid var(--line)}
.co-stat .num{font-size:clamp(2.6rem,4.6vw,4.75rem);display:block}
.co-stat dt{margin-top:14px;color:var(--text);font-weight:500}
.co-stat dd.co-src{margin-top:6px;font-family:"Martian Mono",ui-monospace,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.co-stat{display:flex;flex-direction:column}
.co-stat .num-wrap{order:-1}
@media (max-width:1023px){.co-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.co-stat:nth-child(3){border-left:0;padding-left:0}.co-stat:nth-child(n+3){border-top:1px solid var(--line)}}

/* ============ PRINCIPLES ============ */
.co-pr-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap)}
.co-pr-head{grid-column:1/5;position:sticky;top:calc(var(--nav-h) + 8vh);align-self:start}
.co-pr-list{grid-column:6/13;counter-reset:pr}
.co-pr-list li{position:relative;display:grid;grid-template-columns:70px minmax(0,1fr);gap:8px 24px;padding:clamp(26px,3.2vw,40px) 0;border-top:1px solid var(--line)}
.co-pr-list li:last-child{border-bottom:1px solid var(--line)}
.co-pr-list .n{font-family:"Martian Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.12em;color:var(--chrome-3);padding-top:10px}
.co-pr-list h3{font-size:clamp(1.5rem,2.3vw,2.25rem);line-height:1.12;letter-spacing:-.018em}
.co-pr-list p{grid-column:2;color:var(--body);font-size:var(--fs-lead);line-height:1.55;max-width:36rem}
.co-pr-list li::after{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:linear-gradient(90deg,var(--chrome-1),transparent 70%);transform-origin:left;transform:scaleX(0);transition:transform 1200ms var(--ease-reveal)}
.co-pr-list li.is-in::after{transform:scaleX(1)}
@media (max-width:1023px){.co-pr-head{grid-column:1/-1;position:relative;top:auto}.co-pr-list{grid-column:1/-1}}
@media (max-width:640px){.co-pr-list li{grid-template-columns:minmax(0,1fr)}.co-pr-list p{grid-column:1}.co-pr-list .n{padding-top:0}}

/* ============ PRODUCT PANELS ============ */
.co-prod{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.co-prod .co-card{display:flex;flex-direction:column;gap:18px;padding:clamp(24px,2.6vw,40px)}
.co-prod .co-card::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
.co-prod .is-ss::before{background:linear-gradient(90deg,transparent,rgba(94,234,212,.55),transparent)}
.co-prod .is-ss::after{background:radial-gradient(70% 45% at 0 0,rgba(94,234,212,.07),transparent 70%)}
.co-prod .is-tv::before{background:linear-gradient(90deg,transparent,rgba(28,164,92,.6),transparent)}
.co-prod .is-tv::after{background:radial-gradient(70% 45% at 0 0,rgba(28,164,92,.08),transparent 70%)}
.co-logo{height:30px;width:auto;max-width:100%}
.co-logo--tv{height:40px;margin-left:-3px}
.co-prod-lead{font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:108%;font-size:clamp(1.375rem,2vw,1.875rem);line-height:1.18;letter-spacing:-.015em;color:var(--text);text-wrap:balance;margin-top:4px}
.co-prod .mono-list{max-width:none}
.co-prod-links{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-top:auto;padding-top:8px}
@media (max-width:1023px){.co-prod{grid-template-columns:minmax(0,1fr)}}

/* premium browser frame for real screenshots */
.co-frame{position:relative;border-radius:14px;padding:1px;background:linear-gradient(160deg,rgba(255,255,255,.34),rgba(255,255,255,.06) 30%,rgba(255,255,255,.03) 70%,rgba(255,255,255,.18));box-shadow:0 30px 80px -30px rgba(0,0,0,.9)}
.co-frame-in{border-radius:13px;overflow:hidden;background:#0b0c0e}
.co-frame-bar{display:flex;align-items:center;gap:7px;height:30px;padding:0 12px;background:linear-gradient(180deg,#17181b,#101113);border-bottom:1px solid rgba(255,255,255,.06)}
.co-frame-bar i{width:8px;height:8px;border-radius:50%;background:#3a3d42}
.co-frame-bar span{margin:0 auto;transform:translateX(-12px);font-family:"Martian Mono",ui-monospace,monospace;font-size:9.5px;letter-spacing:.08em;color:#8d939b;padding:3px 14px;border-radius:999px;background:rgba(255,255,255,.04)}
.co-frame img{width:100%;height:auto;display:block}
.co-frame--crop .co-frame-in > img{aspect-ratio:16/10;object-fit:cover;object-position:0 0}
.co-frame figcaption,.co-figcap{margin-top:12px;font-size:13.5px;color:var(--mute);line-height:1.5}
.co-frame + .co-figcap{margin-top:14px}
.co-frame--paper .co-frame-in{background:#f3f4f6}

/* ============ CORE DIAGRAM ============ */
.co-core{margin:0 auto clamp(48px,6vw,80px);max-width:980px}
.co-core svg{width:100%;height:auto;overflow:visible}
.svg-line{fill:none;stroke:rgba(233,236,239,.55);stroke-width:1.2;vector-effect:non-scaling-stroke}
.svg-line--dim{stroke:rgba(233,236,239,.18)}
.svg-box{fill:rgba(12,12,14,.85);stroke:rgba(233,236,239,.22);stroke-width:1;vector-effect:non-scaling-stroke}
.svg-txt{fill:#f2f3f5;font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:108%;font-size:22px;letter-spacing:-.01em}
.svg-mono{fill:#9ca2aa;font-family:"Martian Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.svg-pkt{fill:#fff}
.svg-fade{opacity:0;transition:opacity 700ms ease,transform 900ms var(--ease-reveal)}
.svg-fade.on{opacity:1}

/* ============ STEPS RAIL ============ */
.co-steps{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--gap);padding-top:46px}
.co-steps-line{position:absolute;left:0;right:0;top:11px;height:2px;width:100%;overflow:visible}
.co-steps li{position:relative}
.co-steps li::before{content:"";position:absolute;top:-40px;left:0;width:11px;height:11px;border-radius:50%;background:#0a0a0b;border:1px solid var(--chrome-2);transition:background-color 400ms ease,box-shadow 400ms ease}
.co-steps li.on::before{background:var(--chrome-hi);box-shadow:0 0 0 5px rgba(233,236,239,.08),0 0 18px rgba(233,236,239,.5)}
.co-steps .mono{color:var(--chrome-3)}
.co-steps h3{margin-top:10px}
.co-steps p{margin-top:10px;color:var(--body);font-size:15.5px;line-height:1.55}
.co-steps li{opacity:.45;transition:opacity 500ms ease}
.co-steps li.on{opacity:1}
@media (max-width:1023px){
  .co-steps{grid-template-columns:minmax(0,1fr);padding-top:0;padding-left:34px;gap:34px}
  .co-steps-line{display:none}
  .co-steps::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:1px;background:linear-gradient(var(--chrome-2),rgba(233,236,239,.08))}
  .co-steps li::before{top:6px;left:-34px}
  .co-steps li{opacity:1}
}

/* ============ LOCATION ============ */
.co-loc{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);align-items:center}
.co-loc-viz{grid-column:1/7;position:relative}
.co-loc-txt{grid-column:8/13}
.co-globe{width:100%;aspect-ratio:1/1;max-width:640px;margin-inline:auto;display:block}
.co-coord{position:absolute;left:0;bottom:6%;display:flex;flex-direction:column;gap:6px;color:var(--chrome-2)}
.co-coord b{font-weight:400;color:var(--text)}
.co-addr{font-style:normal;color:var(--text);font-size:var(--fs-lead);line-height:1.6;margin-top:22px}
.co-legal{margin-top:28px;display:grid;gap:0;border-top:1px solid var(--line)}
.co-legal > div{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.co-legal dt{font-family:"Martian Mono",ui-monospace,monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);padding-top:4px}
.co-legal dd{color:var(--text);font-size:15px;line-height:1.5}
@media (max-width:1023px){.co-loc-viz,.co-loc-txt{grid-column:1/-1}.co-loc-viz{max-width:560px;width:100%;margin-inline:auto}}
@media (max-width:520px){.co-legal > div{grid-template-columns:minmax(0,1fr);gap:4px}}

/* ============ TIMELINE ============ */
.co-tl{position:relative;max-width:60rem}
.co-tl li{display:grid;grid-template-columns:170px minmax(0,1fr);gap:24px;padding:26px 0;border-top:1px solid var(--line)}
.co-tl li:last-child{border-bottom:1px solid var(--line)}
.co-tl time,.co-tl .when{font-family:"Martian Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--chrome-1);padding-top:6px}
.co-tl h3{font-size:clamp(1.25rem,1.8vw,1.625rem)}
.co-tl p{color:var(--body);margin-top:8px}
@media (max-width:640px){.co-tl li{grid-template-columns:minmax(0,1fr);gap:8px}}

/* ============ CLOSING ============ */
.co-close{min-height:100vh;min-height:100svh;display:grid;place-items:center;padding-block:var(--sec-pad)}
.co-close-in{display:flex;flex-direction:column;align-items:center;text-align:center;gap:26px;max-width:62rem;padding-inline:var(--gutter)}
.co-close-lockup{width:min(420px,72vw);height:auto;margin-bottom:12px}
.co-close .cta-row{margin-top:6px}

/* ============ TECHNOLOGY: STACK ============ */
.co-stack{height:520vh}
.co-stack-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:grid;align-items:center}
.co-stack-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);align-items:center;height:100%;padding-top:var(--nav-h)}
.co-stack-cap{grid-column:1/6;position:relative;min-height:22rem}
.co-stack-cap > .co-eyebrow{position:absolute;top:-56px;left:0}
.co-stack-steps li{position:absolute;inset:0 0 auto 0;opacity:0;transform:translateY(26px);transition:opacity 500ms ease,transform 700ms var(--ease-reveal);pointer-events:none}
.co-stack-steps li.is-on{opacity:1;transform:none;pointer-events:auto}
.co-stack-steps li.is-past{transform:translateY(-26px)}
.co-stack-steps .n{display:flex;align-items:center;gap:14px;color:var(--chrome-2)}
.co-stack-steps .n i{width:40px;height:1px;background:var(--chrome-3)}
.co-stack-steps h3{margin-top:18px;font-size:clamp(2.1rem,3.6vw,3.6rem);line-height:1.04;letter-spacing:-.025em}
.co-stack-steps p{margin-top:18px;font-size:var(--fs-lead);line-height:1.55;color:var(--body);max-width:30rem}
.co-stack-viz{grid-column:6/13;height:min(78svh,760px);display:grid;place-items:center}
.co-stack-viz svg{height:100%;width:auto;max-width:100%;overflow:visible}
.co-stack-prog{position:absolute;left:0;right:0;bottom:-48px;height:1px;background:var(--line-hi)}
.co-stack-prog::after{content:"";position:absolute;inset:0;background:var(--chrome-1);transform-origin:left;transform:scaleX(var(--p,0))}
/* bands light up with the active step */
.band rect{fill:rgba(12,12,14,.82);stroke:rgba(233,236,239,.16);stroke-width:1;transition:fill 500ms ease,stroke 500ms ease}
.band .svg-txt{fill:#80858d;transition:fill 500ms ease}
.band .svg-mono{fill:#5a5f66;transition:fill 500ms ease}
.band .glyph{opacity:.25;transition:opacity 500ms ease}
.band.on rect{fill:rgba(26,27,30,.92);stroke:rgba(233,236,239,.38)}
.band.on .svg-txt{fill:#f2f3f5}
.band.on .svg-mono{fill:#b8bec6}
.band.on .glyph{opacity:1}
.band.cur rect{stroke:#f2f3f5;fill:rgba(40,42,46,.92)}
.chip rect{fill:rgba(12,12,14,.85);stroke:rgba(233,236,239,.2);transition:stroke 500ms ease,fill 500ms ease}
.chip text{fill:#a9aeb5;transition:fill 500ms ease}
.chip.on rect{stroke:rgba(233,236,239,.5);fill:rgba(26,27,30,.92)}
.chip.on text{fill:#f2f3f5}
@media (max-width:1023px){
  .co-stack{height:auto}
  .co-stack-stage{position:relative;height:auto;overflow:visible;padding-block:var(--sec-pad)}
  .co-stack-grid{padding-top:0}
  .co-stack-cap,.co-stack-viz{grid-column:1/-1}
  .co-stack-viz{height:auto;order:-1}
  .co-stack-viz svg{width:100%;height:auto;max-width:520px}
  .co-stack-cap{min-height:0}
  .co-stack-cap > .co-eyebrow{position:static}
  .co-stack-steps{display:grid;gap:30px}
  .co-stack-steps li{position:relative;opacity:1;transform:none;pointer-events:auto}
  .co-stack-steps li.is-past{transform:none}
  .co-stack-steps h3{font-size:1.75rem}
  .co-stack-prog{display:none}
  .band rect{fill:rgba(26,27,30,.92);stroke:rgba(233,236,239,.38)} .band .svg-txt{fill:#f2f3f5} .band .svg-mono{fill:#b8bec6} .band .glyph{opacity:1}
}

/* ============ TECHNOLOGY: LAYERS ============ */
.co-layer{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);align-items:center}
.co-layer > .t{grid-column:1/6}
.co-layer > .v{grid-column:7/13}
.co-layer--flip > .t{grid-column:8/13;order:2}
.co-layer--flip > .v{grid-column:1/7;order:1}
.co-layer .co-num{display:flex;align-items:center;gap:14px;color:var(--chrome-2);margin-bottom:22px}
.co-layer .co-num b{font-weight:400;color:var(--chrome-hi);font-size:12px}
.co-layer .co-num i{width:40px;height:1px;background:var(--chrome-3)}
.co-bullets{margin-top:26px;border-top:1px solid var(--line)}
.co-bullets li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;padding:13px 0;border-bottom:1px solid var(--line);color:var(--text);font-size:15.5px;line-height:1.5}
.co-bullets .ph{color:var(--chrome-2);font-size:16px;margin-top:3px}
.co-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.co-chips span{font-family:"Martian Mono",ui-monospace,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--chrome-2);padding:8px 11px;border:1px solid var(--line-hi);border-radius:999px;background:rgba(8,8,10,.6)}
@media (max-width:1023px){.co-layer > .t,.co-layer > .v,.co-layer--flip > .t,.co-layer--flip > .v{grid-column:1/-1;order:0}.co-layer{row-gap:40px}}

.co-viz{position:relative;border-radius:var(--r-card);border:1px solid var(--line);background:linear-gradient(180deg,rgba(14,15,17,.88),rgba(7,7,8,.9));box-shadow:var(--shadow-card);padding:clamp(18px,2.2vw,30px);overflow:hidden;isolation:isolate}
.co-viz::before{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(233,236,239,.5),transparent)}
.co-viz svg{width:100%;height:auto;overflow:visible}
.co-viz-h{display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--chrome-2);margin-bottom:16px}
.co-viz-h .ill{color:var(--mute)}
.co-viz .grid-bg{position:absolute;inset:0;z-index:-1;opacity:.5;background-image:linear-gradient(rgba(233,236,239,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(233,236,239,.05) 1px,transparent 1px);background-size:32px 32px;-webkit-mask-image:radial-gradient(80% 80% at 50% 50%,#000,transparent);mask-image:radial-gradient(80% 80% at 50% 50%,#000,transparent)}

/* resolve: variant chips merge into one record */
.res{--q:clamp(0,calc((var(--p,0) - .15) * 2.2),1);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:18px;align-items:center;min-height:330px}
.res-in{display:flex;flex-direction:column;gap:10px;position:relative;z-index:1}
.res-chip{font-family:"Martian Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.04em;color:var(--text);padding:11px 12px;border:1px dashed rgba(233,236,239,.28);border-radius:10px;background:rgba(12,12,14,.9);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  transform:translateX(calc(var(--q) * 34%)) translateY(calc(var(--q) * var(--dy,0px))) scale(calc(1 - var(--q) * .12));opacity:calc(1 - var(--q) * .82)}
.res-chip:nth-child(1){--dy:52px}.res-chip:nth-child(2){--dy:18px}.res-chip:nth-child(3){--dy:-18px}.res-chip:nth-child(4){--dy:-52px}
.res-out{position:relative;border-radius:12px;padding:18px;border:1px solid rgba(233,236,239,.3);background:linear-gradient(180deg,#16171a,#0d0e10);
  opacity:calc(.25 + var(--q) * .75);transform:scale(calc(.94 + var(--q) * .06))}
.res-out .mono{color:var(--chrome-2)}
.res-out .res-name{margin-top:10px;font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:108%;font-size:1.25rem;color:var(--text)}
.res-out ul{margin-top:14px}
.res-out li{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line);font-size:13.5px;color:var(--body)}
.res-out li .ph{color:var(--chrome-1)}
.res-badge{position:absolute;top:14px;right:14px;font-family:"Martian Mono",ui-monospace,monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:#0a0a0b;background:var(--chrome-1);padding:4px 8px;border-radius:999px;opacity:calc((var(--q) - .8) * 5)}
@media (max-width:520px){.res{grid-template-columns:minmax(0,1fr)}.res-chip{transform:none;opacity:1}.res-out{opacity:1;transform:none}.res-badge{opacity:1}}

/* analyse: bars rise */
.bars rect.bar{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(calc(clamp(0,(var(--p,0) - var(--o,0)) * 3,1)));fill:url(#barg)}
.rank{margin-top:16px;display:grid;gap:8px}
.rank li{display:grid;grid-template-columns:22px minmax(0,1fr) 54%;align-items:center;gap:12px;font-family:"Martian Mono",ui-monospace,monospace;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--body)}
.rank li i{display:block;height:4px;border-radius:2px;background:linear-gradient(90deg,var(--chrome-1),var(--chrome-lo));transform-origin:left;transform:scaleX(calc(clamp(0,(var(--p,0) - .35) * 2.4,1) * var(--w)))}

/* verify: score ring and factor bars */
.ver{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:22px;align-items:center}
.ver-ring{position:relative;max-width:240px;width:100%;margin-inline:auto}
.ver-ring svg{transform:rotate(-90deg)}
.ver-ring .trk{fill:none;stroke:rgba(233,236,239,.1);stroke-width:8}
.ver-ring .val{fill:none;stroke:url(#ringg);stroke-width:8;stroke-linecap:round}
.ver-ring .c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.ver-ring .c .num{font-size:clamp(2.6rem,4vw,3.5rem)}
.ver-ring .c .mono{color:var(--chrome-2);font-size:10px}
.ver-f li{display:grid;grid-template-columns:minmax(0,1fr) 30px;gap:8px 12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--text)}
.ver-f li span:last-of-type{text-align:right;font-variant-numeric:tabular-nums;color:var(--chrome-1)}
.ver-f li i{grid-column:1/-1;display:block;height:3px;border-radius:2px;background:rgba(233,236,239,.08);position:relative;overflow:hidden}
.ver-f li i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--chrome-lo),var(--chrome-hi));transform-origin:left;transform:scaleX(calc(clamp(0,(var(--p,0) - .3) * 2.2,1) * var(--w)))}
.ver-verdicts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:20px}
.ver-verdicts li{border:1px solid var(--line-hi);border-radius:10px;padding:12px;font-size:13.5px;line-height:1.35;color:var(--text);display:flex;flex-direction:column;gap:8px;background:rgba(8,8,10,.6)}
.ver-verdicts .ph{font-size:20px;color:var(--chrome-2)}
@media (max-width:520px){.ver{grid-template-columns:minmax(0,1fr)}.ver-verdicts{grid-template-columns:minmax(0,1fr)}}

/* assist: command panel */
.asst{display:flex;flex-direction:column;gap:14px}
.asst-bar{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;border:1px solid rgba(233,236,239,.24);background:#0e0f11}
.asst-bar .ph{font-size:18px;color:var(--chrome-1)}
.asst-q{flex:1;min-width:0;font-size:15px;color:var(--text);white-space:nowrap;overflow:hidden}
.asst-q span{display:inline-block;max-width:0;overflow:hidden;vertical-align:bottom;white-space:nowrap;border-right:1px solid var(--chrome-1)}
.is-in .asst-q span{animation:co-type 2.6s steps(46,end) 400ms forwards,co-caret 900ms step-end infinite}
@keyframes co-type{to{max-width:100%}}
@keyframes co-caret{50%{border-color:transparent}}
.kbd{font-family:"Martian Mono",ui-monospace,monospace;font-size:10.5px;color:var(--chrome-2);padding:4px 7px;border:1px solid var(--line-hi);border-radius:6px;background:rgba(255,255,255,.03);flex:none}
.asst-a{border-radius:12px;border:1px solid var(--line);padding:16px;background:rgba(10,10,11,.8)}
.asst-a .mono{color:var(--chrome-2);display:flex;align-items:center;gap:8px}
.sk{display:block;height:9px;border-radius:5px;margin-top:12px;background:linear-gradient(90deg,rgba(233,236,239,.07),rgba(233,236,239,.2),rgba(233,236,239,.07));background-size:200% 100%;animation:co-sheen 2.4s linear infinite}
@keyframes co-sheen{to{background-position:-200% 0}}
[data-motion="paused"] .sk{animation:none}
.asst-ctx{display:flex;flex-wrap:wrap;gap:8px}

/* gather: converging streams */
.svg-stream{fill:none;stroke:rgba(233,236,239,.42);stroke-width:1;vector-effect:non-scaling-stroke}

/* ============ CONTACT ============ */
.co-hero--short{height:160vh}
.co-quick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%;max-width:56rem;margin-top:10px}
.co-quick a{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;padding:16px 18px;border-radius:14px;border:1px solid var(--line-hi);background:rgba(8,8,10,.62);transition:border-color 200ms ease,background-color 200ms ease}
.co-quick .mono{color:var(--mute);display:flex;align-items:center;gap:8px}
.co-quick .mono .ph{font-size:14px;color:var(--chrome-2)}
.co-quick b{font-weight:500;color:var(--text);font-size:15px;overflow-wrap:anywhere}
@media (hover:hover) and (pointer:fine){.co-quick a:hover{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.04)}}
@media (max-width:767px){.co-quick{grid-template-columns:minmax(0,1fr)}}

.co-contact{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);align-items:start}
.co-contact > .co-card:first-child{grid-column:1/8}
.co-contact > aside{grid-column:8/13;display:grid;gap:var(--gap)}
@media (max-width:1023px){.co-contact > .co-card:first-child,.co-contact > aside{grid-column:1/-1}}

.co-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 18px;margin-top:28px}
.field{display:flex;flex-direction:column;gap:8px;min-width:0}
.field--full{grid-column:1/-1}
.field label{font-family:"Martian Mono",ui-monospace,monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--chrome-2)}
.field label .opt{color:var(--mute);text-transform:none;letter-spacing:.02em}
.field input,.field select,.field textarea{width:100%;font:400 16px/1.4 "Mona Sans",system-ui,sans-serif;color:var(--text);background:#0c0d0f;border:1px solid rgba(233,236,239,.16);border-radius:10px;padding:13px 14px;transition:border-color 200ms ease,box-shadow 200ms ease;-webkit-appearance:none;appearance:none}
.field textarea{min-height:150px;resize:vertical}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%23b8bec6' stroke-width='1.4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
.field input::placeholder,.field textarea::placeholder{color:#5f646b}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:rgba(242,243,245,.7);box-shadow:0 0 0 3px rgba(242,243,245,.12)}
.field.has-err input,.field.has-err textarea{border-color:#e08a8a}
.field-err{min-height:0;font-size:13px;color:#f0a3a3}
.field-err:empty{display:none}
.co-form-foot{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-top:6px}
.co-form-foot p{font-size:13.5px;color:var(--mute);max-width:30rem}
.co-form-foot b{color:var(--body);font-weight:500}
.co-status{grid-column:1/-1;border:1px solid var(--line-hi);border-radius:12px;padding:16px 18px;background:rgba(242,243,245,.04);font-size:14.5px;color:var(--body);opacity:0;transform:translateY(6px);transition:opacity 400ms ease,transform 500ms var(--ease-reveal)}
.co-status.is-in{opacity:1;transform:none}
.co-status a{color:var(--link)}
.co-status .ph{color:var(--chrome-1);margin-right:6px}
@media (max-width:640px){.co-form{grid-template-columns:minmax(0,1fr)}.co-form-foot .btn{width:100%}}

.co-dl{margin-top:18px;border-top:1px solid var(--line)}
.co-dl > div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--line)}
.co-dl dt{font-family:"Martian Mono",ui-monospace,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.co-dl dd{color:var(--text);font-size:15px;text-align:right;overflow-wrap:anywhere;min-width:0}
.co-dl a{transition:color 200ms ease}
@media (hover:hover) and (pointer:fine){.co-dl a:hover{color:var(--link)}}
.copy-btn{display:inline-flex;align-items:center;gap:6px;margin-left:10px;font-family:"Martian Mono",ui-monospace,monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);padding:4px 8px;border:1px solid var(--line-hi);border-radius:999px;vertical-align:middle}
@media (hover:hover) and (pointer:fine){.copy-btn:hover{color:var(--text);border-color:rgba(255,255,255,.4)}}

.co-route .co-card{display:flex;flex-direction:column;gap:16px}

/* ============ REDUCED MOTION ============ */
.rm .co-hero,.rm .co-pin{height:auto}
.rm .co-hero-stage{position:relative;min-height:100vh;min-height:100svh}
.rm .co-pin-stage{position:relative;height:auto;min-height:80vh;padding-block:var(--sec-pad)}
.rm [data-scrub] .wi{opacity:1}
.rm .co-stack{height:auto}
.rm .co-stack-stage{position:relative;height:auto;overflow:visible;padding-block:var(--sec-pad)}
.rm .co-stack-grid{padding-top:0}
.rm .co-stack-steps{display:grid;gap:30px}
.rm .co-stack-steps li{position:relative;opacity:1;transform:none}
.rm .co-stack-cap{min-height:0}
.rm .co-stack-cap > .co-eyebrow{position:static}
.rm .co-stack-prog{display:none}
.rm .band rect{fill:rgba(26,27,30,.92);stroke:rgba(233,236,239,.38)} .rm .band .svg-txt{fill:#f2f3f5} .rm .band .glyph{opacity:1}
.rm .co-cue i,.rm .sk{animation:none}
.rm .is-in .asst-q span{animation:none;max-width:100%;border-right:0}
@media (prefers-reduced-motion:reduce){
  .co [data-split] .wi,.co [data-reveal]{transition:none}
  .co-ready [data-split]:not(.is-in) .wi{transform:none}
  .co-ready [data-reveal]:not(.is-in),.co-ready [data-reveal]:not(.is-in) > *{opacity:1;transform:none;clip-path:none}
}
/* current stack layer */
[data-step-on="1"] .band[data-k="1"] rect,[data-step-on="2"] .band[data-k="2"] rect,[data-step-on="3"] .band[data-k="3"] rect,[data-step-on="4"] .band[data-k="4"] rect,[data-step-on="5"] .band[data-k="5"] rect{stroke:#f2f3f5;fill:rgba(40,42,46,.95)}
[data-step-on="0"] .chip.src rect,[data-step-on="6"] .chip.out rect{stroke:#f2f3f5}
/* treated photography */
.co-photo{position:relative;border-radius:var(--r-card);overflow:hidden;border:1px solid var(--line);isolation:isolate;min-height:260px}
.co-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(calc(1.08 - var(--p,0) * .08));filter:grayscale(1) contrast(1.05)}
.co-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,5,6,.1),rgba(5,5,6,.82)),radial-gradient(90% 80% at 30% 20%,transparent,rgba(5,5,6,.5));z-index:0}
.co-photo .cap{position:absolute;left:clamp(18px,2vw,28px);right:clamp(18px,2vw,28px);bottom:clamp(18px,2vw,28px);z-index:1}
.co-photo .cap .mono{color:var(--chrome-2)}
.co-photo .cap p{margin-top:10px;color:var(--text);font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:106%;font-size:clamp(1.25rem,1.9vw,1.75rem);line-height:1.2;letter-spacing:-.012em}
/* mission pair */
.co-mv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.co-mv .co-card{padding:clamp(28px,3.4vw,52px)}
.co-mv .co-display{font-size:clamp(1.6rem,2.7vw,2.6rem);margin-top:6px}
@media (max-width:1023px){.co-mv{grid-template-columns:minmax(0,1fr)}}
.co-disc{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--gap)}
.co-disc > *{grid-column:span 2}
.co-disc > .co-photo{grid-column:span 2}
@media (max-width:1023px){.co-disc{grid-template-columns:repeat(2,minmax(0,1fr))}.co-disc > *{grid-column:span 1}.co-disc > .co-photo{grid-column:1/-1}}
@media (max-width:640px){.co-disc{grid-template-columns:minmax(0,1fr)}.co-disc > *,.co-disc > .co-photo{grid-column:1/-1}}
.co-steps-wrap{position:relative}
.co-viz .spin{transform-box:fill-box;transform-origin:center;animation:co-spin 22s linear infinite}
@keyframes co-spin{to{transform:rotate(360deg)}}
[data-motion="paused"] .co-viz .spin,.rm .co-viz .spin{animation:none}
.co-tl--sm{margin-top:14px}
.co-tl--sm li{grid-template-columns:40px minmax(0,1fr);gap:14px;padding:16px 0}
.co-tl--sm h3{font-size:1.125rem}
.co-tl--sm p{font-size:14.5px;margin-top:4px}
.co-tl--sm .when{padding-top:3px}
/* fixes after QA pass 1 */
.co-logo{align-self:flex-start;flex:none}
.co-rail li:not(.is-on) .r-n{display:none}
.co-rail ol{gap:10px}
@media (max-width:1359px){.co-rail{display:none}}
.co-stat .num{font-size:clamp(2.3rem,3.7vw,4.1rem);font-stretch:112%}
.co-steps-wrap{padding:clamp(24px,3vw,40px);border-radius:var(--r-card);background:linear-gradient(180deg,rgba(8,8,10,.78),rgba(8,8,10,.62));border:1px solid var(--line)}
.co-steps li{opacity:.55}
/* chrome headline, painted per word so the split reveal keeps working */
.co-h1 .wi,.co-chrome-words .wi{background:linear-gradient(180deg,#fff 0%,#e9ecef 22%,#b8bec6 46%,#7d838b 54%,#9aa0a8 62%,#dfe3e7 82%,#f6f7f8 100%);-webkit-background-clip:text;background-clip:text;color:transparent;padding-bottom:.06em}
.co-h1{filter:drop-shadow(0 1px 0 rgba(255,255,255,.08)) drop-shadow(0 12px 40px rgba(0,0,0,.6))}
/* QA pass 2 */
@media (max-width:1719px){.co-rail{display:none}}
@media (min-width:1024px){
  .co-stack-viz{height:min(72svh,700px);align-self:center;margin-top:2svh}
  .co-stack-viz svg{height:100%;width:auto}
  .co-stack-stage::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(5,5,6,.9) 0%,rgba(5,5,6,.62) 38%,rgba(5,5,6,.2) 62%,rgba(5,5,6,.35) 100%)}
}
.co-loc-viz::before{content:"";position:absolute;inset:-6%;border-radius:50%;background:radial-gradient(closest-side,rgba(5,5,6,.92),rgba(5,5,6,.75) 70%,rgba(5,5,6,0));pointer-events:none}
.co-globe{position:relative}
.co-coord{z-index:1}
.co-stack-grid{position:relative}
@media (min-width:1024px){.co-stack-viz{display:block}.co-stack-viz svg{display:block;height:100%;width:auto;max-width:100%;margin-inline:auto}}
/* QA pass 3: mobile */
@media (max-width:1023px){.co-steps li{opacity:1}}
@media (min-width:1024px){.co-steps li{opacity:.55}.co-steps li.on{opacity:1}}
.co-deliver{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);align-items:center}
.co-deliver > .l{grid-column:1/8}
.co-deliver > .r{grid-column:8/13}
@media (max-width:1023px){.co-deliver > .l,.co-deliver > .r{grid-column:1/-1}}
.co-core-m{display:none}
@media (max-width:700px){
  .co-core{display:none}
  .co-core-m{display:flex;flex-direction:column;align-items:center;gap:0;margin:0 auto 48px;max-width:420px}
  .cm-in{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
  .cm-in span{font-size:9.5px;padding:8px 10px;border:1px solid var(--line-hi);border-radius:999px;background:rgba(8,8,10,.7);color:var(--chrome-2)}
  .cm-line{display:block;width:1px;height:34px;background:linear-gradient(var(--chrome-1),rgba(233,236,239,.15))}
  .cm-core{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 22px;border-radius:999px}
  .cm-core img{width:56px;height:auto}
  .cm-core .mono{font-size:9.5px;color:var(--chrome-2)}
  .cm-out{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
  .cm-out span{display:grid;place-items:center;height:64px;border:1px solid var(--line-hi);border-radius:12px;background:rgba(10,10,12,.85)}
  .cm-out img{height:20px;width:auto}
  .cm-out span:last-child img{height:28px}
}

/* ============ P3: CHAPTER INTERLUDES (information first, film as the stage) ============ */
/* [data-p="pass"] gives --p from 0 (section top at viewport bottom) to 1 (section bottom at viewport top).
   The stage is pinned between p = h/(h+vh) bounds; words rise in, hold, then lift away with a soft blur. */
.co-chap{position:relative;height:210vh}
.co-chap-stage{position:sticky;top:0;height:100vh;height:100svh;display:grid;place-items:center;overflow:hidden}
.co-chap-stage::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(62% 52% at 50% 52%,rgba(5,5,6,.78),rgba(5,5,6,.46) 48%,rgba(5,5,6,0) 78%);opacity:calc(.35 + var(--cin,0) * .65)}
.co-chap{--cin:clamp(0,calc((var(--p,0) - .2) * 4),1);--cout:clamp(0,calc((var(--p,0) - .7) * 5.5),1)}
.co-chap-in{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;max-width:min(100%,82rem);padding:var(--nav-h) max(var(--gutter),env(safe-area-inset-left)) 0;
  opacity:calc(1 - var(--cout));transform:translate3d(0,calc(var(--cout) * -7vh),0) scale(calc(1 + var(--cout) * .05));filter:blur(calc(var(--cout) * 9px));will-change:transform,opacity}
.co-chap-k{display:inline-flex;align-items:center;gap:14px;color:var(--chrome-2);margin-bottom:clamp(22px,3.2svh,36px);opacity:var(--cin);letter-spacing:calc(.12em + (1 - var(--cin)) * .5em)}
.co-chap-k b{font-weight:400;color:var(--chrome-hi)}
.co-chap-k i{display:block;width:56px;height:1px;background:linear-gradient(90deg,transparent,var(--chrome-1),transparent);transform:scaleX(var(--cin))}
.co-chap-t{font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:110%;font-weight:400;font-size:clamp(2.35rem,min(6.2vw,10.4svh),6.4rem);line-height:1.03;letter-spacing:-.028em;color:var(--text);text-wrap:balance;max-width:16ch}
.co-chap-t .wi{background:linear-gradient(180deg,#fff 0%,#eef0f2 30%,#b8bec6 52%,#8f959d 58%,#d6dade 80%,#fafbfb 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.co .co-chap [data-split] .wi,.co .co-chap .co-chap-t .wi{transition:none;transform:translate3d(0,calc((1 - clamp(0,calc((var(--p,0) - .17 - var(--i,0) * .014) * 7),1)) * 108%),0)}
.co-chap-s{margin-top:clamp(22px,3.4svh,38px);max-width:40rem;font-size:clamp(1.0625rem,1.4vw,1.375rem);line-height:1.55;color:var(--body);
  opacity:clamp(0,calc((var(--p,0) - .3) * 5),1);transform:translate3d(0,calc((1 - clamp(0,calc((var(--p,0) - .3) * 5),1)) * 18px),0)}
.co-chap-line{display:block;width:min(560px,70vw);height:1px;margin-top:clamp(26px,4svh,44px);background:linear-gradient(90deg,transparent,rgba(233,236,239,.7),transparent);transform:scaleX(clamp(0,calc((var(--p,0) - .32) * 3),1));opacity:.7}
.co-chap-big{position:absolute;left:50%;top:50%;font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:125%;font-weight:300;font-size:min(46vw,64svh);line-height:1;letter-spacing:-.05em;color:transparent;
  -webkit-text-stroke:1px rgba(233,236,239,.10);pointer-events:none;user-select:none;
  transform:translate3d(-50%,calc(-50% + (.5 - var(--p,0)) * 26vh),0);opacity:calc(var(--cin) * (1 - var(--cout)))}
@media (max-width:767px){.co-chap{height:180vh}.co-chap-t{font-size:clamp(2.1rem,10.4vw,3.2rem);max-width:none}.co-chap-big{font-size:68vw}}
.co-sec--tight{padding-top:clamp(2rem,4vw,4rem)}
/* reduced motion: interludes become calm, static title cards */
.rm .co-chap{height:auto}
.rm .co-chap-stage{position:relative;height:auto;min-height:72vh;padding-block:var(--sec-pad)}
.rm .co-chap-in,.rm .co-chap-k,.rm .co-chap-s,.rm .co-chap-line,.rm .co-chap .wi{opacity:1!important;transform:none!important;filter:none!important;letter-spacing:revert}
.rm .co-chap-k{letter-spacing:.12em}
.rm .co-chap-big{opacity:.6;transform:translate(-50%,-50%)}

/* ============ P3: WHO WE SERVE ============ */
.co-serve{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--gap)}
.co-serve > .co-card{grid-column:span 2;display:flex;flex-direction:column}
.co-serve > .co-card:nth-child(4),.co-serve > .co-card:nth-child(5){grid-column:span 3}
.co-serve .co-card .co-fact{margin-top:auto;padding-top:14px}
.co-serve .co-card p{margin-bottom:18px}
.co-uses{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 18px}
.co-uses span{font-family:"Martian Mono",ui-monospace,monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--chrome-2);padding:6px 9px;border:1px solid var(--line-hi);border-radius:999px;background:rgba(255,255,255,.02)}
@media (max-width:1023px){.co-serve{grid-template-columns:repeat(2,minmax(0,1fr))}.co-serve > .co-card,.co-serve > .co-card:nth-child(4),.co-serve > .co-card:nth-child(5){grid-column:span 1}.co-serve > .co-card:nth-child(5){grid-column:1/-1}}
@media (max-width:640px){.co-serve{grid-template-columns:minmax(0,1fr)}.co-serve > .co-card,.co-serve > .co-card:nth-child(5){grid-column:1/-1}}

/* ============ P3: REAL-SCREEN GALLERY (marquee) ============ */
.co-gal{position:relative;margin-top:clamp(56px,7vw,96px);overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.co-gal-track{display:flex;gap:clamp(16px,2vw,28px);width:max-content;animation:co-marq 70s linear infinite;padding-block:6px 4px}
.co-gal:hover .co-gal-track,.co-gal:focus-within .co-gal-track{animation-play-state:paused}
[data-motion="paused"] .co-gal-track{animation-play-state:paused}
.co-gal figure{flex:none;width:clamp(280px,34vw,520px);margin:0}
.co-gal .co-frame-in img{aspect-ratio:16/10;object-fit:cover;object-position:0 0}
.co-gal figcaption{margin-top:12px;font-size:13.5px;color:var(--mute);line-height:1.45}
.co-gal figcaption b{display:block;font-weight:500;color:var(--text);font-size:14.5px;margin-bottom:2px}
@keyframes co-marq{to{transform:translate3d(calc(-50% - clamp(8px,1vw,14px)),0,0)}}
.rm .co-gal{-webkit-mask-image:none;mask-image:none;overflow-x:auto}
.rm .co-gal-track{animation:none}
.rm .co-gal-track [data-dup]{display:none}
@media (prefers-reduced-motion:reduce){.co-gal-track{animation:none}}

/* ============ P3: QUESTIONS -> LAYERS ============ */
.co-qa{border-top:1px solid var(--line-hi)}
.co-qa li{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,.9fr);gap:12px 32px;align-items:center;padding:clamp(20px,2.4vw,30px) 0;border-bottom:1px solid var(--line);position:relative}
.co-qa li::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:linear-gradient(90deg,var(--chrome-1),transparent 60%);transform-origin:left;transform:scaleX(0);transition:transform 1100ms var(--ease-reveal)}
.co-qa li.is-in::after{transform:scaleX(1)}
.co-qa .q{font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:106%;font-size:clamp(1.25rem,1.9vw,1.75rem);line-height:1.2;letter-spacing:-.012em;color:var(--text)}
.co-qa .a{color:var(--body);font-size:15.5px;line-height:1.55}
.co-qa .l{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.co-qa .l span{font-family:"Martian Mono",ui-monospace,monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--chrome-1);padding:6px 9px;border:1px solid rgba(233,236,239,.28);border-radius:999px;background:rgba(10,10,12,.7)}
.co-qa .l span.p{color:var(--mute);border-color:var(--line)}
@media (max-width:1023px){.co-qa li{grid-template-columns:minmax(0,1fr);gap:10px}.co-qa .l{justify-content:flex-start}}

/* ============ P3: FAQ (native details) ============ */
.co-faq-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap)}
.co-faq-grid > header{grid-column:1/5;align-self:start;position:sticky;top:calc(var(--nav-h) + 8vh)}
.co-faq{grid-column:6/13;border-top:1px solid var(--line-hi)}
@media (max-width:1023px){.co-faq-grid > header{grid-column:1/-1;position:relative;top:auto}.co-faq{grid-column:1/-1}}
.co-faq details{border-bottom:1px solid var(--line)}
.co-faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) 28px;gap:16px;align-items:center;padding:22px 0;font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:105%;font-size:clamp(1.0625rem,1.45vw,1.3125rem);line-height:1.3;color:var(--text)}
.co-faq summary::-webkit-details-marker{display:none}
.co-faq summary i{width:28px;height:28px;border-radius:50%;border:1px solid var(--line-hi);display:grid;place-items:center;font-size:13px;color:var(--chrome-1);transition:transform 400ms var(--ease-out),background-color 300ms ease}
.co-faq details[open] summary i{transform:rotate(45deg);background:rgba(255,255,255,.06)}
.co-faq summary:focus-visible{outline:2px solid var(--chrome-1);outline-offset:4px;border-radius:6px}
.co-faq .ans{padding:0 44px 24px 0;color:var(--body);font-size:16px;line-height:1.65;max-width:44rem}
.co-faq .ans a{color:var(--link);text-decoration:underline;text-underline-offset:3px}
@media (hover:hover) and (pointer:fine){.co-faq summary:hover i{background:rgba(255,255,255,.06)}}

/* ============ P3: LOCAL TIME ============ */
.co-time{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-top:22px;color:var(--chrome-2)}
.co-time b{font-family:"Onyx Digits","Hubot Sans",system-ui,sans-serif;font-stretch:112%;font-weight:400;font-size:clamp(2rem,3.2vw,3rem);letter-spacing:-.02em;color:var(--text);font-variant-numeric:tabular-nums}
/* P3 legibility pass */
.co-chap-stage::before{background:radial-gradient(64% 56% at 50% 52%,rgba(5,5,6,.86),rgba(5,5,6,.55) 50%,rgba(5,5,6,0) 80%)}
.co-chap-t{filter:drop-shadow(0 10px 34px rgba(0,0,0,.7))}
.co-chap-s{color:var(--chrome-1);text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 22px rgba(0,0,0,.85)}
.co-chap-k{text-shadow:0 0 14px rgba(0,0,0,.9)}
.co-gal img{filter:brightness(.9) saturate(.85);transition:filter 400ms ease}
@media (hover:hover) and (pointer:fine){.co-gal figure:hover img{filter:none}}
.co-faq{position:relative}
.co-faq::before{content:"";position:absolute;inset:-28px -32px;z-index:-1;border-radius:var(--r-card);background:linear-gradient(180deg,rgba(8,8,10,.72),rgba(8,8,10,.55));border:1px solid var(--line)}
.co-faq-grid{isolation:isolate}
@media (max-width:640px){.co-faq::before{inset:-16px -12px}}
@media (min-width:1800px){.co-chap-t{font-size:clamp(6rem,min(5.4vw,10.4svh),8.6rem)}.co-chap-s{font-size:1.5rem;max-width:46rem}}
@media (min-width:1800px){.co-chap-t{max-width:19ch}}

/* ============ HERO PHOTO (Onyx header photography, dissolves into the film on scroll) ============ */
.co-backdrop{position:fixed;inset:0;height:100vh;height:100lvh;z-index:0;pointer-events:none;overflow:hidden;background:#050506}
.co-backdrop picture,.co-backdrop img{width:100%;height:100%}
.co-backdrop img{object-fit:cover;object-position:var(--pos,50% 50%);max-width:none;filter:grayscale(1) contrast(1.06) brightness(var(--bri,.5));transform-origin:50% 45%}
.co-ready:not(.rm) .co-backdrop img{animation:co-kb 36s ease-in-out infinite alternate}
@keyframes co-kb{from{transform:scale(1.05)}to{transform:scale(1.14) translate3d(-1.2%,-1%,0)}}
.co-backdrop::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(105deg,transparent 38%,rgba(255,255,255,.07) 47%,transparent 56%) 0 0/300% 100% no-repeat,
    radial-gradient(52% 46% at 50% 52%,rgba(5,5,6,.66),rgba(5,5,6,.2) 70%,rgba(5,5,6,0)),
    linear-gradient(180deg,rgba(5,5,6,.7) 0%,rgba(5,5,6,.18) 28%,rgba(5,5,6,.3) 66%,rgba(5,5,6,.96) 100%)}
.co-ready:not(.rm) .co-backdrop::after{animation:co-sweep 11s cubic-bezier(.65,0,.35,1) 1.4s infinite}
@keyframes co-sweep{0%{background-position:130% 0,0 0,0 0}55%,100%{background-position:-30% 0,0 0,0 0}}
[data-motion="paused"] .co-backdrop img,[data-motion="paused"] .co-backdrop::after{animation-play-state:paused}
.rm .co-backdrop img,.rm .co-backdrop::after{animation:none}
@media (pointer:coarse){.co-backdrop::after{animation:none}}
@media (max-width:767px){.co-backdrop img{object-position:var(--pos-m,var(--pos,50% 50%))}}
@media (max-width:767px),(max-height:740px){.co-cue{display:none}}
/* review round 1: the stack scrim feathers in (no hard seam across the film) */
@media (min-width:1024px){.co-stack-stage::before{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 24%,#000 80%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 24%,#000 80%,transparent 100%)}}
/* phones: centred chapter copy over bright footage gets a deeper scrim and a flatter chrome */
@media (max-width:767px){
  .co-chap-in::before{content:"";position:absolute;left:50%;top:55%;width:150vw;height:120%;transform:translate(-50%,-50%);z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(0,0,0,.74),rgba(0,0,0,.42) 60%,rgba(0,0,0,0))}
  .co-chap-in{isolation:isolate}
  .co-chap-s{color:#e6e9ed}
}
/* the hero headline never waits on a slow script: it rises on its own after 1.2 s if the reveal has not run */
@keyframes coH1Fallback{to{transform:none}}
.co-ready .co-h1:not(.is-in) .wi{animation:coH1Fallback .9s cubic-bezier(.16,1,.3,1) 1.2s forwards}
@media (orientation:landscape) and (max-height:500px){
  .co-chap-t{font-size:clamp(1.6rem,10svh,2.6rem)}
  .co-chap-s{font-size:.95rem;margin-top:12px}
  .co-display{font-size:clamp(1.2rem,6.4svh,1.8rem)}
}
