/* ============================================================
   REVNIX HOMEPAGE — composition layer.
   Built entirely on the design-system tokens in assets/ds/.
   No new colours, fonts, radii, spacing values or shadows are
   defined here; only layout and section-specific composition.
   ============================================================ */

/* Accessible-contrast extension of the design-system bone theme: the stock
   --text-muted (#6E7982) falls below 4.5:1 on bone at mono label sizes. */
.sec[data-theme="bone"]{--text-muted:#5C666E;--action-primary:var(--signal-700);--action-primary-hover:var(--signal-600);--action-primary-active:var(--signal-800);--signal-data:#186882;--text-onaction:#FFFFFF}

/* ---- shared scaffolding ---------------------------------- */
.wrap{max-width:var(--width-content);margin-inline:auto;padding-inline:var(--gutter)}
.wide{max-width:var(--width-wide);margin-inline:auto;padding-inline:var(--gutter)}
.sec{position:relative;background:var(--surface-canvas);color:var(--text-primary);padding-block:var(--section-y);scroll-margin-top:88px}
.sec--tight{padding-block:clamp(2.5rem,1.5rem + 4vw,4.5rem)}
.sec[data-continues="true"]{padding-top:0}
.sec[data-surface="raised"]{background:var(--carbon-900)}
.rx-plate--tight{flex:none}
.sec__head{display:grid;gap:var(--space-5);margin-bottom:var(--space-8)}
.sec__lede{max-width:58ch;color:var(--text-secondary);font-size:var(--t-body-lg-size);line-height:var(--t-body-lg-lh)}
.lead-narrow{max-width:52ch}
hr.rule{height:1px;background:var(--border-subtle);border:0;margin:0}
.tnum{font-variant-numeric:tabular-nums}
.mono{font-family:var(--font-mono)}
.eyebrow{font-family:var(--font-mono);font-weight:500;font-size:var(--t-eyebrow-size);letter-spacing:var(--t-eyebrow-ls);text-transform:uppercase;color:var(--action-primary);margin:0}
/* index plate = .rx-plate (signature.css). Local extension only: the numeral
   uses --action-primary so it stays AA on the bone counter-theme. */
.rx-plate b{font-weight:500;color:var(--action-primary)}
.syslabel,.cap__out .syslabel,.sys__res .syslabel{font-family:var(--font-mono);font-weight:500;font-size:var(--t-syslabel-size);letter-spacing:var(--t-syslabel-ls);text-transform:uppercase;color:var(--text-muted);line-height:1.4}

/* crop-mark module — the system's replacement for the card */
/* modules use the design system's .rx-panel + .rx-ticks; no local twin */
.rx-ticks:hover::before,.rx-ticks:hover::after{border-color:var(--signal-500)}
.jrn,.caps,.stages,.inds,.offers,.lab{overflow:hidden}

/* ---- controls -------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 var(--space-5);white-space:nowrap;font-family:var(--font-mono);font-weight:500;font-size:var(--t-button-size);letter-spacing:var(--t-button-ls);text-transform:uppercase;border-radius:var(--radius-sm);border:1px solid transparent;cursor:pointer;text-decoration:none;transition:background var(--motion-fast) var(--ease-standard),color var(--motion-fast) var(--ease-standard),border-color var(--motion-fast) var(--ease-standard)}
.btn:hover{text-decoration:none}
.btn__arrow{transition:transform var(--motion-fast) var(--ease-standard)}
.btn:hover .btn__arrow{transform:translateX(3px)}
.btn--primary{background:var(--action-primary);color:var(--text-onaction);border-color:var(--action-primary)}
.btn--primary:hover{background:var(--action-primary-hover);color:var(--text-onaction)}
.btn--primary:active{background:var(--action-primary-active)}
.btn--ghost{background:transparent;color:var(--text-primary);border-color:var(--border-strong)}
.btn--ghost:hover{color:var(--text-primary);border-color:var(--text-primary)}
.btn--sm{min-height:40px;padding:0 var(--space-4)}
.tlink{display:inline-flex;align-items:center;gap:8px;min-height:24px;white-space:nowrap;font-family:var(--font-mono);font-size:var(--t-button-size);letter-spacing:var(--t-button-ls);text-transform:uppercase;color:var(--action-primary);text-decoration:none;border-bottom:1px solid transparent;transition:border-color var(--motion-fast) var(--ease-standard)}
.tlink:hover{text-decoration:none;border-bottom-color:currentColor}
.tlink .btn__arrow{transition:transform var(--motion-fast) var(--ease-standard)}
.tlink:hover .btn__arrow{transform:translateX(3px)}

/* ============================================================
   01 · HEADER
   ============================================================ */
.hdr{position:sticky;top:0;z-index:60;background:rgba(8,9,10,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border-hairline)}
.hdr__in{display:flex;align-items:center;gap:var(--space-6);height:72px;max-width:var(--width-wide);margin-inline:auto;padding-inline:var(--gutter)}
.brand{display:inline-flex;align-items:baseline;gap:8px;color:var(--carbon-050);text-decoration:none;font-family:var(--font-display);font-weight:800;font-variation-settings:'wdth' 120;font-size:1.25rem;letter-spacing:-.03em;line-height:1}
.brand{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--carbon-050);text-decoration:none;font-family:var(--font-display);font-weight:800;font-variation-settings:'wdth' 120;font-size:1.25rem;letter-spacing:-.03em;line-height:1}
.brand:hover{color:var(--carbon-050);text-decoration:none}
.brand__wire{display:inline-block;width:22px;height:2px;background:var(--signal-500);margin-top:.34em}
.nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav a{position:relative;display:inline-flex;align-items:center;height:44px;padding:0 12px;white-space:nowrap;font-family:var(--font-mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--carbon-300);text-decoration:none;transition:color var(--motion-fast) var(--ease-standard)}
.nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:14px;height:1px;background:var(--signal-500);transform:scaleX(0);transform-origin:left;transition:transform var(--motion-fast) var(--ease-standard)}
.nav a:hover{color:var(--carbon-050);text-decoration:none}
.nav a:hover::after,.nav a[aria-current="true"]::after{transform:scaleX(1)}
.nav a[aria-current="true"]{color:var(--carbon-050)}
.hdr__cta{margin-left:var(--space-4);flex:none}
.burger{display:none;align-items:center;justify-content:center;width:48px;height:48px;margin-left:auto;background:transparent;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--carbon-100);cursor:pointer}
.burger span{display:block;width:18px;height:1px;background:currentColor;box-shadow:0 -5px 0 currentColor,0 5px 0 currentColor;transition:box-shadow var(--motion-fast) var(--ease-standard)}
.burger[aria-expanded="true"] span{box-shadow:0 -5px 0 transparent,0 5px 0 transparent;transform:rotate(45deg)}
.burger[aria-expanded="true"]::after{content:"";position:absolute;width:18px;height:1px;background:currentColor;transform:rotate(-45deg)}
.mnav{display:none;position:fixed;inset:72px 0 0;z-index:59;background:var(--carbon-990);border-top:1px solid var(--border-subtle);overflow-y:auto;padding:var(--space-5) var(--gutter) var(--space-8)}
.mnav[data-open="true"]{display:block}
.mnav a.mnav__item{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:0 4px;border-bottom:1px solid var(--border-subtle);font-family:var(--font-mono);font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;color:var(--carbon-100);text-decoration:none}
.mnav a.mnav__item:hover{color:var(--signal-500);text-decoration:none}
.mnav a.mnav__item span{color:var(--carbon-400)}
.mnav .btn{width:100%;margin-top:var(--space-6)}

/* ============================================================
   02 · HERO
   ============================================================ */
.hero{position:relative;background:var(--carbon-990);padding-block:clamp(3rem,1.5rem + 6vw,6.5rem) clamp(3rem,2rem + 4vw,5.5rem);overflow:hidden}
.hero__in{position:relative;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:clamp(2rem,1rem + 4vw,4.5rem);align-items:center;max-width:var(--width-wide);margin-inline:auto;padding-inline:var(--gutter)}
.hero__copy{max-width:38rem}
.hero h1{font-size:var(--t-display-l-size);line-height:var(--t-display-l-lh);letter-spacing:var(--t-display-l-ls);margin-block:var(--space-5) 0;text-wrap:balance}
.hero h1 em{font-style:normal;color:var(--signal-500)}
.hero__sub{margin-top:var(--space-5);max-width:44ch;color:var(--carbon-200);font-size:var(--t-body-lg-size);line-height:var(--t-body-lg-lh)}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-6)}
.hero__expect{display:flex;gap:10px;margin-top:var(--space-4);max-width:46ch;color:var(--carbon-300);font-size:var(--t-body-sm-size);line-height:var(--t-body-sm-lh)}
.hero__expect::before{content:"";flex:none;width:1px;background:var(--signal-500);opacity:.7}
.hero__cred{margin-top:var(--space-7);padding-top:var(--space-4);border-top:1px solid var(--border-subtle);color:var(--carbon-300);font-family:var(--font-mono);font-size:.75rem;line-height:1.6;letter-spacing:.02em;max-width:46ch}

/* engine frame — fixed aspect box, zero layout shift */
.engine{position:relative;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--3d-bg);overflow:hidden}
.engine__stage{position:relative;aspect-ratio:4/3;width:100%}
.engine__poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:opacity var(--motion-narrative) var(--ease-standard)}
.engine__stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.engine[data-live="true"] .engine__poster{opacity:0}
.engine__bar{display:flex;align-items:center;gap:var(--space-4);padding:10px 12px 10px 14px;border-top:1px solid var(--border-subtle);background:var(--carbon-950);min-height:56px}
.engine__status{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:var(--t-syslabel-size);letter-spacing:var(--t-syslabel-ls);text-transform:uppercase;color:var(--carbon-300)}
.engine__dot{width:6px;height:6px;flex:none;border-radius:var(--radius-pill);background:var(--carbon-500)}
.engine__status[data-state="running"] .engine__dot{background:var(--signal-500);box-shadow:0 0 8px var(--signal-500)}
.engine__status[data-state="complete"] .engine__dot{background:var(--live-400)}
.engine__run{margin-left:auto}
.engine__caption{padding:10px 14px;border-top:1px solid var(--border-subtle);color:var(--carbon-300);font-family:var(--font-mono);font-size:.6875rem;line-height:1.5;letter-spacing:.02em}
.engine__beats{display:flex;gap:0;border-top:1px solid var(--border-subtle)}
.engine__beat{flex:1;padding:9px 6px;border-right:1px solid var(--border-subtle);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.09em;text-transform:uppercase;color:var(--carbon-300);text-align:center;transition:color var(--motion-fast) var(--ease-standard),background var(--motion-fast) var(--ease-standard)}
.engine__beat:last-child{border-right:0}
.engine__beat[data-on="true"]{color:var(--carbon-050);background:var(--tint-signal)}

/* ============================================================
   03 · EVIDENCE STRIP + TICKER
   ============================================================ */
.strip{background:var(--carbon-900);border-block:1px solid var(--border-subtle)}
.evid{display:grid;grid-template-columns:repeat(3,1fr);border-left:1px solid var(--border-subtle)}
.evid__cell{padding:var(--space-6) var(--space-5);border-right:1px solid var(--border-subtle)}
.evid__val{font-family:var(--font-display);font-weight:800;font-variation-settings:'wdth' var(--wdth-display);font-size:clamp(2.25rem,1.4rem + 3vw,3.5rem);line-height:.9;letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--carbon-050)}
.evid__cell:first-child .evid__val{color:var(--signal-500)}
.evid__measure{margin-top:14px}
.evid__lab{margin-top:12px;font-family:var(--font-mono);font-size:var(--t-syslabel-size);letter-spacing:var(--t-syslabel-ls);text-transform:uppercase;color:var(--carbon-300)}
.evid__note{margin-top:8px;color:var(--carbon-300);font-size:.8125rem;line-height:1.55;max-width:34ch}
/* status ticker = .rx-ticker (signature.css). Local: surface + label sizing,
   raised to the 11px machine-label token for AA legibility. */
.ticker{background:var(--carbon-950);border-bottom:0}
.rx-ticker__group span{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.09em;text-transform:uppercase;color:var(--carbon-300);white-space:nowrap}
.rx-ticker__group span b{font-weight:500;color:var(--signal-500)}

/* ============================================================
   04 · LEAKAGE
   ============================================================ */
.leak__in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,1rem + 4vw,4.5rem);align-items:start}
.leak__copy h2{margin-top:var(--space-5)}
.map__in > div > h2,.faq__in h2{margin-top:var(--space-5)}
.faq__in .sec__lede{margin-top:var(--space-5)}
.leak__body{margin-top:var(--space-5);color:var(--text-secondary);font-size:var(--t-body-lg-size);line-height:var(--t-body-lg-lh);max-width:44ch}
.finding{margin-top:var(--space-6);padding:var(--space-5);background:var(--surface-primary);border:1px solid var(--border-subtle);border-left:2px solid var(--signal-500);border-radius:var(--radius-sm)}
.finding__lab{font-family:var(--font-mono);font-size:var(--t-syslabel-size);letter-spacing:var(--t-syslabel-ls);text-transform:uppercase;color:var(--signal-500)}
.finding p{margin-top:10px;color:var(--text-primary);font-size:1.0625rem;line-height:1.5}
.finding cite{display:block;margin-top:10px;font-style:normal;color:var(--text-secondary);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase}

/* journey diagram */
.jrn__hd{display:flex;align-items:center;gap:var(--space-4);padding:12px 16px;border-bottom:1px solid var(--border-subtle);flex-wrap:wrap}
.jrn__key{display:flex;gap:16px;margin-left:auto;flex-wrap:wrap}
.jrn__key i{display:inline-flex;align-items:center;gap:6px;font-style:normal;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-secondary)}
.jrn__key i::before{content:"";width:9px;height:9px;border:1px solid var(--carbon-300)}
.jrn__key i.k-human::before{border-color:var(--signal-500);border-radius:var(--radius-pill)}
.jrn__key i.k-leak::before{border-color:var(--fault-400);border-style:dashed}
.jrn__rows{display:grid}
.jrow{display:grid;grid-template-columns:34px minmax(0,1fr) minmax(0,150px);gap:var(--space-4);align-items:center;padding:14px 16px;border-bottom:1px solid var(--border-subtle);position:relative}
.jrow:last-child{border-bottom:0}
.jrow__no{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.06em;color:var(--carbon-300);font-variant-numeric:tabular-nums}
.jrow__node{display:flex;align-items:center;gap:12px;min-width:0}
.jrow__glyph{flex:none;width:11px;height:11px;border:1px solid var(--carbon-300)}
.jrow[data-type="human"] .jrow__glyph{border-color:var(--signal-500);border-radius:var(--radius-pill)}
.jrow[data-type="data"] .jrow__glyph{border-color:var(--flux-400);transform:rotate(45deg)}
.jrow__name{font-size:.9375rem;color:var(--text-primary);line-height:1.35}
.jrow__actor{display:block;margin-top:3px;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-secondary)}
.jrow__leak{display:flex;align-items:center;gap:8px;justify-content:flex-end;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.04em;text-align:right;color:var(--fault-400)}
.jrow__leak::before{content:"";flex:none;width:9px;height:9px;border:1px dashed var(--fault-400)}
.jrow[data-leak="none"] .jrow__leak{color:var(--carbon-300)}
.jrow[data-leak="none"] .jrow__leak::before{border-style:solid;border-color:var(--carbon-600)}
.jrn__ft{padding:12px 16px;border-top:1px solid var(--border-subtle);color:var(--text-secondary);font-family:var(--font-mono);font-size:.6875rem;line-height:1.5}

/* ============================================================
   05 · SIGNAL → REVENUE
   ============================================================ */
.map__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,1rem + 3vw,3.5rem);align-items:end}
.stages{margin-top:var(--space-8);display:grid;grid-template-columns:repeat(6,1fr)}
.stage{position:relative;padding:var(--space-5) var(--space-4) var(--space-6);border-right:1px solid var(--border-subtle)}
.stage:last-child{border-right:0}
.stage__no{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.14em;color:var(--action-primary)}
.stage__rail{position:relative;height:1px;margin:14px 0 16px;background:var(--border-strong)}
.stage__rail::after{content:"";position:absolute;top:-3px;left:0;width:7px;height:7px;background:var(--action-primary)}
.stage:nth-child(6) .stage__rail::after{background:var(--signal-data)}
.stage h3{font-size:1.0625rem;line-height:1.25;letter-spacing:-.015em}
.stage p{margin-top:10px;color:var(--text-secondary);font-size:.875rem;line-height:1.55}
.stage__out{margin-top:14px;padding-top:10px;border-top:1px solid var(--border-subtle);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}
.loopback{display:flex;align-items:center;gap:12px;margin-top:var(--space-4);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--signal-data)}
.loopback::before{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--flux-400))}
.loopback::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--flux-400),transparent)}

/* ============================================================
   06 · WHAT WE ENGINEER
   ============================================================ */
.cap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,3fr);gap:clamp(1.5rem,1rem + 2vw,3rem);padding:clamp(1.75rem,1rem + 2vw,2.75rem);border-bottom:1px solid var(--border-subtle)}
.cap:last-child{border-bottom:0}
.cap__idx{font-family:var(--font-display);font-weight:800;font-variation-settings:'wdth' var(--wdth-display);font-size:clamp(2rem,1.4rem + 2vw,3rem);line-height:.85;letter-spacing:-.045em;color:var(--action-primary);font-variant-numeric:tabular-nums}
.cap h3{margin-top:14px;font-size:var(--t-h3-size);line-height:var(--t-h3-lh);letter-spacing:var(--t-h3-ls)}
.cap__desc{margin-top:12px;color:var(--text-secondary);font-size:.9375rem;line-height:1.6}
.cap__list{margin:0;padding:0;list-style:none;display:grid;gap:0;align-content:start}
.cap__list li{display:flex;gap:12px;padding:9px 0;border-bottom:1px solid var(--border-hairline);font-size:.9375rem;color:var(--text-primary);line-height:1.45}
.cap__list li:last-child{border-bottom:0}
.cap__list li::before{content:"";flex:none;width:5px;height:5px;margin-top:.55em;background:var(--border-strong)}
.cap__out{align-self:start;padding:var(--space-4);background:var(--surface-well);border-radius:var(--radius-sm)}
.cap__out .syslabel{color:var(--action-primary)}
.cap__out p{margin-top:10px;font-size:.9375rem;line-height:1.5;color:var(--text-primary)}

/* ============================================================
   07 · FEATURED SYSTEMS
   ============================================================ */
.sys{display:grid;grid-template-columns:minmax(0,2.6fr) minmax(0,4fr) minmax(0,3fr);gap:clamp(1.5rem,1rem + 2vw,3rem);padding-block:clamp(1.75rem,1rem + 2vw,2.5rem);border-top:1px solid var(--border-subtle)}
.sys:last-of-type{border-bottom:1px solid var(--border-subtle)}
.sys__tag{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;white-space:nowrap;border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-primary)}
.sys__tag[data-kind="client"]{color:var(--action-primary);border-color:var(--action-primary);font-weight:500}
.sys h3{margin-top:14px;font-size:var(--t-h3-size);line-height:1.1;letter-spacing:-.02em}
.sys__ctx{margin-top:10px;color:var(--text-secondary);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;line-height:1.6}
.sys dl{margin:0;display:grid;gap:var(--space-4)}
.sys dt{font-family:var(--font-mono);font-size:var(--t-syslabel-size);letter-spacing:var(--t-syslabel-ls);text-transform:uppercase;color:var(--text-muted)}
.sys dd{margin:6px 0 0;color:var(--text-primary);font-size:.9375rem;line-height:1.6}
.sys__figure{font-family:var(--font-display);font-variation-settings:'wdth' 118;font-weight:800;font-size:1.5rem;letter-spacing:-.03em}
.sys__stack{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.sys__stack span{padding:4px 8px;white-space:nowrap;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.06em;color:var(--text-secondary)}
.sys__res{align-self:start;padding:var(--space-5);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--surface-well)}
.sys__res .syslabel{color:var(--action-primary)}
.sys__res p{margin-top:10px;font-size:.9375rem;line-height:1.55;color:var(--text-primary)}
.sys__res small{display:block;margin-top:12px;padding-top:10px;border-top:1px solid var(--border-subtle);color:var(--text-secondary);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.05em;line-height:1.6}

/* ============================================================
   08 · INDUSTRIES
   ============================================================ */
.inds{display:grid;grid-template-columns:repeat(3,1fr)}
.ind{padding:clamp(1.5rem,1rem + 1.5vw,2.25rem);border-right:1px solid var(--border-subtle)}
.ind:last-child{border-right:0}
.ind h3{font-size:var(--t-h4-size);line-height:1.25}
.ind__who{margin-top:10px;color:var(--text-secondary);font-size:.875rem;line-height:1.55}
.ind__sys{margin:var(--space-4) 0 0;padding:var(--space-4) 0 0;border-top:1px solid var(--border-subtle);list-style:none;display:grid;gap:7px}
.ind__sys li{display:flex;gap:10px;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary);line-height:1.5}
.ind__sys li::before{content:"▸";color:var(--action-primary)}

/* ============================================================
   09 · OFFERS
   ============================================================ */
.offers{display:grid;grid-template-columns:repeat(3,1fr)}
.offer{display:flex;flex-direction:column;padding:clamp(1.5rem,1rem + 1.5vw,2.25rem);border-right:1px solid var(--border-subtle)}
.offer:last-child{border-right:0}
.offer[data-lead="true"]{background:var(--surface-well)}
.offer__no{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.14em;color:var(--action-primary)}
.offer h3{margin-top:12px;font-size:var(--t-h4-size);line-height:1.2}
.offer__best{margin-top:10px;color:var(--text-secondary);font-size:.875rem;line-height:1.55}
.offer__price{margin-top:var(--space-5);padding-top:var(--space-4);border-top:1px solid var(--border-subtle);display:flex;align-items:baseline;gap:8px}
.offer__price b{font-family:var(--font-display);font-weight:800;font-variation-settings:'wdth' var(--wdth-display);font-size:2rem;line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--text-primary)}
.offer__price span{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.offer h4{margin-top:var(--space-5);font-family:var(--font-mono);font-weight:500;font-size:var(--t-syslabel-size);letter-spacing:var(--t-syslabel-ls);text-transform:uppercase;color:var(--text-muted)}
.offer ul{margin:10px 0 0;padding:0;list-style:none;display:grid;gap:0}
.offer ul li{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-hairline);font-size:.875rem;line-height:1.45;color:var(--text-primary)}
.offer ul li:last-child{border-bottom:0}
.offer ul li::before{content:"";flex:none;width:5px;height:5px;margin-top:.5em;background:var(--action-primary)}
.offer__out{margin-top:var(--space-4);color:var(--text-secondary);font-size:.875rem;line-height:1.55}
.offer__out b{color:var(--text-primary);font-weight:600}
.offer .btn,.offer .tlink{margin-top:auto;align-self:flex-start}
.offer .btn{margin-top:var(--space-5)}
.offer .tlink{margin-top:var(--space-5)}
.offers__note{margin-top:var(--space-4);color:var(--text-secondary);font-size:.8125rem;line-height:1.6;max-width:70ch}

/* ============================================================
   10 · PROCESS
   ============================================================ */
.proc{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--border-subtle)}
.step{position:relative;display:flex;flex-direction:column;padding:var(--space-6) var(--space-5) 0 0;border-right:1px solid var(--border-subtle)}
.step:last-child{border-right:0;padding-right:0}
.step:not(:first-child){padding-left:var(--space-5)}
.step::before{content:"";position:absolute;top:-1px;left:0;width:38%;height:1px;background:var(--signal-500)}
.step:not(:first-child)::before{left:0}
.step__no{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.14em;color:var(--text-muted)}
.step h3{margin-top:12px;font-size:var(--t-h3-size);line-height:1.1;letter-spacing:-.02em}
.step p{margin-top:12px;color:var(--text-secondary);font-size:.9375rem;line-height:1.6}
.step ul{margin:var(--space-4) 0 0;padding:0;list-style:none;display:grid;gap:6px}
.step ul li{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary);line-height:1.55}
.step__meta{margin-top:auto;padding-top:10px;border-top:1px solid var(--border-subtle);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--action-primary)}
.step ul{margin-bottom:var(--space-5)}

/* ============================================================
   11 · FOUNDER
   ============================================================ */
.fndr{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2rem,1rem + 4vw,4.5rem);align-items:center}
.fndr__media{max-width:400px;justify-self:end;width:100%}
.fndr__lead{margin:var(--space-5) 0 0;font-family:var(--font-display);font-weight:500;font-variation-settings:'wdth' 106;font-size:clamp(1.4rem,1.05rem + 1.5vw,2.1rem);line-height:1.24;letter-spacing:-.028em;color:var(--text-primary);max-width:24ch}
.fndr__body{margin-top:var(--space-5);color:var(--text-secondary);font-size:var(--t-body-size);line-height:1.65;max-width:52ch}
.fndr__body + .fndr__body{margin-top:var(--space-4)}
.fndr__facts{margin:var(--space-6) 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--border-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-sm)}
.fndr__facts li{background:var(--surface-canvas);padding:var(--space-4)}
.fndr__facts b{display:block;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);font-weight:500}
.fndr__facts span{display:block;margin-top:6px;font-size:.9375rem;line-height:1.45;color:var(--text-primary)}
.sigplate{position:relative;aspect-ratio:4/5;display:grid;place-items:center;background:var(--surface-primary);border:1px solid var(--border-subtle);border-radius:var(--radius-md);overflow:hidden}
.sigplate::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--border-hairline) 1px,transparent 1px),linear-gradient(90deg,var(--border-hairline) 1px,transparent 1px);background-size:32px 32px}
.sigplate__mark{position:relative;font-family:var(--font-display);font-weight:800;font-variation-settings:'wdth' 120;font-size:clamp(6rem,4rem + 10vw,11rem);line-height:.8;letter-spacing:-.06em;color:var(--text-primary)}
.sigplate__mark::after{content:"";position:absolute;right:-.06em;bottom:.16em;width:.42em;height:6px;background:var(--signal-500)}
.sigplate__cap{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;border-top:1px solid var(--border-subtle);background:var(--surface-canvas);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-secondary);display:flex;justify-content:space-between;gap:12px}

/* ============================================================
   12 · SYSTEMS LAB
   ============================================================ */
.lab{display:grid;grid-template-columns:repeat(3,1fr)}
.labitem{display:flex;flex-direction:column;padding:clamp(1.5rem,1rem + 1.5vw,2.25rem);border-right:1px solid var(--border-subtle)}
.labitem:last-child{border-right:0}
.labitem__kind{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--action-primary)}
.labitem h3{margin-top:12px;font-size:var(--t-h4-size);line-height:1.25}
.labitem dl{margin:var(--space-4) 0 0;display:grid;gap:12px}
.labitem dt{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-secondary)}
.labitem dd{margin:4px 0 0;font-size:.875rem;line-height:1.55;color:var(--text-secondary)}
.labitem dd:last-of-type{color:var(--text-primary)}

/* ============================================================
   13 · FAQ
   ============================================================ */
.faq__in{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(2rem,1rem + 4vw,4.5rem);align-items:start}
.faqlist{border-top:1px solid var(--border-subtle)}
.faqlist details{border-bottom:1px solid var(--border-subtle)}
.faqlist summary{display:flex;align-items:center;gap:var(--space-4);min-height:60px;padding:14px 0;cursor:pointer;list-style:none;font-family:var(--font-sans);font-weight:600;font-size:1.0625rem;line-height:1.35;letter-spacing:-.01em;color:var(--text-primary)}
.faqlist summary::-webkit-details-marker{display:none}
.faqlist summary::after{content:"";flex:none;margin-left:auto;width:11px;height:11px;border-right:1px solid var(--action-primary);border-bottom:1px solid var(--action-primary);transform:rotate(45deg) translateY(-3px);transition:transform var(--motion-fast) var(--ease-standard)}
.faqlist details[open] summary::after{transform:rotate(-135deg) translateY(-3px)}
.faqlist summary:hover{color:var(--action-primary)}
.faqlist details p{padding:0 var(--space-8) var(--space-5) 0;color:var(--text-secondary);font-size:.9375rem;line-height:1.65;max-width:66ch}
.faqlist details p + p{padding-top:0;margin-top:-8px}

/* ============================================================
   14 · DIAGNOSTIC CTA + FORM
   ============================================================ */
.cta{position:relative;background:var(--carbon-990);overflow:hidden}
.cta__in{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,1rem + 4vw,4.5rem);align-items:start}
.cta h2{margin-top:var(--space-5);max-width:16ch}
.cta__body{margin-top:var(--space-5);color:var(--carbon-300);font-size:var(--t-body-lg-size);line-height:var(--t-body-lg-lh);max-width:42ch}
.cta__after{margin:var(--space-6) 0 0;padding:0;list-style:none;display:grid;gap:0;border-top:1px solid var(--border-subtle)}
.cta__after li{display:grid;grid-template-columns:26px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--border-subtle);color:var(--carbon-200);font-size:.9375rem;line-height:1.5}
.cta__after li b{font-family:var(--font-mono);font-weight:500;font-size:.6875rem;letter-spacing:.06em;color:var(--signal-500);padding-top:.25em}
.cta__mail{margin-top:var(--space-6);color:var(--carbon-300);font-size:.875rem;line-height:1.6}
form.dform{background:var(--carbon-900);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:clamp(1.5rem,1rem + 1.5vw,2.25rem)}
.dform__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5)}
.f{display:grid;gap:7px}
.f--full{grid-column:1/-1}
.f label{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--carbon-300)}
.f label .opt{color:var(--carbon-300)}
.f .hint{font-family:var(--font-sans);font-size:.8125rem;letter-spacing:0;text-transform:none;color:var(--carbon-300);line-height:1.5}
.f input,.f select,.f textarea{width:100%;min-height:48px;padding:12px 14px;background:var(--carbon-800);color:var(--carbon-050);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);font-family:var(--font-sans);font-size:1rem;line-height:1.4;box-shadow:var(--inset-technical)}
.f textarea{min-height:104px;resize:vertical}
.f select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--carbon-300) 50%),linear-gradient(135deg,var(--carbon-300) 50%,transparent 50%);background-position:calc(100% - 19px) 22px,calc(100% - 14px) 22px;background-size:5px 5px;background-repeat:no-repeat}
.f input::placeholder,.f textarea::placeholder{color:var(--carbon-400)}
.f input:focus-visible,.f select:focus-visible,.f textarea:focus-visible{border-color:var(--signal-400)}
.f .err{display:none;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.04em;color:var(--fault-400)}
.f[data-invalid="true"] input,.f[data-invalid="true"] select,.f[data-invalid="true"] textarea{border-color:var(--fault-400)}
.f[data-invalid="true"] .err{display:flex;gap:6px;align-items:center}
.f[data-invalid="true"] .err::before{content:"!";display:grid;place-items:center;width:13px;height:13px;border:1px solid currentColor;border-radius:var(--radius-pill);font-size:9px}
.dform__foot{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4);margin-top:var(--space-6);padding-top:var(--space-5);border-top:1px solid var(--border-subtle)}
.dform__priv{color:var(--carbon-300);font-size:.8125rem;line-height:1.55;max-width:40ch}
.dform__msg{margin-top:var(--space-5)}
.alert{display:grid;grid-template-columns:auto 1fr;gap:12px;padding:var(--space-4) var(--space-5);border:1px solid var(--border-subtle);border-left:2px solid var(--live-400);border-radius:var(--radius-sm);background:var(--tint-complete)}
.alert[data-kind="error"]{border-left-color:var(--fault-400);background:var(--tint-error)}
.alert__ico{display:inline-flex;margin-top:.15em;font-size:18px;color:var(--live-400)}
.alert[data-kind="error"] .alert__ico{color:var(--fault-400)}
.alert b{display:block;font-size:.9375rem;color:var(--carbon-050)}
.alert p{margin-top:5px;color:var(--carbon-300);font-size:.875rem;line-height:1.55}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ============================================================
   15 · FOOTER
   ============================================================ */
.ftr{background:var(--carbon-990);border-top:1px solid var(--border-subtle);padding-block:var(--space-8) var(--space-6)}
.ftr__top{display:grid;grid-template-columns:minmax(0,4fr) repeat(3,minmax(0,2fr));gap:var(--space-6);padding-bottom:var(--space-7);border-bottom:1px solid var(--border-subtle)}
.ftr__about{color:var(--carbon-300);font-size:.875rem;line-height:1.65;max-width:36ch;margin-top:var(--space-4)}
.ftr h2{font-family:var(--font-mono);font-weight:500;font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--carbon-300)}
.ftr ul{margin:var(--space-4) 0 0;padding:0;list-style:none;display:grid;gap:2px}
.ftr ul a{display:inline-flex;align-items:center;min-height:32px;color:var(--carbon-300);font-size:.875rem;text-decoration:none}
.ftr ul a:hover{color:var(--signal-500);text-decoration:none}
.ftr__btm{display:flex;flex-wrap:wrap;gap:var(--space-5);align-items:center;padding-top:var(--space-5)}
.ftr__btm p{color:var(--carbon-300);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.05em;line-height:1.6}
.ftr__btm p:last-child{margin-left:auto;max-width:52ch;text-align:right}

/* ============================================================
   MOTION — one restrained entrance, disabled under reduce
   ============================================================ */
.js .rv{opacity:0;transform:translateY(10px);transition:opacity var(--motion-narrative) var(--ease-standard),transform var(--motion-narrative) var(--ease-standard)}
.js .rv[data-in="true"]{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none}}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (min-width:1025px){
  .faq__in > .rv:first-child{position:sticky;top:104px}
  .leak__copy{position:sticky;top:104px}
}
@media (max-width:1180px){
  .hero__in{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
  .cap{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:var(--space-6)}
  .cap__out{grid-column:1/-1}
  .sys{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
  .sys__res{grid-column:1/-1}
  .stages{grid-template-columns:repeat(3,1fr)}
  .stage:nth-child(3){border-right:0}
  .stage:nth-child(-n+3){border-bottom:1px solid var(--border-subtle)}
}
@media (max-width:1024px){
  .nav,.hdr__cta{display:none}
  .burger{display:inline-flex;position:relative}
  .hero__in{grid-template-columns:1fr;gap:var(--space-7)}
  .hero__copy{max-width:44rem}
  .engine__stage{aspect-ratio:16/10}
  .leak__in,.map__in,.faq__in,.cta__in,.fndr{grid-template-columns:1fr}
  .fndr__media{max-width:340px;justify-self:start}
  .sigplate{aspect-ratio:1/1}
  .lab,.inds,.offers{grid-template-columns:1fr}
  .labitem,.ind,.offer{border-right:0;border-bottom:1px solid var(--border-subtle)}
  .labitem:last-child,.ind:last-child,.offer:last-child{border-bottom:0}
  .proc{grid-template-columns:repeat(2,1fr)}
  .step{border-right:1px solid var(--border-subtle);padding-bottom:var(--space-6)}
  .step:nth-child(2n){border-right:0;padding-right:0}
  .step:nth-child(2n+1){padding-left:0}
  .step:nth-child(n+3){border-top:1px solid var(--border-subtle);margin-top:-1px}
}
@media (max-width:768px){
  .sec{scroll-margin-top:76px}
  .evid{grid-template-columns:1fr;border-left:0}
  .evid__cell{border-right:0;border-bottom:1px solid var(--border-subtle);padding:var(--space-5) var(--gutter)}
  .evid__cell:last-child{border-bottom:0}
  .jrow{grid-template-columns:26px minmax(0,1fr);row-gap:8px}
  .jrow__leak{grid-column:2;justify-content:flex-start;text-align:left}
  .stages{grid-template-columns:1fr}
  .stage{border-right:0;border-bottom:1px solid var(--border-subtle);padding-block:var(--space-5)}
  .stage:last-child{border-bottom:0}
  .stage__rail{margin:10px 0 12px}
  .cap,.sys{grid-template-columns:1fr;gap:var(--space-5)}
  .dform__grid{grid-template-columns:1fr}
  .ftr__top{grid-template-columns:repeat(2,1fr)}
  .ftr__brand{grid-column:1/-1}
  .ftr__btm p:last-child{margin-left:0;text-align:left}
  .fndr__facts{grid-template-columns:1fr}
  .engine__beats{display:none}
}
@media (max-width:600px){
  .hero{padding-block:var(--space-7) var(--space-8)}
  .hero h1{font-size:clamp(2.05rem,1.1rem + 5.4vw,2.75rem)}
  .proc{grid-template-columns:1fr}
  .step{border-right:0;padding-left:0;padding-right:0}
  .step:nth-child(n+2){border-top:1px solid var(--border-subtle);margin-top:0}
  .hero__actions .btn{width:100%}
  .engine__bar{flex-wrap:wrap}
  .engine__run{margin-left:0;width:100%}
}
@media (max-width:380px){
  .ftr__top{grid-template-columns:1fr}
  .sec__head{gap:var(--space-4)}
}

/* Wide screens: hold the composition, don't stretch reading widths */
@media (min-width:1600px){
  .hero__in,.hdr__in{max-width:1480px}
}

/* ============================================================
   PERSONALITY LAYER
   Built only from the system's own devices: the width axis, the
   index plate, the wire, the measure rule, crop marks.
   Everything here is inside .js and collapses under reduce.
   ============================================================ */

/* 1 · KINETIC ENGRAVING — Archivo's width axis is the brand signal,
      so the hero headline is machined open on arrival. */
@keyframes rx-engrave{from{font-variation-settings:'wdth' 82;opacity:0}to{font-variation-settings:'wdth' 118;opacity:1}}
@keyframes rx-lift{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes rx-panel{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.js .hero h1{animation:rx-engrave 1000ms var(--ease-inout) both}
.js .hero__plate{animation:rx-lift 500ms var(--ease-standard) 60ms both}
.js .hero__sub{animation:rx-lift 620ms var(--ease-standard) 300ms both}
.js .hero__actions{animation:rx-lift 620ms var(--ease-standard) 400ms both}
.js .hero__expect{animation:rx-lift 620ms var(--ease-standard) 470ms both}
.js .hero__cred{animation:rx-lift 620ms var(--ease-standard) 540ms both}
.js .engine{animation:rx-panel 900ms var(--ease-standard) 240ms both}
.hero__plate{color:var(--carbon-300)}
.hero__plate::after{background:var(--border-strong)}

/* 2 · THE WIRE — the system's only ambient motion, threading sections */
/* the wire = .rx-wire (signature.css), including its reduced-motion collapse */

/* 3 · INDEX PLATE WIPE — the hairline draws itself in on entry */
.js .rv .rx-plate::after{transform:scaleX(0);transform-origin:left;transition:transform 1100ms var(--ease-inout) 140ms}
.js .rv[data-in="true"] .rx-plate::after{transform:scaleX(1)}

/* 4 · GHOST NUMERAL — the section index, oversized, set into the surface.
      data-index is written by homepage.js from the plate number. */
.sec__head{position:relative}
.sec__head[data-index]::after{content:attr(data-index);position:absolute;right:0;top:-.18em;font-family:var(--font-display);font-weight:800;font-variation-settings:'wdth' 118;font-size:clamp(4.5rem,11vw,10rem);line-height:.78;letter-spacing:-.06em;color:var(--text-primary);opacity:.055;pointer-events:none;font-variant-numeric:tabular-nums;z-index:0}
.sec__head > *{position:relative;z-index:1}

/* 5 · REGISTRATION CUT — a theme change is a deliberate edit, marked */
.sec[data-theme="bone"]:not([data-continues="true"])::before,#process::before,#faq::before{content:"";position:absolute;top:0;left:0;right:0;height:7px;background:repeating-linear-gradient(90deg,var(--border-strong) 0 1px,transparent 1px 13px);opacity:.75;pointer-events:none}

/* 6 · ENGINE FRAMING — the object is annotated in HTML, not in WebGL */
.engine__tick{position:absolute;z-index:2;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--carbon-200);display:flex;align-items:center;gap:8px;pointer-events:none}
.engine__tick[data-at="in"]{left:14px;top:14px}
.engine__tick[data-at="out"]{right:14px;bottom:14px;flex-direction:row-reverse}
.engine__tick::before{content:"";width:22px;height:1px;background:var(--signal-500)}
.engine{transition:border-color var(--motion-standard) var(--ease-standard)}
.engine[data-live="true"]{border-color:var(--border-strong)}
.engine__beat[data-on="true"]{box-shadow:inset 0 2px 0 var(--signal-500)}

/* 7 · MEASURED NUMERALS — counted up against the measure rule */
.evid__cell{position:relative;overflow:hidden}
.js .evid__measure{transform:scaleX(0);transform-origin:left;transition:transform 1400ms var(--ease-inout) 200ms}
.js .evid[data-counted="true"] .evid__measure{transform:scaleX(1)}
.evid__cell::after{content:"";position:absolute;left:0;top:0;width:0;height:2px;background:var(--signal-500);transition:width var(--motion-deliberate) var(--ease-standard)}
.evid__cell:hover::after{width:100%}

/* 8 · LEAKAGE ROWS — the diagram becomes something you use */
.jrow::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--fault-400);transform:scaleY(0);transform-origin:center;transition:transform var(--motion-standard) var(--ease-standard)}
.jrow{transition:background var(--motion-fast) var(--ease-standard)}
.jrow:hover,.jrow:focus-within{background:rgba(255,85,85,.055)}
.jrow:hover::before,.jrow:focus-within::before{transform:scaleY(1)}
.jrow[data-leak="none"]:hover{background:var(--tint-signal)}
.jrow[data-leak="none"]::before{background:var(--signal-500)}
.jrow:hover .jrow__glyph{border-color:var(--signal-500)}
.jrow__leak{transition:color var(--motion-fast) var(--ease-standard)}

/* 9 · MODULE HOVER CRAFT — a rule wipes in from the left, marks ignite */
.offer,.labitem,.ind,.stage,.sys,.step{position:relative}
.offer::after,.labitem::after,.ind::after,.stage::after,.sys::after{content:"";position:absolute;left:0;top:0;width:0;height:2px;background:var(--action-primary);transition:width var(--motion-deliberate) var(--ease-standard);pointer-events:none}
.offer:hover::after,.labitem:hover::after,.ind:hover::after,.stage:hover::after,.sys:hover::after{width:100%}
.sys:hover .sys__tag{border-color:var(--action-primary)}
.faqlist summary::after{transition:transform var(--motion-standard) var(--ease-standard),border-color var(--motion-fast) var(--ease-standard)}
.faqlist details[open] summary{color:var(--action-primary)}

/* 10 · STEP RAIL — the process rule fills as you pass it */
.js .rv .step::before{width:0;transition:width 900ms var(--ease-inout)}
.js .rv[data-in="true"] .step::before{width:38%}
.js .rv[data-in="true"] .step:nth-child(2)::before{transition-delay:120ms}
.js .rv[data-in="true"] .step:nth-child(3)::before{transition-delay:240ms}
.js .rv[data-in="true"] .step:nth-child(4)::before{transition-delay:360ms}

@media (prefers-reduced-motion:reduce){
  .js .hero h1,.js .hero__plate,.js .hero__sub,.js .hero__actions,.js .hero__expect,.js .hero__cred,.js .engine{animation:none}
  .js .rv .rx-plate::after{transform:scaleX(1);transition:none}
  .js .evid__measure{transform:scaleX(1);transition:none}
  .js .rv .step::before{width:38%;transition:none}
}

@media (max-width:600px){
  .sec__head[data-index]::after{font-size:4rem;opacity:.05}
  .engine__tick[data-at="out"]{display:none}
}

/* ============================================================
   SYSTEM SYMBOLS + COMPILED-COMPONENT ALIGNMENT
   Values lifted from the design system's compiled components
   (_ds_bundle.js) so this page and the bundle cannot diverge.
   ============================================================ */
.ico{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none;overflow:visible}

/* Button — Button.jsx: primary hover carries --glow-signal, secondary hover
   goes to signal, arrow nudges 3px. */
.btn--primary:hover{background:var(--action-primary-hover);border-color:var(--action-primary-hover);box-shadow:var(--glow-signal)}
.btn--primary:active{background:var(--action-primary-active);box-shadow:none}
.btn--ghost:hover{color:var(--signal-500);border-color:var(--signal-500)}
.btn .ico,.tlink .ico{font-size:16px}
.btn--sm .ico{font-size:15px}

/* Badge — Badge.jsx: hairline outline, mono uppercase, live dot, no pill fill */
.badge{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:5px 9px;line-height:1}
.engine__status[data-state="running"]{border-color:var(--signal-500);color:var(--signal-500)}
.engine__status[data-state="complete"]{color:var(--live-400)}

/* SystemNode shape language — SystemNode.jsx: icon + accent by kind, human
   distinguished by shape and accent, external dashed, store capped. */
.jrow__glyph{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface-secondary);color:var(--carbon-300);font-size:15px;transition:color var(--motion-standard) var(--ease-standard),border-color var(--motion-standard) var(--ease-standard)}
.jrow[data-type="human"] .jrow__glyph{border-top:2px solid var(--signal-500);color:var(--signal-500);border-radius:0}
.jrow[data-type="data"] .jrow__glyph{border-style:dashed;color:var(--signal-data);transform:none}
.jrow:hover .jrow__glyph{color:var(--signal-500);border-color:var(--signal-500)}
.jrow{grid-template-columns:34px minmax(0,1fr) minmax(0,150px)}

/* icon placements */
.stage__no,.offer__no,.step__no,.labitem__kind,.syslabel,.finding__lab{display:flex;align-items:center;gap:9px}
.stage__no .ico,.offer__no .ico,.step__no .ico,.labitem__kind .ico,.syslabel .ico,.finding__lab .ico{font-size:17px;color:var(--action-primary)}
.cap__idx{display:flex;align-items:center;gap:14px}
.cap__ico{display:inline-flex;font-size:24px;color:var(--text-muted);transition:color var(--motion-standard) var(--ease-standard)}
.cap:hover .cap__ico{color:var(--action-primary)}
.sys__tag .ico{font-size:14px}
.engine__tick{gap:7px}
.engine__tick .ico{font-size:15px;color:var(--signal-500)}
.engine__tick::before{width:16px}

/* engine panel — Hero.jsx: signal-orange registration brackets on the live panel */
.engine::before,.engine::after{content:"";position:absolute;z-index:3;width:9px;height:9px;pointer-events:none}
.engine::before{top:0;left:0;border-top:1px solid var(--signal-500);border-left:1px solid var(--signal-500)}
.engine::after{bottom:0;right:0;border-bottom:1px solid var(--signal-500);border-right:1px solid var(--signal-500)}

/* header instrument readout — SiteHeader.jsx live status device */
.hdr__readout{display:inline-flex;align-items:center;gap:9px;margin-left:auto;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--carbon-300);white-space:nowrap}
.hdr__readout-dot{width:5px;height:5px;flex:none;border-radius:var(--radius-pill);background:var(--live-400)}
.nav{margin-left:0}

@media (max-width:1320px){.hdr__readout{display:none}.nav{margin-left:auto}}
@media (max-width:1024px){.hdr__readout{display:none}}

/* ============================================================
   READOUT COLOUR + REAL IMAGERY
   The system ships five readout tones and a six-step chart
   sequence. They are used here where they carry meaning —
   severity, kind, and stage class — never as decoration.
   ============================================================ */
[data-read="signal"]{--read:var(--signal-500);--read-tint:var(--tint-signal)}
[data-read="data"]{--read:var(--signal-data);--read-tint:var(--tint-data)}
[data-read="live"]{--read:var(--signal-complete);--read-tint:var(--tint-complete)}
[data-read="alert"]{--read:var(--signal-warning);--read-tint:var(--tint-warning)}

/* evidence — each measured figure carries its own readout */
.evid__cell[data-read] .evid__val{color:var(--read)}
.evid__cell[data-read]::after{background:var(--read)}
.evid__cell[data-read] .rx-measure{background-image:repeating-linear-gradient(90deg,var(--read) 0 1px,transparent 1px 8px);opacity:.55}
.evid__cell:nth-child(2) .evid__val,.evid__cell:nth-child(3) .evid__val{color:var(--read)}

/* operating model — the stage class shows in the rail node and icon */
.stage[data-read] .stage__rail::after{background:var(--read)}
.stage[data-read] .stage__no .ico{color:var(--read)}
.stage[data-read]::after{background:var(--read)}
.stage[data-read]:hover{background:var(--read-tint)}

/* industries, offers, lab — group identity, one tone each */
.ind[data-read] .syslabel .ico,.labitem[data-read] .labitem__kind,.labitem[data-read] .labitem__kind .ico,.offer[data-read] .offer__no,.offer[data-read] .offer__no .ico{color:var(--read)}
.ind[data-read]::after,.labitem[data-read]::after,.offer[data-read]::after{background:var(--read)}
.ind[data-read] .ind__sys li::before{color:var(--read)}
.offer[data-read] ul li::before{background:var(--read)}
.offer[data-read][data-lead="true"]{background:var(--read-tint)}

/* lead journey — severity is stated in the label AND shown in colour */
.jrow__no[data-sev]{position:relative;padding-left:13px}
.jrow__no[data-sev]::before{content:"";position:absolute;left:0;top:.32em;width:5px;height:5px;border-radius:var(--radius-pill)}
.jrow__no[data-sev="high"]::before{background:var(--fault-400)}
.jrow__no[data-sev="med"]::before{background:var(--alert-400)}
.jrow__no[data-sev="data"]::before{background:var(--flux-400)}
.jrow[data-sev="high"] .jrow__leak{color:var(--fault-400)}
.jrow[data-sev="med"] .jrow__leak{color:var(--alert-400)}
.jrow[data-sev="med"] .jrow__leak::before{border-color:var(--alert-400)}
.jrow[data-sev="data"] .jrow__leak{color:var(--flux-400)}
.jrow[data-sev="data"] .jrow__leak::before{border-color:var(--flux-400)}
.jrow[data-sev="high"]::before{background:var(--fault-400)}
.jrow[data-sev="med"]::before{background:var(--alert-400)}
.jrow[data-sev="data"]::before{background:var(--flux-400)}
.jrow[data-sev="med"]:hover,.jrow[data-sev="med"]:focus-within{background:var(--tint-warning)}
.jrow[data-sev="data"]:hover,.jrow[data-sev="data"]:focus-within{background:var(--tint-data)}

/* ---- PHOTOGRAPHY ------------------------------------------
   Client-supplied imagery only. Slots stay empty and labelled
   until real photographs are dropped in — nothing stock,
   nothing generated, no invented person. */
image-slot{display:block;width:100%;height:100%}
.shot{position:relative;aspect-ratio:4/3;margin-bottom:var(--space-5);border:1px solid var(--border-subtle);background:var(--surface-well);overflow:hidden}
.sys:hover .shot{border-color:var(--border-strong)}

.portrait{position:relative;margin:0}
.portrait image-slot{aspect-ratio:4/5;border:1px solid var(--border-subtle);background:var(--surface-well)}
.portrait__cap{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid var(--border-subtle);border-top:0;background:var(--surface-canvas);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-secondary)}

.band{position:relative;background:var(--carbon-950);border-block:1px solid var(--border-subtle)}
.band__media{position:relative;height:clamp(220px,32vw,420px);background:var(--surface-well)}
.band__cap{display:flex;flex-wrap:wrap;align-items:baseline;gap:14px;max-width:var(--width-wide);margin-inline:auto;padding:14px var(--gutter);color:var(--carbon-300);font-size:.9375rem;line-height:1.55}
.band__cap .syslabel{color:var(--flux-400);flex:none}
.band__cap .syslabel .ico{color:var(--flux-400)}

@media (max-width:768px){.shot{aspect-ratio:16/9}}

/* ---- SYSTEM ARTIFACT ---------------------------------------
   A real fragment of shipped configuration, annotated. The system
   principle is "show the system" — not technology symbolism. */
.artifact{margin:var(--space-7) 0 0;background:var(--surface-primary);border:1px solid var(--border-subtle);border-radius:var(--radius-md);overflow:hidden}
.artifact__hd{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-5);padding:12px 16px;border-bottom:1px solid var(--border-subtle);background:var(--surface-well)}
.artifact__meta{margin-left:auto;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text-secondary)}
.artifact__body{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.artifact__code{margin:0;padding:var(--space-5);overflow-x:auto;background:var(--carbon-950);border-right:1px solid var(--border-subtle);font-family:var(--font-mono);font-size:.8125rem;line-height:1.75;color:var(--carbon-200);tab-size:2}
.artifact__code .k{color:var(--signal-400)}
.artifact__code .o{color:var(--carbon-400)}
.artifact__code .n{color:var(--live-400)}
.artifact__code .c{color:var(--flux-400);opacity:.85}
.artifact__notes{margin:0;padding:0;list-style:none;display:grid;align-content:start}
.artifact__notes li{padding:var(--space-5);border-bottom:1px solid var(--border-subtle);position:relative}
.artifact__notes li:last-child{border-bottom:0}
.artifact__notes li::before{content:"";position:absolute;left:0;top:var(--space-5);bottom:var(--space-5);width:2px;background:var(--read)}
.artifact__notes b{display:block;font-size:.9375rem;line-height:1.35;color:var(--text-primary)}
.artifact__notes span{display:block;margin-top:7px;font-size:.875rem;line-height:1.6;color:var(--text-secondary)}
@media (max-width:900px){.artifact__body{grid-template-columns:1fr}.artifact__code{border-right:0;border-bottom:1px solid var(--border-subtle);font-size:.75rem}}

/* ============================================================
   PAGE BALANCE — light-dominant with full-bleed colour blocks.
   The system already ships the bone counter-theme and a signal
   at full strength; this uses both as page-level movements
   instead of keeping everything inside one dark enclosure.
   ============================================================ */

/* tinted movements — a section carries its readout, faintly, edge to edge */
.sec[data-tint="data"]{background:linear-gradient(180deg,var(--tint-data),transparent 60%),var(--surface-canvas)}
.sec[data-tint="live"]{background:linear-gradient(180deg,var(--tint-complete),transparent 60%),var(--surface-canvas)}
.sec[data-tint="signal"]{background:linear-gradient(180deg,var(--tint-signal),transparent 60%),var(--surface-canvas)}

/* THE SIGNAL BLOCK — one full-bleed orange moment, at the conversion point.
   Carbon ink on signal is 8.4:1, so this is the highest-contrast section
   on the page as well as the loudest. */
.sec[data-theme="signal"]{
  --surface-canvas:var(--signal-500);--surface-primary:var(--signal-600);
  --surface-secondary:var(--signal-600);--surface-well:var(--signal-600);
  --text-primary:#0C0E0F;--text-secondary:#2A1305;--text-muted:#3A1C07;
  --border-subtle:rgba(12,14,15,.22);--border-strong:rgba(12,14,15,.4);
  --border-hairline:rgba(12,14,15,.12);
  --action-primary:#0C0E0F;--action-primary-hover:#191D1F;--action-primary-active:#000;
  --text-onaction:var(--signal-500);--focus-ring:#0C0E0F;
  background:var(--signal-500)
}
.sec[data-theme="signal"] h2,.sec[data-theme="signal"] .rx-plate b,.sec[data-theme="signal"] .cta__after li b{color:#0C0E0F}
.sec[data-theme="signal"] .cta__body,.sec[data-theme="signal"] .cta__after li,.sec[data-theme="signal"] .cta__mail{color:#2A1305}
.sec[data-theme="signal"] .cta__mail a{color:#0C0E0F;text-decoration:underline;text-underline-offset:3px}
.sec[data-theme="signal"] .sec__head[data-index]::after{opacity:.13}
/* the form stays a dark instrument panel, sitting on the orange */
.sec[data-theme="signal"] form.dform{background:var(--carbon-990);border-color:var(--carbon-700)}
.sec[data-theme="signal"] .dform .f label{color:var(--carbon-300)}
.sec[data-theme="signal"] .dform .rx-plate{color:var(--carbon-400)}
.sec[data-theme="signal"] .dform .rx-plate b{color:var(--signal-500)}
.sec[data-theme="signal"] .dform .btn--primary{background:var(--signal-500);border-color:var(--signal-500);color:#0C0E0F}
.sec[data-theme="signal"] .dform .btn--primary:hover{background:var(--signal-400);border-color:var(--signal-400)}
.sec[data-theme="signal"] .dform input,.sec[data-theme="signal"] .dform select,.sec[data-theme="signal"] .dform textarea{background:var(--carbon-800);color:var(--carbon-050);border-color:var(--carbon-700)}
.sec[data-theme="signal"] .dform__priv,.sec[data-theme="signal"] .dform .hint{color:var(--carbon-300)}
.sec[data-theme="signal"] .dform .alert b{color:var(--carbon-050)}
.sec[data-theme="signal"] .dform .alert p{color:var(--carbon-300)}

/* ---- SEAMS -------------------------------------------------
   A change of surface is a deliberate edit, so it gets a marked
   join instead of a hard cut. The system's measure rule straddles
   the boundary — ticks continue through it in each surface's own
   ink — so the change reads as registration rather than collision.
   Each seam names the two surfaces it joins. The rule is masked;
   the surfaces are painted by the element itself so the mask can
   never eat them. */
.seam{position:relative;height:clamp(3rem,4.5vw,4.5rem);overflow:hidden;
  --seam-from:var(--bone-100);--seam-to:var(--bone-100);
  --ink:rgba(12,14,15,.32);--ink-soft:rgba(12,14,15,.14);
  background:linear-gradient(180deg,var(--seam-from) 0 50%,var(--seam-to) 50% 100%)}
/* the rule: baseline, minor ticks every 12px, a long tick every fifth,
   faded out at both margins so it never reads as a bar */
.seam::before{content:"";position:absolute;left:0;right:0;top:0;bottom:50%;
  background-image:
    repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 60px),
    repeating-linear-gradient(90deg,var(--ink-soft) 0 1px,transparent 1px 12px),
    linear-gradient(var(--ink-soft),var(--ink-soft));
  background-size:100% 11px,100% 5px,100% 1px;
  background-position:bottom,bottom,bottom;
  background-repeat:no-repeat;
  mask-image:linear-gradient(90deg,transparent,#000 16%,#000 84%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 16%,#000 84%,transparent)}
.seam[data-seam="carbon-bone"]{--seam-from:#0C0E0F;--ink:rgba(244,246,247,.28);--ink-soft:rgba(244,246,247,.12)}
.seam[data-seam="raised-bone"]{--seam-from:var(--carbon-900);--ink:rgba(244,246,247,.28);--ink-soft:rgba(244,246,247,.12)}
.seam[data-seam="bone-carbon"]{--seam-to:#0C0E0F}
.seam[data-seam="bone-signal"]{--seam-to:var(--signal-500)}
.seam[data-seam="carbon-raised"]{--seam-from:var(--carbon-950);--seam-to:var(--carbon-900);--ink:rgba(244,246,247,.26);--ink-soft:rgba(244,246,247,.11)}
.seam[data-seam="signal-carbon"]{--seam-from:var(--signal-500);--seam-to:#0C0E0F;--ink:rgba(12,14,15,.40);--ink-soft:rgba(12,14,15,.18)}

/* the photography band sits inside the carbon enclosure */
.band{border-block:0}

/* a tinted section blooms from its seam rather than switching on at an edge */
.sec[data-tint]{background-position:top}

/* GIANT WORDMARK — the footer's base plate */
.ftr__mark{display:flex;align-items:flex-end;gap:.04em;margin:var(--space-8) 0 0;font-family:var(--font-display);font-weight:800;font-variation-settings:'wdth' 120;font-size:clamp(4rem,17.5vw,17rem);line-height:.74;letter-spacing:-.055em;color:var(--carbon-850);user-select:none;overflow:hidden}
.ftr__mark span{flex:none;width:.34em;height:.05em;margin-bottom:.17em;background:var(--signal-500)}
.ftr{padding-bottom:var(--space-5)}
.ftr__btm{margin-top:var(--space-4);border-top:1px solid var(--border-subtle)}

@media print{
  .hdr,.mnav,.engine__bar,.ticker,.rv{display:revert}
  .rv{opacity:1;transform:none}
}