/* tokens/fonts.css */
/* ZAP MG 2026 — Webfonts
   Display: Satoshi Black 900 (local, Fontshare Free Font License, assets/fonts/Satoshi-LICENSE.txt).
   Body: Instrument Sans 400/500/600 (Google Fonts).
   Alternates shown on the Typography page only: Cabinet Grotesk (Fontshare CDN), Inter Tight (Google). No mono. */

@font-face{font-family:'Satoshi';font-weight:400;font-style:normal;font-display:swap;src:url('/_ds/zap-mg-2026-design-system-03ad16fb-8cae-41ab-938e-16fb4c1ee928/assets/fonts/Satoshi-Regular.woff2') format('woff2')}
@font-face{font-family:'Satoshi';font-weight:500;font-style:normal;font-display:swap;src:url('/_ds/zap-mg-2026-design-system-03ad16fb-8cae-41ab-938e-16fb4c1ee928/assets/fonts/Satoshi-Medium.woff2') format('woff2')}
@font-face{font-family:'Satoshi';font-weight:700;font-style:normal;font-display:swap;src:url('/_ds/zap-mg-2026-design-system-03ad16fb-8cae-41ab-938e-16fb4c1ee928/assets/fonts/Satoshi-Bold.woff2') format('woff2')}
@font-face{font-family:'Satoshi';font-weight:900;font-style:normal;font-display:swap;src:url('/_ds/zap-mg-2026-design-system-03ad16fb-8cae-41ab-938e-16fb4c1ee928/assets/fonts/Satoshi-Black.woff2') format('woff2')}
/* Variable axis (wght 300–900) for kinetic type only — static weights above remain the default. */
@font-face{font-family:'Satoshi Variable';font-weight:300 900;font-style:normal;font-display:swap;src:url('/_ds/zap-mg-2026-design-system-03ad16fb-8cae-41ab-938e-16fb4c1ee928/assets/fonts/Satoshi-Variable.woff2') format('woff2')}

/* tokens/colors.css */
/* ZAP MG 2026 — Color. Brand colors carried from the previous ZAP MG system; everything else new. */
:root{
  /* Red */
  --logo-red:#f95943;        /* LOGO ONLY */
  --red-500:#e2654f;         /* site accent: one or two moments per screen */
  --red-600:#c9543f;         /* pressed */
  --red-ink:#b0452f;         /* small red text on light (AA) */
  --red-glow:rgba(226,101,79,.06); /* dark-section ambient glow */
  --amber-glow:rgba(226,140,79,.05);
  /* Light */
  --paper-100:#f5f3ef;       /* light sections */
  --paper-200:#ebe8e2;       /* tonal step */
  --paper-300:#ddd8cf;       /* deeper warm gray */
  --white:#ffffff;
  /* Dark */
  --ink-950:#0d0d0d;         /* dark sections */
  --charcoal-900:#171615;    /* softer charcoal */
  --charcoal-800:#211f1d;    /* raised panel on dark */
  --charcoal-700:#2d2a27;    /* hover on dark */
  /* Ink grays (text) */
  --ink-900:#0d0d0d;--ink-700:#363431;--ink-500:#5c5955;--ink-400:#8a8680;--ink-300:#aaa59d;
  /* Lines */
  --line:#e8e5e0;--line-strong:#cfc9bf;
  --line-dark:rgba(245,243,239,.12);--line-dark-strong:rgba(245,243,239,.26);
  /* On-dark text */
  --on-dark:#f5f3ef;--on-dark-70:rgba(245,243,239,.72);--on-dark-50:rgba(245,243,239,.5);--on-dark-35:rgba(245,243,239,.35);
  /* Semantic */
  --accent:var(--red-500);--accent-pressed:var(--red-600);
  --bg-light:var(--paper-100);--bg-light-alt:var(--paper-200);--bg-light-deep:var(--paper-300);
  --bg-dark:var(--ink-950);--bg-dark-alt:var(--charcoal-900);
  --surface-panel-dark:var(--charcoal-800);--surface-panel-light:var(--white);
  --text-strong:var(--ink-900);--text-body:var(--ink-700);--text-muted:var(--ink-500);--text-subtle:var(--ink-400);
  --text-on-dark:var(--on-dark);--text-on-dark-muted:var(--on-dark-70);--text-on-dark-subtle:var(--on-dark-50);
  --text-accent:var(--red-ink);--text-accent-on-dark:var(--red-500);
  --border:var(--line);--border-strong:var(--line-strong);--border-ink:var(--ink-900);--border-on-dark:var(--line-dark);--border-on-dark-strong:var(--line-dark-strong);
  --node:var(--ink-900);--node-on-dark:var(--on-dark);--node-active:var(--red-500);
  --status-ok:#3f7d58;--status-warn:#b8862b;--status-error:var(--red-ink);
}

/* tokens/typography.css */
/* ZAP MG 2026 — Type. Typography IS the identity: enormous display vs quiet body. No mono, no eyebrows. */
:root{
  --font-display:'Satoshi','Instrument Sans',system-ui,sans-serif;
  --font-body:'Instrument Sans','Satoshi',system-ui,sans-serif;
  --fw-display:900;/* @kind font */--fw-display-alt:700;/* @kind font */--fw-body:400;/* @kind font */--fw-medium:500;/* @kind font */--fw-semibold:600;/* @kind font */
  /* Desktop scale */
  --fs-hero:156px;--fs-hero-max:180px;--fs-hero-min:130px;
  --fs-display:110px;--fs-h1:88px;--fs-h2:72px;--fs-h3:40px;--fs-h4:28px;
  --fs-lead:22px;--fs-body:18px;--fs-body-sm:16px;--fs-small:14px;--fs-label:12px;
  --fs-stat:132px;--fs-stat-sm:96px;
  /* Mobile scale */
  --fs-hero-m:64px;--fs-display-m:52px;--fs-h1-m:44px;--fs-h2-m:36px;--fs-h3-m:26px;--fs-lead-m:19px;--fs-body-m:17px;--fs-stat-m:64px;
  /* Leading */
  --lh-hero:.9;/* @kind font */--lh-display:.94;/* @kind font */--lh-heading:1.02;/* @kind font */--lh-sub:1.15;/* @kind font */--lh-lead:1.4;/* @kind font */--lh-body:1.6;/* @kind font */--lh-label:1.2;/* @kind font */
  /* Tracking */
  --ls-hero:-.045em;/* @kind font */--ls-display:-.035em;/* @kind font */--ls-heading:-.025em;/* @kind font */--ls-sub:-.015em;/* @kind font */--ls-body:0;/* @kind font */--ls-label:.08em;/* @kind font */
}

/* Fluid scale responding to viewport height as well as width */
:root{--fs-hero-fluid:clamp(56px,min(7.2vw,11.5vh),168px);--fs-headline-fluid:clamp(40px,min(5vw,8vh),110px);--fs-tagline-fluid:calc(var(--fs-hero-fluid) * .4)}
@media(min-width:1280px) and (max-height:1100px){:root{--lh-hero:.92;--lh-display:.92;--lh-heading:.92}}

/* tokens/spacing.css */
/* ZAP MG 2026 — Layout. 1440 canvas, 12 columns, generous section rhythm, radius 0–4. */
:root{
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:128px;--space-11:160px;--space-12:224px;
  --canvas:1440px;/* @kind spacing */--cols:12;/* @kind spacing */--gutter:24px;/* @kind spacing */--margin:72px;/* @kind spacing */--margin-m:20px;/* @kind spacing */--gutter-m:16px;/* @kind spacing */
  --section-y:176px;/* @kind spacing */--section-y-lg:240px;/* @kind spacing */--section-y-sm:120px;/* @kind spacing */--section-y-m:96px;/* @kind spacing */
  --measure:62ch;/* @kind spacing */--measure-lead:40ch;/* @kind spacing */
  --radius-0:0;--radius-1:2px;--radius-2:4px;
  --hairline:1px;/* @kind spacing */--rule:2px;/* @kind spacing */
  --nav-h:84px;/* @kind spacing */--nav-h-scrolled:64px;/* @kind spacing */
}

/* Content width + wide-short desktop (1920×1080 class) */
:root{--canvas-content:1360px;/* @kind spacing */}
@media(min-width:1280px) and (max-height:1100px){:root{--section-y:136px;--section-y-lg:184px;--section-y-sm:92px}}

/* tokens/motion.css */
/* ZAP MG 2026 — Motion. Calm, premium micro-motion. One easing. */
:root{
  --ease:cubic-bezier(.22,1,.36,1);/* @kind other */--ease-in-out:cubic-bezier(.65,0,.35,1);/* @kind other */
  --dur-hover:300ms;/* @kind other */--dur-hover-fast:250ms;/* @kind other */--dur-hover-slow:400ms;/* @kind other */
  --dur-reveal:800ms;/* @kind other */--dur-reveal-fast:600ms;/* @kind other */--dur-reveal-slow:900ms;/* @kind other */
  --stagger:80ms;/* @kind other */--dur-page:700ms;/* @kind other */--dur-count:1400ms;/* @kind other */
  --drift-glow:32s;/* @kind other */--drift-dots:48s;/* @kind other */--draw-lines:6s;/* @kind other */
  --hover-lift:-2px;/* @kind other */--hover-scale:1.012;/* @kind other */--panel-expand:1.02;/* @kind other */
}
@media(prefers-reduced-motion:reduce){:root{--dur-hover:0ms;/* @kind other */--dur-reveal:0ms;/* @kind other */--dur-reveal-fast:0ms;/* @kind other */--dur-reveal-slow:0ms;/* @kind other */--stagger:0ms;/* @kind other */--dur-page:0ms;/* @kind other */--dur-count:0ms;/* @kind other */}}

/* tokens/effects.css */
/* ZAP MG 2026 — Depth & texture. Almost flat: hairlines do the structuring. */
:root{
  --shadow-panel:0 1px 0 rgba(13,13,13,.04),0 12px 32px -16px rgba(13,13,13,.18);
  --shadow-nav:0 1px 0 var(--line);
  --shadow-nav-dark:0 1px 0 var(--line-dark);
  --blur-nav:16px;/* @kind other */--nav-tint-light:rgba(245,243,239,.78);--nav-tint-dark:rgba(13,13,13,.7);
  --grain-opacity:.06;/* @kind other */
  --glow-size:720px;/* @kind other */--glow-blur:120px;/* @kind other */
  --font-display-variable:'Satoshi Variable','Satoshi',sans-serif;/* @kind font */
  --spot-size:320px;/* @kind spacing */--spot-color-light:rgba(13,13,13,.55);--spot-color-dark:rgba(245,243,239,.6);--spot-color-accent:rgba(226,101,79,.7);
  --tilt-max:3deg;/* @kind other */--magnet-strength:.3;/* @kind other */--magnet-radius:80px;/* @kind spacing */
  --field-opacity:.12;/* @kind other */--field-loop:45s;/* @kind other */--flow-amp:7px;/* @kind spacing */--blend-height:160px;/* @kind spacing */
  --dot-size:1px;/* @kind other */--dot-gap:28px;/* @kind other */--dot-color:rgba(13,13,13,.14);/* @kind other */--dot-color-bright:rgba(13,13,13,.42);/* @kind other */--dot-radius:220px;/* @kind other */
}

/* css/base.css */
/* ZAP MG 2026 — framework-agnostic classes. Components in components/ use these same classes. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-body);background:var(--bg-light)}
a{color:inherit;text-decoration:none;transition:color var(--dur-hover) var(--ease)}
a:hover{color:var(--accent)}
img,svg,canvas{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
::selection{background:var(--ink-900);color:var(--paper-100)}
.zap-dark ::selection{background:var(--paper-100);color:var(--ink-900)}

/* Type */
.zap-hero,.zap-display,.zap-h1,.zap-h2,.zap-h3,.zap-h4,.zap-stat{font-family:var(--font-display);font-weight:var(--fw-display);color:var(--text-strong);margin:0;text-wrap:balance}
.zap-hero{font-size:var(--fs-hero);line-height:var(--lh-hero);letter-spacing:var(--ls-hero)}
.zap-display{font-size:var(--fs-display);line-height:var(--lh-display);letter-spacing:var(--ls-display)}
.zap-h1{font-size:var(--fs-h1);line-height:var(--lh-heading);letter-spacing:var(--ls-heading)}
.zap-h2{font-size:var(--fs-h2);line-height:var(--lh-heading);letter-spacing:var(--ls-heading)}
.zap-h3{font-size:var(--fs-h3);line-height:var(--lh-sub);letter-spacing:var(--ls-sub)}
.zap-h4{font-size:var(--fs-h4);line-height:var(--lh-sub);letter-spacing:var(--ls-sub);font-weight:var(--fw-display-alt)}
.zap-stat{font-size:var(--fs-stat);line-height:.85;letter-spacing:var(--ls-hero);font-variant-numeric:tabular-nums}
.zap-lead{font-size:var(--fs-lead);line-height:var(--lh-lead);color:var(--text-body);margin:0;max-width:var(--measure-lead);text-wrap:pretty}
.zap-body{font-size:var(--fs-body);line-height:var(--lh-body);margin:0;max-width:var(--measure);text-wrap:pretty}
.zap-small{font-size:var(--fs-small);line-height:1.5;color:var(--text-muted);margin:0}
.zap-label{font-family:var(--font-body);font-size:var(--fs-label);font-weight:var(--fw-semibold);letter-spacing:var(--ls-label);text-transform:uppercase;line-height:var(--lh-label);color:var(--text-muted);margin:0}
.zap-upper{text-transform:uppercase}
.zap-accent{color:var(--accent)}
.zap-period{color:var(--accent)}
.zap-dark{background:var(--bg-dark);color:var(--text-on-dark-muted)}
.zap-dark .zap-hero,.zap-dark .zap-display,.zap-dark .zap-h1,.zap-dark .zap-h2,.zap-dark .zap-h3,.zap-dark .zap-h4,.zap-dark .zap-stat{color:var(--text-on-dark)}
.zap-dark .zap-lead{color:var(--text-on-dark-muted)}
.zap-dark .zap-small,.zap-dark .zap-label{color:var(--text-on-dark-subtle)}
@media(max-width:768px){.zap-hero{font-size:var(--fs-hero-m)}.zap-display{font-size:var(--fs-display-m)}.zap-h1{font-size:var(--fs-h1-m)}.zap-h2{font-size:var(--fs-h2-m)}.zap-h3{font-size:var(--fs-h3-m)}.zap-lead{font-size:var(--fs-lead-m)}.zap-body{font-size:var(--fs-body-m)}.zap-stat{font-size:var(--fs-stat-m)}}

/* Layout */
.zap-container{width:100%;max-width:var(--canvas);margin:0 auto;padding:0 var(--margin)}
.zap-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter)}
.zap-section{padding:var(--section-y) 0;position:relative}
.zap-section--lg{padding:var(--section-y-lg) 0}
.zap-section--sm{padding:var(--section-y-sm) 0}
.zap-rule{border:0;border-top:var(--hairline) solid var(--border);margin:0}
.zap-dark .zap-rule{border-color:var(--border-on-dark)}
.zap-rule--ink{border-color:var(--border-ink)}
@media(max-width:768px){.zap-container{padding:0 var(--margin-m)}.zap-grid{column-gap:var(--gutter-m)}.zap-section,.zap-section--lg,.zap-section--sm{padding:var(--section-y-m) 0}}

/* Buttons */
.zap-btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-body);font-weight:var(--fw-medium);font-size:var(--fs-body-sm);line-height:1;padding:18px 26px;border-radius:var(--radius-1);border:1px solid transparent;cursor:pointer;transition:background var(--dur-hover) var(--ease),color var(--dur-hover) var(--ease),border-color var(--dur-hover) var(--ease),transform var(--dur-hover) var(--ease);white-space:nowrap;text-decoration:none}
.zap-btn .zap-btn__arrow{display:inline-block;transition:transform var(--dur-hover) var(--ease)}
.zap-btn:hover .zap-btn__arrow{transform:translateX(4px)}
.zap-btn:active{transform:translateY(1px)}
.zap-btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.zap-btn--primary{background:var(--ink-900);color:var(--paper-100);border-color:var(--ink-900)}
.zap-btn--primary:hover{background:var(--accent);border-color:var(--accent);color:var(--paper-100)}
.zap-btn--primary:active{background:var(--accent-pressed);border-color:var(--accent-pressed)}
.zap-btn--secondary{background:transparent;color:var(--ink-900);border-color:var(--ink-900)}
.zap-btn--secondary:hover{border-color:var(--accent);color:var(--accent)}
.zap-btn--text{padding:0;border:0;background:none;color:var(--ink-900);border-radius:0;font-weight:var(--fw-medium)}
.zap-btn--text:hover{color:var(--accent)}
.zap-btn--sm{padding:13px 18px;font-size:var(--fs-small)}
.zap-btn--lg{padding:22px 34px;font-size:var(--fs-body)}
.zap-btn[disabled],.zap-btn--disabled{opacity:.35;pointer-events:none}
.zap-dark .zap-btn--primary,.zap-btn--on-dark.zap-btn--primary{background:var(--paper-100);color:var(--ink-900);border-color:var(--paper-100)}
.zap-dark .zap-btn--primary:hover,.zap-btn--on-dark.zap-btn--primary:hover{background:var(--accent);border-color:var(--accent);color:var(--paper-100)}
.zap-dark .zap-btn--secondary,.zap-btn--on-dark.zap-btn--secondary{color:var(--paper-100);border-color:var(--line-dark-strong)}
.zap-dark .zap-btn--secondary:hover,.zap-btn--on-dark.zap-btn--secondary:hover{border-color:var(--accent);color:var(--accent)}
.zap-dark .zap-btn--text,.zap-btn--on-dark.zap-btn--text{color:var(--paper-100)}
.zap-dark .zap-btn--text:hover,.zap-btn--on-dark.zap-btn--text:hover{color:var(--accent)}

/* Panels (architectural: hairline border, 0 radius, label row) */
.zap-panel{position:relative;border:1px solid var(--border);background:transparent;padding:32px;transition:transform var(--dur-hover-slow) var(--ease),border-color var(--dur-hover) var(--ease),background var(--dur-hover) var(--ease)}
.zap-panel:hover{transform:scale(var(--panel-expand));border-color:var(--border-strong);background:var(--surface-panel-light)}
.zap-dark .zap-panel{border-color:var(--border-on-dark)}
.zap-dark .zap-panel:hover{border-color:var(--border-on-dark-strong);background:var(--surface-panel-dark)}
.zap-panel__marker{font-size:var(--fs-label);font-weight:var(--fw-semibold);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--text-muted);display:flex;justify-content:space-between;gap:16px}
.zap-dark .zap-panel__marker{color:var(--text-on-dark-subtle)}
.zap-panel.is-active{border-color:var(--accent)}
/* Nodes, status */
.zap-node{width:8px;height:8px;border-radius:50%;background:var(--node);display:inline-block;flex:none}
.zap-dark .zap-node{background:var(--node-on-dark)}
.zap-node--active{background:var(--node-active)}
.zap-node--hollow{background:transparent;border:1px solid currentColor}
.zap-status{display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-label);font-weight:var(--fw-semibold);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--text-muted)}
.zap-status .zap-node{animation:zap-pulse 2.4s var(--ease) infinite}
@keyframes zap-pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* Form fields: underline style */
.zap-field{display:flex;flex-direction:column;gap:10px}
.zap-field__label{font-size:var(--fs-small);font-weight:var(--fw-medium);color:var(--text-strong)}
.zap-field__control{font:inherit;font-size:var(--fs-body);color:var(--text-strong);background:transparent;border:0;border-bottom:1px solid var(--border-strong);padding:12px 0;border-radius:0;outline:0;transition:border-color var(--dur-hover) var(--ease);width:100%;appearance:none;-webkit-appearance:none}
.zap-field__control::placeholder{color:var(--text-subtle)}
.zap-field__control:focus{border-bottom-color:var(--ink-900)}
.zap-field.is-error .zap-field__control{border-bottom-color:var(--status-error)}
.zap-field__hint{font-size:var(--fs-small);color:var(--text-muted)}
.zap-field.is-error .zap-field__hint{color:var(--status-error)}
.zap-field--select{position:relative}
.zap-field--select::after{content:"";position:absolute;right:4px;bottom:22px;width:8px;height:8px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);pointer-events:none;color:var(--text-muted)}
.zap-dark .zap-field__label{color:var(--text-on-dark)}
.zap-dark .zap-field__control{color:var(--text-on-dark);border-bottom-color:var(--border-on-dark-strong)}
.zap-dark .zap-field__control:focus{border-bottom-color:var(--paper-100)}
.zap-dark .zap-field__control::placeholder{color:var(--on-dark-35)}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}

/* css/backgrounds.css */
/* ZAP MG 2026 — Backgrounds: alive but quiet. One treatment per section. CSS versions; canvas versions live in components/backgrounds. */
.zap-bg{position:relative;isolation:isolate;overflow:hidden}
.zap-bg>*{position:relative;z-index:1}
.zap-bg::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none}

/* Light: drifting dot grid, brightened in a radius around the cursor (--mx/--my set by JS; static otherwise) */
.zap-bg--dots::before{background-image:radial-gradient(circle,var(--dot-color) var(--dot-size),transparent calc(var(--dot-size) + .5px));background-size:var(--dot-gap) var(--dot-gap);animation:zap-dots-drift var(--drift-dots) linear infinite}
.zap-bg--dots::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(circle,var(--dot-color-bright) var(--dot-size),transparent calc(var(--dot-size) + .5px));background-size:var(--dot-gap) var(--dot-gap);animation:zap-dots-drift var(--drift-dots) linear infinite;-webkit-mask:radial-gradient(var(--dot-radius) circle at var(--mx,50%) var(--my,50%),#000 0%,transparent 70%);mask:radial-gradient(var(--dot-radius) circle at var(--mx,50%) var(--my,50%),#000 0%,transparent 70%)}
@keyframes zap-dots-drift{from{background-position:0 0}to{background-position:var(--dot-gap) var(--dot-gap)}}

/* Dark: one soft warm glow, heavily blurred, slow drift, plus grain */
.zap-bg--glow{background:var(--bg-dark)}
.zap-bg--glow::before{width:var(--glow-size);height:var(--glow-size);inset:auto;left:20%;top:10%;border-radius:50%;background:radial-gradient(circle,rgba(226,101,79,.5),rgba(226,140,79,.25) 40%,transparent 70%);opacity:.14;filter:blur(var(--glow-blur));animation:zap-glow-drift var(--drift-glow) var(--ease-in-out) infinite alternate}
.zap-bg--glow::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:var(--grain-opacity);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes zap-glow-drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(28vw,14vh) scale(1.15)}100%{transform:translate(8vw,30vh) scale(.95)}}

/* System: faint lines + nodes that draw themselves (SVG inside uses .zap-draw) */
.zap-draw{stroke-dasharray:1000;stroke-dashoffset:1000;animation:zap-draw var(--draw-lines) var(--ease) forwards}
.zap-draw--loop{animation:zap-draw var(--draw-lines) var(--ease) infinite alternate}
@keyframes zap-draw{to{stroke-dashoffset:0}}
.zap-node-pop{transform-origin:center;animation:zap-pop var(--dur-reveal) var(--ease) both}
@keyframes zap-pop{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}

/* Living field — CSS fallback for the canvas gradient field (assets/js/zap-life.js kind "gradient"): three warm lights on slow, offset loops */
.zap-bg--field{background:var(--bg-dark)}
.zap-bg--field::before{inset:-30%;background:radial-gradient(40% 40% at 30% 35%,rgba(226,101,79,.9),transparent 70%),radial-gradient(35% 35% at 70% 60%,rgba(232,160,86,.8),transparent 70%),radial-gradient(30% 30% at 55% 25%,rgba(245,243,239,.45),transparent 70%);opacity:var(--field-opacity);filter:blur(60px);animation:zap-field-a var(--field-loop) var(--ease-in-out) infinite alternate}
.zap-bg--field::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:var(--grain-opacity);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.zap-bg--field-light{background:var(--bg-light)}
.zap-bg--field-light::before{inset:-30%;background:radial-gradient(40% 40% at 30% 35%,rgba(226,101,79,.5),transparent 70%),radial-gradient(35% 35% at 70% 60%,rgba(232,160,86,.45),transparent 70%),radial-gradient(30% 30% at 55% 25%,#fff,transparent 70%);opacity:.5;filter:blur(60px);animation:zap-field-a var(--field-loop) var(--ease-in-out) infinite alternate}
@keyframes zap-field-a{0%{transform:translate(0,0) rotate(0deg) scale(1)}33%{transform:translate(8%,6%) rotate(12deg) scale(1.08)}66%{transform:translate(-6%,10%) rotate(-8deg) scale(.96)}100%{transform:translate(4%,-6%) rotate(6deg) scale(1.04)}}

/* Section blend — smooth light↔dark hand-off instead of a hard cut; scroll-driven where supported */
.zap-blend{height:var(--blend-height);background:linear-gradient(180deg,var(--bg-light),var(--bg-dark))}
.zap-blend--to-light{background:linear-gradient(180deg,var(--bg-dark),var(--bg-light))}
@supports(animation-timeline:view()){.zap-blend-scroll{animation:zap-blend-bg linear both;animation-timeline:view();animation-range:entry 0% cover 40%}@keyframes zap-blend-bg{from{background-color:var(--bg-light)}to{background-color:var(--bg-dark)}}}

/* Spotlight border — light follows the cursor along the panel edge (--sx/--sy set by ZapLife.spotlight) */
.zap-spot{position:relative}
.zap-spot::after{content:"";position:absolute;inset:-1px;pointer-events:none;border-radius:inherit;padding:1px;background:radial-gradient(var(--spot-size) circle at var(--sx,50%) var(--sy,50%),var(--spot-color-light),transparent 60%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:var(--so,0);transition:opacity var(--dur-hover-slow) var(--ease);z-index:2}
.zap-dark .zap-spot::after{background:radial-gradient(var(--spot-size) circle at var(--sx,50%) var(--sy,50%),var(--spot-color-dark),transparent 60%)}
.zap-spot--accent::after{background:radial-gradient(var(--spot-size) circle at var(--sx,50%) var(--sy,50%),var(--spot-color-accent),transparent 60%)}
.zap-spot.zap-panel:hover{transform:none}

/* Kinetic word: variable weight (JS drives font-variation-settings); mask reveal on enter */
.zap-kinetic{font-family:var(--font-display-variable);font-variation-settings:"wght" 900;transition:letter-spacing var(--dur-hover-slow) var(--ease)}
.zap-kinetic [data-k]{font-variation-settings:"wght" 900;display:inline-block}

/* View transitions between pages: nav persists, content cross-fades + rises */
@view-transition{navigation:auto}
::view-transition-old(root){animation:zap-vt-out .35s var(--ease) both}
::view-transition-new(root){animation:zap-vt-in .7s var(--ease) both}
@keyframes zap-vt-out{to{opacity:0;transform:translateY(-12px)}}
@keyframes zap-vt-in{from{opacity:0;transform:translateY(24px)}}
.zap-vt-nav{view-transition-name:zap-nav}.zap-vt-mark{view-transition-name:zap-mark}

/* Reveals */
.zap-reveal{opacity:0;transform:translateY(24px);transition:opacity var(--dur-reveal) var(--ease),transform var(--dur-reveal) var(--ease)}
.zap-reveal.is-in{opacity:1;transform:none}
.zap-line-reveal{display:block;overflow:hidden}
.zap-line-reveal>span{display:block;transform:translateY(110%);transition:transform var(--dur-reveal-slow) var(--ease)}
.is-in .zap-line-reveal>span{transform:none}
.zap-line-extend{transform-origin:left;transform:scaleX(0);transition:transform var(--dur-reveal-slow) var(--ease)}
.is-in .zap-line-extend,.zap-line-extend.is-in{transform:scaleX(1)}

@media(prefers-reduced-motion:reduce){.zap-bg::before,.zap-bg::after{animation:none!important}::view-transition-old(root),::view-transition-new(root){animation:none}.zap-blend-scroll{animation:none}.zap-draw{stroke-dashoffset:0;animation:none}.zap-reveal,.zap-line-reveal>span,.zap-line-extend{opacity:1;transform:none;transition:none}}

/* site */

html{overflow-x:clip}body{margin:0;background:var(--bg-light)}
html:root{--bg-dark:#212020;--bg-dark-alt:#2a2827;--surface-panel-dark:#2a2827;--canvas:1360px;--fs-hero:clamp(56px,min(7.2vw,11.5vh),128px);--fs-display:clamp(44px,min(7.6vw,10vh),100px);--fs-h1:clamp(40px,min(5vw,8vh),110px);--fs-h2:clamp(32px,min(5vw,7vh),72px);--fs-h3:clamp(24px,2.8vw,40px);--fs-h4:clamp(20px,1.95vw,28px);--fs-lead:clamp(18px,1.55vw,22px);--fs-body:clamp(16px,1.25vw,18px);--section-y:clamp(80px,12vw,176px);--section-y-lg:clamp(96px,16vw,240px);--section-y-sm:clamp(56px,8vw,120px);--margin:clamp(20px,5vw,72px)}
.problem-text{font-size:clamp(20px,1.95vw,28px)!important}
.proj-kind{font-size:clamp(22px,2.2vw,32px)!important}
.built__title{font-size:clamp(24px,2.2vw,32px)!important}
a{color:inherit;text-decoration:none}a:hover{color:var(--accent)}
h1.zap-hero.home-hero{font-size:var(--fs-hero)}
.zap-line-reveal.is-in>span{transform:none}
.hl-rich{opacity:1!important;transform:none!important}
.hl-rich .hl-line{display:block;overflow:hidden}
.hl-rich .hl-line>span{display:block;transform:translateY(110%);transition:transform .9s var(--ease)}
.hl-rich .hl-line:nth-child(2)>span{transition-delay:.08s}.hl-rich .hl-line:nth-child(3)>span{transition-delay:.16s}
.hl-rich.is-in .hl-line>span{transform:none}
.problem-line{cursor:default;transition:border-color var(--dur-hover) var(--ease),padding-left var(--dur-hover-slow) var(--ease)}
.problem-line .problem-node,.problem-line .problem-text{transition:all var(--dur-hover) var(--ease)}
.problem-line:hover{border-bottom-color:var(--accent)!important;padding-left:12px}
.problem-line:hover .problem-node{background:var(--accent)!important;border-color:var(--accent)!important;transform:scale(1.25)}
.problem-line:hover .problem-text{color:var(--accent)!important}
.pivot{position:relative;margin-top:-16px;padding-top:40px}
.pivot__sweep{position:absolute;left:0;top:0;height:2px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease) .9s}
.is-in ~ .pivot .pivot__sweep,.pivot:has(.is-in) .pivot__sweep{transform:scaleX(1)}
.pivot .pivot__kicker{font:500 clamp(14px,1.1vw,16px)/1 var(--font-body);letter-spacing:.24em;color:var(--on-dark-70);margin-bottom:28px}
.pivot__big{margin:0;font-family:var(--font-display);font-weight:900;font-size:clamp(44px,5.4vw,84px);line-height:.9;letter-spacing:-.045em;color:var(--on-dark)}
.pivot__big .zap-line-reveal:first-child>span{color:var(--accent)}
.pivot__big .zap-line-reveal{display:block}
.stage{position:relative;padding:18px 0 0;cursor:default;outline:0;transition:transform var(--dur-hover-slow) var(--ease),opacity var(--dur-hover-slow) var(--ease)}
.stage__rule{position:absolute;top:0;left:0;height:2px;width:100%;background:var(--border-strong);transform-origin:left;transition:background var(--dur-hover) var(--ease),transform var(--dur-hover-slow) var(--ease)}
.stage__num{transition:color var(--dur-hover) var(--ease)}
.stage__name{font-family:var(--font-display);font-weight:900;font-size:clamp(26px,3.2vw,44px);line-height:1;letter-spacing:-.03em;color:var(--text-strong);margin-top:12px;transition:color var(--dur-hover) var(--ease),transform var(--dur-hover-slow) var(--ease)}
.stage__line{margin-top:12px;color:var(--text-muted);transition:color var(--dur-hover) var(--ease),opacity var(--dur-hover) var(--ease)}
.stage.is-pending .stage__name,.stage.is-pending .stage__line{opacity:.35}
.stage.is-active{transform:translateY(-6px)}
.stage.is-active .stage__rule{background:var(--accent)}
.stage.is-active .stage__num{color:var(--accent)}
.stage.is-active .stage__name{color:var(--accent)}
.stage.is-active .stage__line{color:var(--text-strong);opacity:1}
.roles:hover .stage:not(.is-active) .stage__name{color:var(--text-muted)}
.level{position:relative;background:var(--surface-panel-dark);border:1px solid var(--border-on-dark);padding:40px 36px 44px;display:flex;flex-direction:column;gap:0;outline:0;transition:transform var(--dur-hover-slow) var(--ease),border-color var(--dur-hover) var(--ease),background var(--dur-hover) var(--ease)}
.level::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-hover-slow) var(--ease)}
.level.is-active{border-color:var(--accent);transform:scale(1.02);background:var(--charcoal-900,#171615)}
.level.is-active::before{transform:scaleX(1)}
.level__top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:36px}
.level__num{font:900 56px/1 var(--font-display);letter-spacing:-.04em;color:var(--on-dark-35);transition:color var(--dur-hover) var(--ease)}
.level.is-active .level__num{color:var(--accent)}
.level span.level__type{color:var(--on-dark-50)}
.level__name{font:900 36px/1 var(--font-display);letter-spacing:-.03em;color:var(--on-dark);margin:0}
.level p.level__what{margin:14px 0 0;color:var(--on-dark-70);font-weight:500;letter-spacing:.14em}
.level.is-active p.level__what{color:var(--accent)}
.level p.level__body{margin:24px 0 0;color:var(--on-dark-70);font-size:16px}
.level p.level__price{margin:0 0 28px;padding-top:24px;border-top:1px solid var(--line-dark);display:grid;gap:4px}
.level .level__price-label{font:600 12px/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--on-dark-50)}
.level .level__price-num{font:900 clamp(30px,2.6vw,38px)/1 var(--font-display);letter-spacing:-.03em;color:var(--accent);margin-top:6px}
.level .level__price-num em{font:500 15px/1 var(--font-body);font-style:normal;letter-spacing:0;color:var(--on-dark-70);margin-left:6px}
.level p.level__price small{display:block;font-weight:400;color:var(--on-dark-50);font-size:13px;line-height:1.4;margin-top:8px}
.level__list{margin:28px 0 28px!important}
.kinds{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-dark-strong)}
.kinds li{display:grid;grid-template-columns:56px minmax(0,5fr) minmax(0,6fr);column-gap:var(--gutter);align-items:baseline;padding:28px 0;border-bottom:1px solid var(--line-dark)}
.kinds li p{margin:0;color:var(--on-dark-70);font-size:16px;max-width:none}
.audit-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink-900)}
.audit-list li{display:flex;gap:16px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line);font:500 18px/1.3 var(--font-body);color:var(--text-strong)}
.audit-list .zap-node{background:var(--accent)}
.invest{border-top:1px solid var(--ink-900);padding-top:32px}
.invest p.invest__num{margin:0;font:900 clamp(28px,2.8vw,40px)/1 var(--font-display);letter-spacing:-.04em;color:var(--text-strong)}
.level__list{list-style:none;margin:28px 0 36px;padding:0;border-top:1px solid var(--line-dark)}
.level__list li{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid var(--line-dark);font:500 15px/1.3 var(--font-body);color:var(--on-dark)}
.level__node{width:8px;height:8px;background:var(--accent);flex:none}
.level .zap-btn{margin-top:auto;align-self:flex-start}
.ladder{position:relative;margin-top:0;padding-left:72px}
.model p.model-punch,p.model-punch{margin:24px 0 0;font:600 clamp(18px,1.7vw,24px)/1.3 var(--font-body);letter-spacing:.02em;color:var(--text-body)}
.model-bridge{position:relative;margin-top:clamp(40px,5vw,64px);padding:0 0 clamp(40px,5vw,64px) 72px}
.model-bridge__rail{position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--line)}
.model-bridge__rail::before{content:"";position:absolute;left:-4px;top:0;width:10px;height:10px;background:var(--accent)}
.model-bridge .zap-lead{max-width:48ch}
.model-bridge p.model-bridge__kicker{margin:28px 0 0;color:var(--text-strong)}
.ladder__rail{position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--line)}
.ladder__fill{position:absolute;left:0;top:0;width:100%;height:100%;background:var(--accent);transform:scaleY(var(--fill,0));transform-origin:top;transition:transform .2s linear}
.step{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--gutter);align-items:start;padding:clamp(32px,4vw,56px) 0;border-top:1px solid var(--line);position:relative}
.step:last-child{border-bottom:1px solid var(--line)}
.step__num{position:absolute;left:-72px;top:clamp(38px,4.6vw,66px);display:flex;align-items:center;gap:12px;transform:translateX(-50%)}
.step__num .zap-label{position:absolute;left:28px;top:-2px;white-space:nowrap;transition:color var(--dur-hover) var(--ease)}
.step .step__node{width:10px;height:10px;background:var(--bg-light);border:1px solid var(--ink-900);box-sizing:border-box;transition:background var(--dur-hover) var(--ease),border-color var(--dur-hover) var(--ease),transform var(--dur-hover-slow) var(--ease)}
.step__main,.step__copy{opacity:0;transform:translateY(28px);transition:opacity .7s var(--ease),transform .8s var(--ease)}
.step__copy{transition-delay:.15s}
.step.is-lit .step__main,.step.is-lit .step__copy{opacity:1;transform:none}
.step__word{font-family:var(--font-display);font-weight:900;font-size:clamp(36px,5.2vw,80px);line-height:.9;letter-spacing:-.045em;margin:0;color:var(--text-strong);white-space:nowrap}
.step__dot{color:var(--accent)}
.step .step__we{margin:0;font:600 clamp(18px,1.6vw,24px)/1.3 var(--font-body);color:var(--text-strong);letter-spacing:-.01em}
.step p.step__why{margin:12px 0 0;font-size:16px;line-height:1.55;color:var(--text-muted);max-width:40ch}
.step p.step__why{font-size:15px;line-height:1.6;color:var(--text-muted);max-width:34ch}
.step.is-lit .step__node{background:var(--accent);border-color:var(--accent);transform:scale(1.4)}
.step.is-lit .step__num .zap-label{color:var(--accent)}
.callouts{margin-top:24px;display:grid;grid-template-columns:1fr;gap:24px}
.callout{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,5fr) 250px;column-gap:var(--gutter);align-items:center;padding:36px 36px;border:1px solid var(--border-on-dark);cursor:pointer;transition:border-color var(--dur-hover) var(--ease),background var(--dur-hover) var(--ease)}
.callout:hover{border-color:var(--accent);background:var(--surface-panel-dark)}
.callout p.callout__title{margin:0;font:600 12px/1 var(--font-body);letter-spacing:.14em;color:var(--on-dark-50)}
.callout p.callout__sub{margin:14px 0 0;font:900 clamp(26px,2.4vw,34px)/1.05 var(--font-display);letter-spacing:-.025em;color:var(--on-dark)}
.callout:hover p.callout__sub{color:var(--accent)}
.callout p.callout__body{margin:0;color:var(--on-dark-70);font-size:16px;max-width:none}
.callout .zap-btn{flex:none;white-space:nowrap;justify-self:end}
.built{margin-top:112px;padding-top:56px;border-top:1px solid var(--border-on-dark)}
p.zap-h2.hero-tag{font-size:calc(var(--fs-hero) * .4);line-height:1}
.levels .zap-panel{background:var(--surface-panel-dark);border-color:var(--border-on-dark-strong);padding:40px 36px}
.levels .zap-panel__marker{color:var(--accent)}
.levels .zap-panel .zap-h3,.levels .zap-panel h3{color:var(--on-dark)}
.levels .zap-panel.is-active{box-shadow:inset 0 3px 0 var(--accent)}
.fit-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink-900)}
.fit-row{position:relative;display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:16px;padding:22px 0 22px 0;border-bottom:1px solid var(--line);cursor:pointer;transition:padding-left var(--dur-hover-slow) var(--ease),background var(--dur-hover) var(--ease)}
.fit-row::before{content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:2px;background:var(--accent);transform:scaleY(0);transform-origin:top;transition:transform var(--dur-hover-slow) var(--ease)}
.fit-row__text{font:500 19px/1.3 var(--font-body);color:var(--text-muted);transition:color var(--dur-hover) var(--ease),transform var(--dur-hover-slow) var(--ease)}
.fit-row__node{width:10px;height:10px;background:transparent;border:1px solid var(--ink-900);box-sizing:border-box;transition:background var(--dur-hover) var(--ease),border-color var(--dur-hover) var(--ease),transform var(--dur-hover) var(--ease)}
.fit-row.is-focus{padding-left:20px}
.fit-row.is-focus::before{transform:scaleY(1)}
.fit-row.is-focus .fit-row__text{color:var(--text-strong)}
.fit-row.is-focus .fit-row__node{border-color:var(--accent);transform:scale(1.3)}
.fit-row.is-focus .fit-row__num{color:var(--accent)}
.fit-row.is-on .fit-row__node{background:var(--accent);border-color:var(--accent)}
.fit-row.is-on .fit-row__text{color:var(--accent)}
.fit-note{margin-top:40px;padding:28px 0 0;border-top:1px solid var(--ink-900);display:grid;gap:24px;justify-items:start}
.marquee{--n:4;--cell:calc(100% / var(--n));overflow:hidden;border-top:1px solid var(--ink-900);border-bottom:1px solid var(--line);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marquee__track{display:flex;width:max-content;animation:marquee 48s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__cell{flex:none;width:calc(var(--mw,1296px) / var(--n));aspect-ratio:1.15;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--line);transition:background var(--dur-hover) var(--ease)}
.marquee__cell:hover{background:var(--surface-panel-light)}
.marquee__cell img{max-width:68%;max-height:52%;filter:grayscale(1) brightness(.35);opacity:.7;transition:filter var(--dur-hover) var(--ease),opacity var(--dur-hover) var(--ease)}
.marquee__cell:hover img{filter:none;opacity:1}
.marquee__cell.is-tall img{max-height:68%;max-width:50%}
.marquee__cell.is-wide img{max-width:76%;max-height:34%}
.marquee__name{font:900 clamp(22px,2.2vw,34px)/1 var(--font-display);letter-spacing:-.03em;color:var(--text-subtle);transition:color var(--dur-hover) var(--ease)}
.marquee__cell:hover .marquee__name{color:var(--c)}
@keyframes marquee{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marquee__track{animation:none}}
.hero-line2 .zap-line-reveal,.hero-line2 .zap-kinetic{display:inline-block;vertical-align:bottom}
.hero-line2 .zap-line-reveal{white-space:pre}
.hero-line2 .zap-kinetic{transform:none!important}
.hero-line2 .zap-line-reveal>.zap-kinetic{opacity:0;animation:hero-kin .9s var(--ease) .45s forwards}
@keyframes hero-kin{from{opacity:0;transform:translateY(.3em)}to{opacity:1;transform:none}}
.hero-line3 .zap-line-reveal{display:block;white-space:pre}
.hero-line3{color:var(--text-muted)}
.hero-connect{margin:clamp(32px,5vh,56px) 0 clamp(32px,5vh,56px)}
.hero-connect hr{border-top-width:2px}
.hero-foot{display:flex;justify-content:space-between;gap:24px;padding-top:20px;border-top:1px solid var(--line)}
.hero-foot__cue{color:var(--text-strong)}
.hero-foot__arrow{display:inline-block;animation:cue 1.8s var(--ease) infinite}
@keyframes cue{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
.steps-ruler{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ink-900);margin-bottom:48px}
.steps-ruler span{padding:18px 0 0;font:900 clamp(28px,3vw,44px)/1 var(--font-display);letter-spacing:-.04em;color:var(--text-subtle);border-left:1px solid var(--line);padding-left:14px}
.steps-ruler span:first-child{border-left:0;padding-left:0}
.steps-ruler span:last-child{color:var(--accent)}
.nsteps{position:relative;display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));column-gap:var(--gutter);padding-top:40px}
.nsteps__rail{position:absolute;left:0;right:0;top:0;height:2px;background:var(--line)}
.nsteps__rail i{position:absolute;inset:0;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 2s var(--ease)}
.nsteps.is-in .nsteps__rail i{transform:scaleX(1)}
.nstep{position:relative;opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .8s var(--ease);transition-delay:calc(.25s + var(--i) * .4s)}
.nsteps.is-in .nstep{opacity:1;transform:none}
.nstep__node{position:absolute;left:0;top:-45px;width:12px;height:12px;background:var(--bg-light);border:2px solid var(--ink-900);box-sizing:border-box;transition:background .4s var(--ease),border-color .4s var(--ease);transition-delay:calc(.15s + var(--i) * .4s)}
.nsteps.is-in .nstep__node{background:var(--accent);border-color:var(--accent)}
.nstep__num{font:900 clamp(40px,4.4vw,64px)/1 var(--font-display);letter-spacing:-.045em;color:var(--text-subtle)}
.nstep__num{transition:color var(--dur-hover) var(--ease)}
.nstep:last-child .nstep__num{color:var(--accent)}
.nsteps:hover .nstep:last-child .nstep__num{color:var(--text-subtle)}
.nsteps .nstep:hover .nstep__num{color:var(--accent)!important}
.nstep{cursor:default}
.nstep .nstep__name{transition:color var(--dur-hover) var(--ease)}
.nstep:hover .nstep__name{color:var(--accent)}
.nstep__name{margin-top:20px;font:900 clamp(18px,1.6vw,24px)/1 var(--font-display);letter-spacing:-.02em;color:var(--text-strong)}
.nstep p.nstep__cap{margin:10px 0 0;font-size:15px;line-height:1.5;color:var(--text-muted);max-width:22ch}
p.audit-kicker{margin:0 0 20px;font:600 clamp(16px,1.5vw,22px)/1.3 var(--font-body);letter-spacing:.04em;color:var(--text-muted)}
.beliefs{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink-900)}
.beliefs li{display:grid;grid-template-columns:48px 1fr;column-gap:16px;align-items:start;padding:28px 0;border-bottom:1px solid var(--line)}
.beliefs li .zap-label{padding-top:8px}
.beliefs p.beliefs__title{margin:0;font:900 clamp(22px,2.2vw,30px)/1.1 var(--font-display);letter-spacing:-.025em;color:var(--text-strong)}
.beliefs p.beliefs__body{margin:10px 0 0;color:var(--text-muted);font-size:16px;max-width:52ch}
.zap-vt-nav .zap-container>a{margin-right:32px;flex:none}
.zap-vt-nav nav a{white-space:nowrap}
@media(max-width:1260px){.zap-vt-nav nav a:not(.zap-btn){display:none}.zap-vt-nav nav{gap:0}}
.zap-vt-nav .zap-container>a>img.zap-vt-mark{height:22px!important;width:auto!important}
.zap-vt-nav .zap-container>a>span{display:none!important}
footer img[alt="ZAP MG"]{height:26px!important;width:auto!important}

/* nav stays visible on scroll (CTA always reachable) */
.zap-vt-nav{transform:none!important}
/* review-only page switcher */
.zap-switcher{position:fixed;left:16px;bottom:16px;z-index:80;display:flex;align-items:center;gap:10px;padding:8px 10px 8px 14px;background:var(--nav-tint-light);backdrop-filter:blur(16px);border:1px solid var(--border);box-shadow:var(--shadow-float,0 8px 24px rgba(0,0,0,.08))}
.zap-switcher select{font:500 13px/1 var(--font-body);color:var(--text-strong);background:transparent;border:0;border-bottom:1px solid var(--border-strong);padding:6px 2px;outline:0;cursor:pointer}
/* mobile sticky CTA */
.zap-sticky{display:none}
/* v2 teaser panels (light) */
.tease{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.tease__panel{position:relative;border:1px solid var(--border-strong);background:transparent;transition:transform var(--dur-hover-slow) var(--ease),background var(--dur-hover-slow) var(--ease),border-color var(--dur-hover) var(--ease)}
.tease__panel::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-hover-slow) var(--ease)}
.tease__panel.is-active{border-color:var(--accent);background:#fff;transform:scale(1.02)}
.tease__panel.is-active::before{transform:scaleX(1)}
.tease__link{display:grid;gap:18px;padding:36px 36px 32px;color:inherit}
.tease__link:hover{color:inherit}
.tease span.tease__marker{color:var(--text-muted)}.tease__panel.is-active span.tease__marker{color:var(--accent)}
.tease p.tease__body{margin:-2px 0 6px;color:var(--text-muted);font-size:16px}
.tease p.tease__what{margin:0;font:900 clamp(26px,2.6vw,38px)/1.05 var(--font-display);letter-spacing:-.03em;color:var(--text-strong)}
/* chips */
p.chips{display:flex;flex-wrap:wrap;gap:14px 36px;margin:0;color:var(--on-dark)}
p.chips span{font:600 clamp(18px,1.6vw,24px)/1.3 var(--font-body);letter-spacing:-.01em;display:inline-flex;align-items:center;gap:14px}
p.chips span::before{content:"";width:8px;height:8px;background:var(--accent);flex:none}

/* leadership: two CMO panels (light) */
.cmo{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.cmo__panel{position:relative;border:1px solid var(--border-strong);background:transparent;padding:40px 36px 40px;display:flex;flex-direction:column;outline:0;transition:transform var(--dur-hover-slow) var(--ease),background var(--dur-hover-slow) var(--ease),border-color var(--dur-hover) var(--ease)}
.cmo__panel::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-hover-slow) var(--ease)}
.cmo__panel.is-active{border-color:var(--accent);background:#fff;transform:scale(1.02)}
.cmo__panel.is-active::before{transform:scaleX(1)}
.cmo__anchor{position:absolute;top:-96px}
.cmo__top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:32px}
.cmo__num{font:900 56px/1 var(--font-display);letter-spacing:-.04em;color:var(--text-subtle)}
.cmo__panel.is-active .cmo__num{color:var(--accent)}
.cmo span.cmo__type{color:var(--text-muted)}
.cmo__name{font:900 36px/1 var(--font-display);letter-spacing:-.03em;color:var(--text-strong);margin:0}
.cmo p.cmo__what{margin:14px 0 0;color:var(--text-muted);font-weight:500;letter-spacing:.14em}
.cmo__panel.is-active p.cmo__what{color:var(--accent)}
.cmo p.cmo__body{margin:24px 0 0;font-weight:600}
.cmo p.cmo__body2{margin:12px 0 0;color:var(--text-muted);font-size:16px}
.cmo__list{list-style:none;margin:28px 0;padding:24px 0 0;border-top:1px solid var(--line);display:grid;gap:12px}
.cmo__list li{display:flex;gap:14px;align-items:center;font:500 16px/1.3 var(--font-body);color:var(--text-strong)}
.cmo__list .zap-node{background:var(--text-subtle)}.cmo__panel.is-active .cmo__list .zap-node{background:var(--accent)}
.cmo__meta{display:grid;grid-template-columns:1fr auto;gap:24px;padding:24px 0;border-top:1px solid var(--line);margin-bottom:24px}
.cmo__meta p{margin:8px 0 0;font-size:15px;line-height:1.4;color:var(--text-muted)}
.cmo__meta p.cmo__price{font:900 clamp(30px,2.6vw,38px)/1 var(--font-display);letter-spacing:-.03em;color:var(--accent);margin-top:6px;white-space:nowrap}
.cmo__meta p.cmo__price em{font:500 14px/1 var(--font-body);font-style:normal;color:var(--text-muted);margin-left:4px}
.compare{margin-top:64px;border-top:1px solid var(--ink-900)}
.compare__row{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,4.5fr) minmax(0,4.5fr);column-gap:var(--gutter);padding:20px 0;border-bottom:1px solid var(--line);font:400 16px/1.45 var(--font-body);color:var(--text-body)}
.compare__row.compare__head{padding:14px 0}.compare__head .zap-label{color:var(--text-muted)}
.compare span.compare__key{color:var(--text-strong)}
.compare p.compare__note{margin:20px 0 0}
@media(prefers-reduced-motion:reduce){.live-diagram__overlay{display:none}}
.decide{margin-top:64px;padding-top:32px;border-top:1px solid var(--ink-900)}
.decide p.decide__title{margin:0 0 28px;color:var(--text-strong)}
.decide__cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.decide__col .zap-label{color:var(--accent)}
.decide__col ul{list-style:none;margin:16px 0 0;padding:0;display:grid}
.decide__col li{display:flex;gap:14px;align-items:center;padding:14px 0;border-top:1px solid var(--line);font:500 17px/1.35 var(--font-body);color:var(--text-strong)}
.decide__col li .zap-node{background:var(--text-subtle);flex:none}
.decide p.decide__note{margin:28px 0 0}
.nsteps-dark .nsteps__rail{background:var(--line-dark)}
.nsteps-dark .nstep__node{background:var(--bg-dark);border-color:var(--on-dark-50)}
.nsteps-dark .nstep__num{color:var(--on-dark-35,rgba(245,243,239,.35))}
.nsteps-dark .nstep__name{color:var(--on-dark)}
.nsteps-dark .nstep p.nstep__cap{color:var(--on-dark-70)}
.wedo{margin-top:clamp(56px,7vw,96px)}
.wedo__rule{height:1px;background:var(--line-dark-strong);margin-bottom:40px;transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease)}
.wedo.is-in .wedo__rule{transform:none}
.wedo p.wedo__line{margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--gutter);row-gap:24px}
.wedo .wedo__item{display:block;font:900 clamp(22px,2.3vw,34px)/1.05 var(--font-display);letter-spacing:-.03em;color:var(--on-dark-70);opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease),transform .8s var(--ease);transition-delay:calc(.2s + var(--i) * .18s)}
.wedo.is-in .wedo__item{opacity:1;transform:none}
.wedo .wedo__item b{display:block;color:var(--on-dark);font-weight:900}
.wedo .wedo__item:last-child b{color:var(--accent)}
/* compact problem: tighter list, pivot full-width below */
.problem--compact .zap-grid{row-gap:40px!important}
.problem--compact .problem-lines{column-count:2;column-gap:var(--gutter);border-top:0!important}
.problem--compact .problem-line{break-inside:avoid;padding:14px 0!important;gap:14px!important;border-top:1px solid var(--line-dark)}
.problem--compact .problem-text{font-size:clamp(17px,1.4vw,21px)!important}
.problem--compact .pivot{grid-column:1 / -1!important;margin-top:8px;padding-top:40px;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--gutter);align-items:end}
.problem--compact .pivot__kicker{grid-column:1}
.problem--compact .pivot__big{grid-column:1 / -1;font-size:clamp(44px,7vw,104px)}
/* leadership teasers on dark */
.zap-dark .tease__panel{border-color:var(--border-on-dark-strong)}
.zap-dark .tease__panel.is-active{background:var(--surface-panel-dark);border-color:var(--accent)}
.zap-dark .tease p.tease__what{color:var(--on-dark)}
.zap-dark .tease p.tease__body{color:var(--on-dark-70)}
.zap-dark .tease span.tease__marker{color:var(--on-dark-50)}
.zap-dark .tease .zap-btn--text{color:var(--on-dark)}
/* home problem tune */
[data-page="home"] #problem .problem-line{padding:18px 0!important}
[data-page="home"] #problem .problem-text{font-size:clamp(18px,1.6vw,24px)!important}
[data-page="home"] #problem .pivot{margin-top:40px}
[data-page="home"] #problem{padding-top:clamp(88px,11vw,160px)!important;padding-bottom:clamp(88px,11vw,160px)!important}
[data-page="home"] #model .model-bridge{margin-top:0}
/* lift living-field canvas to the lighter dark */
.zap-dark.zap-bg{background:#212020!important}
.zap-dark.zap-bg>canvas{mix-blend-mode:lighten}
/* mobile menu (hidden on desktop) */
.zap-burger{display:none}
.zap-menu{display:none}
@media(max-width:1260px){
.zap-burger{display:grid;position:fixed;top:calc(var(--nav-h) / 2 - 22px);right:12px;z-index:95;width:44px;height:44px;place-items:center;background:transparent;border:0;cursor:pointer;padding:0}
.zap-burger i{grid-area:1/1;width:22px;height:2px;background:var(--ink-900);transition:transform .4s var(--ease),background .4s var(--ease)}
.zap-burger i:first-child{transform:translateY(-4px)}.zap-burger i:last-child{transform:translateY(4px)}
.zap-burger.is-open i{background:var(--paper-100,#f5f3ef)}
.zap-burger.is-open i:first-child{transform:rotate(45deg)}.zap-burger.is-open i:last-child{transform:rotate(-45deg)}
.zap-dark-nav .zap-burger i{background:var(--paper-100,#f5f3ef)}
.zap-menu{display:flex;flex-direction:column;justify-content:space-between;position:fixed;inset:0;z-index:90;background:var(--bg-dark);padding:calc(var(--nav-h) + 24px) 24px calc(32px + env(safe-area-inset-bottom));opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .45s var(--ease),transform .45s var(--ease),visibility .45s}
.zap-menu.is-open{opacity:1;visibility:visible;transform:none}
.zap-menu__list{display:grid;gap:0;border-top:1px solid var(--line-dark-strong)}
.zap-menu__link{display:block;padding:18px 0;border-bottom:1px solid var(--line-dark);font:900 clamp(26px,7.5vw,34px)/1 var(--font-display);letter-spacing:-.03em;color:var(--on-dark);opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease),transform .6s var(--ease);transition-delay:calc(.08s + var(--i) * .05s)}
.zap-menu.is-open .zap-menu__link{opacity:1;transform:none}
.zap-menu__link[aria-current="page"]{color:var(--accent)}
.zap-menu__link:hover{color:var(--accent)}
.zap-menu__foot{display:grid;gap:14px;justify-items:start}
.zap-menu__foot .zap-small{color:var(--on-dark-70)}
.zap-menu__foot .zap-btn{justify-self:stretch;justify-content:center}
.zap-vt-nav .zap-btn{margin-right:48px}
.zap-sticky{z-index:70}
.zap-menu.is-open ~ .zap-sticky{display:none}
}
.zap-grid>*{min-width:0}
/* 4K / very large */
@media(min-width:2200px){html:root{--fs-hero:120px;--fs-display:96px;--canvas:1440px}.zap-hero-wrap{min-height:auto!important;padding:calc(var(--nav-h) + 120px) 0 120px!important}.hero-grid{padding-top:96px!important}}
@media(min-width:1280px) and (max-height:1100px){
html:root{--section-y:clamp(72px,9vw,136px);--section-y-lg:clamp(88px,12vw,184px);--section-y-sm:clamp(48px,6vw,92px);--lh-hero:.92;--lh-display:.92;--lh-heading:.92}
.zap-hero-wrap{padding:calc(var(--nav-h) + clamp(40px,6vh,80px)) 0 clamp(32px,5vh,56px)!important}
.hero-grid{padding-top:clamp(32px,5vh,64px)!important}
.hl-rich,.zap-hero,.zap-display,.zap-h1{line-height:.92}
}
@media(max-width:1100px){.marquee{--n:3}}
@media(max-width:900px){.levels{grid-template-columns:1fr!important}.callout{grid-template-columns:1fr;row-gap:20px}}
@media(max-width:900px){.step{grid-template-columns:1fr;row-gap:8px}.step__word{white-space:normal;font-size:clamp(36px,10vw,64px)}.roles>*{grid-column:span 6!important}}
@media(max-width:768px){
/* mobile pass */
.live-diagram.is-vertical{max-width:340px}
.live-diagram.is-vertical svg{width:100%;height:auto}
.live-diagram.is-vertical svg text{font-size:15px!important}
.live-diagram.is-vertical svg text+text{font-size:12px!important}
.zap-field__control{font-size:16px!important}
.zap-switcher{display:none}
.hero-line3{display:block}
[data-page="home"] #problem{padding-top:72px!important;padding-bottom:72px!important}
.problem-lines{border-top:0!important}
.pivot{margin-top:40px!important}
.decide{margin-top:40px}
.decide__col li{font-size:16px}
.audit-list li{font-size:16px;padding:14px 0}
.invest p.invest__num{font-size:clamp(36px,11vw,48px)}
.kinds li{padding:20px 0}
.beliefs li{grid-template-columns:36px 1fr}
.wedo p.wedo__line{grid-template-columns:1fr 1fr}
.marquee__cell.is-tall img{max-height:60%}
.zap-footer .zap-grid>*{grid-column:1 / -1!important}
.zap-sticky{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:70;justify-content:center;align-items:center;gap:10px;padding:16px 20px calc(16px + env(safe-area-inset-bottom));background:var(--ink-900);color:var(--paper-100,#f5f3ef);font:600 15px/1 var(--font-body);transform:translateY(100%);transition:transform .45s var(--ease)}
.zap-sticky.is-on{transform:none}.zap-sticky:hover{color:var(--paper-100,#f5f3ef);background:var(--accent)}
.zap-switcher{bottom:auto;top:calc(var(--nav-h) + 8px);left:8px;transform:scale(.9);transform-origin:top left}
.wedo p.wedo__line{grid-template-columns:1fr 1fr}.problem--compact .problem-lines{column-count:1}.problem--compact .pivot{grid-template-columns:1fr}.tease,.cmo{grid-template-columns:1fr}.tease__panel.is-active,.cmo__panel.is-active{transform:none}
.tease__link{padding:26px 22px 22px}.cmo__panel{padding:28px 22px 28px}.cmo__num{font-size:40px}.cmo__name{font-size:28px}
.cmo__meta{grid-template-columns:1fr}.decide__cols{grid-template-columns:1fr}
.compare__row{grid-template-columns:1fr;row-gap:6px;padding:16px 0}.compare__head{display:none}.compare__row>span:nth-child(2)::before{content:"Strategic · ";color:var(--text-muted)}.compare__row>span:nth-child(3)::before{content:"Operating · ";color:var(--text-muted)}
p.chips span{display:flex}
.nsteps{grid-template-columns:1fr 1fr;row-gap:40px}.nsteps__rail{display:none}.nstep__node{display:none}.nstep{border-top:2px solid var(--line);padding-top:16px}
.marquee{--n:2}
.ladder{padding-left:28px}.step__num{left:-28px}.step__num .zap-label{display:none}.model-bridge{padding-left:28px}
.zap-grid>*{grid-column:1 / -1!important}
.zap-vt-nav nav a:not(.zap-btn){display:none}
.zap-vt-nav nav{gap:0}
.zap-vt-nav .zap-container>a span{display:none}
h1.zap-hero.home-hero{font-size:clamp(46px,14vw,64px)}
.zap-hero-wrap{min-height:auto!important;padding:calc(var(--nav-h) + 40px) 0 72px!important}
.hero-grid{margin-top:48px!important;padding-top:0!important;row-gap:28px}
p.zap-h2.hero-tag{font-size:clamp(30px,9vw,40px)}
.hero-grid .zap-btn--text{display:none}
.zap-section .zap-grid{row-gap:36px!important}
.problem-line{padding:18px 0!important;gap:16px!important}
.pivot{margin-top:0;padding-top:32px}
.pivot__big{font-size:clamp(40px,12vw,52px)}
.model-bridge{margin-top:40px;padding-bottom:40px}
.step{grid-template-columns:1fr;row-gap:10px;padding:28px 0}
.step__num{top:32px}
.step__word{white-space:normal;font-size:clamp(36px,11vw,48px)}
.step .step__we{font-size:18px}
.step p.step__why{max-width:none}
.levels{gap:16px!important}
.level{padding:28px 22px 32px}
.level.is-active{transform:none}
.level__top{margin-bottom:24px}
.level__num{font-size:40px}
.level__name{font-size:28px}
.level p.level__body{font-size:15px;margin-top:18px}
.level__list{margin:22px 0 28px}
.callouts{gap:16px}
.callout{grid-template-columns:1fr;row-gap:18px;padding:26px 22px}
.kinds li{grid-template-columns:40px 1fr;row-gap:8px}.kinds li p{grid-column:2}
.callout p.callout__sub{font-size:24px}
.callout .zap-btn{justify-self:start}
.built{margin-top:72px;padding-top:40px}
.fit-row{grid-template-columns:36px 1fr auto;gap:12px;padding:18px 0}
.fit-row.is-focus{padding-left:14px}
.fit-row__text{font-size:17px}
.fit-note{margin-top:32px}
.marquee__cell{aspect-ratio:1.3}
#contact .zap-hero{font-size:clamp(48px,13vw,60px)!important}
.zap-h3{font-size:var(--fs-h3-m)}
.zap-h4{font-size:22px!important}
}
@media(max-width:480px){
h1.zap-hero.home-hero{font-size:clamp(42px,13vw,52px)}
.zap-vt-nav .zap-btn{padding:11px 14px;font-size:13px}
.pivot__big{font-size:clamp(36px,11.5vw,46px)}
.level__num{font-size:36px}
}

html,body{height:100%;margin:0}#dc-root{height:100%}