/* ==========================================================================
   Inception × Shopify — Sales Deck
   Design system ported verbatim from inceptionagents.com (apps/website/src/styles/global.css):
   tokens, GT Sectra + Geist, --ease-inception motion, terminal palette, gradient-italic
   accents, grain. Deck layout uses container-query units (cqh/cqw) so a slide scales
   identically on a 13" laptop and a 4K projector. No animation libraries — CSS + rAF only.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700&family=Geist+Mono:wght@400;500;600&display=swap');

@font-face {
  font-family: 'GT Sectra Display';
  src: url('./fonts/GT-Sectra-Display-Regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'GT Sectra Display';
  src: url('./fonts/GT-Sectra-Display-Regular-Italic.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: swap;
}

/* ---- Tokens (ported from global.css :root) ------------------------------- */
:root {
  --brand-primary:#303238; --brand-primary-light:#383D48; --brand-muted:#565256;
  --brand-warm:#81807B; --brand-silver:#BDBEC0;

  --canvas:#1C1D21; --surface-raised:#25272C; --surface-sunken:#16171A;

  --neutral-50:#F2F2F3; --neutral-100:#E6E6E8; --neutral-200:#BDBEC0; --neutral-300:#A3A4A6;
  --neutral-400:#81807B; --neutral-500:#6B6A67; --neutral-600:#565256; --neutral-700:#3F414A;
  --neutral-800:#383D48; --neutral-850:#303238; --neutral-900:#25272C; --neutral-950:#1C1D21;

  --accent:#BDBEC0; --accent-lift:#E6E6E8; --accent-press:#81807B; --accent-dim:#565256; --accent-ink:#1C1D21;
  --success:#6A9B82; --danger:#B8625C; --warn:#B5A06B;

  --term-key:#7FB0A9; --term-str:#C9A74E; --term-num:#EDEFF2; --term-meta:#6E6D68; --term-ok:#8FBFA6;

  --fg-1:#F2F2F3; --fg-2:#BDBEC0; --fg-3:#81807B; --fg-4:#565256;
  --bg-1:#1C1D21; --bg-2:#25272C; --bg-3:#303238;

  --border:#383D48; --border-strong:#565256; --border-soft:#25272C;

  --surface-veil:rgba(255,255,255,.03); --surface-veil-strong:rgba(245,247,250,.14);
  --hairline:rgba(189,190,192,.07); --hairline-strong:rgba(189,190,192,.14);
  --scrim:rgba(0,0,0,.45); --scrim-strong:rgba(0,0,0,.60);

  --font-serif:'GT Sectra Display','Tiempos Headline',Georgia,serif;
  --font-sans:'Geist','Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  --font-mono:'Geist Mono','JetBrains Mono','IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --ease-inception:cubic-bezier(0.2,0.8,0.2,1);
  --ease-out:cubic-bezier(0.2,0.6,0.3,1);
  --ease-in:cubic-bezier(0.4,0,1,1);
  --grain-opacity:.04;

  --grad-aurora:radial-gradient(circle at 18% 115%,#5BC4BC 0%,#8FB0C9 50%,#AEB6E8 95%);
  --grad-ember:radial-gradient(circle at 18% 115%,#E8975A 0%,#CE9189 50%,#AEA3B6 95%);
  --grad-meadow:radial-gradient(circle at 18% 115%,#93BBA6 0%,#84C2A1 50%,#5BC4BC 95%);
  --grad-spectrum:radial-gradient(circle at 18% 115%,#E8975A 0%,#CE9189 22%,#93BBA6 45%,#5BC4BC 70%,#AEB6E8 92%);
}

* { box-sizing:border-box; }
html, body {
  margin:0; padding:0; height:100%;
  background:var(--canvas); color:var(--fg-1);
  font-family:var(--font-sans); font-variant-numeric:tabular-nums;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility;
  overflow:hidden;
}

/* ---- Deck shell ---------------------------------------------------------- */
.deck { position:fixed; inset:0; display:grid; place-items:center; background:var(--canvas); overflow:hidden; }

/* Page-wide grain overlay (ported). */
.deck::after {
  content:""; position:fixed; inset:0; z-index:90; pointer-events:none;
  background-image:url('./assets/grain.png'); background-size:180px 180px;
  opacity:var(--grain-opacity); mix-blend-mode:overlay;
}

/* 16:9 stage; the container-query context for every cqh/cqw unit below. */
.stage {
  position:relative;
  width:min(100vw, calc(100vh * 16 / 9));
  height:min(100vh, calc(100vw * 9 / 16));
  container-type:size; container-name:stage;
  overflow:hidden; background:var(--canvas);
  box-shadow:0 24px 80px -40px var(--scrim-strong);
}

/* ---- Slides + transitions ----------------------------------------------- */
.slide {
  position:absolute; inset:0; opacity:0; visibility:hidden; transform:translateY(1.2cqh);
  transition:opacity .42s var(--ease-inception), transform .42s var(--ease-inception), visibility 0s linear .42s;
  display:flex; flex-direction:column; justify-content:center;
  padding:6cqh 6.5cqw; z-index:1;
}
.slide.is-active { opacity:1; visibility:visible; transform:none; transition-delay:0s; z-index:2; }
.slide[data-align="top"]    { justify-content:flex-start; }
.slide[data-align="center"] { justify-content:center; }

/* Scroll-reveal (ported); .in is driven by the engine on slide entry so it can replay. */
.reveal {
  opacity:0; transform:translateY(1.5cqh);
  transition:opacity .52s var(--ease-inception), transform .52s var(--ease-inception);
  transition-delay:calc(var(--idx,0) * 55ms);
}
.reveal.in { opacity:1; transform:none; }

/* ---- Typography utilities (cqh-scaled) ----------------------------------- */
.eyebrow {
  font-family:var(--font-mono); font-size:1.7cqh; letter-spacing:.16em; text-transform:uppercase;
  color:var(--fg-3); font-weight:500; display:flex; align-items:center; gap:.8em;
}
.eyebrow .num { color:var(--accent); }
.serif { font-family:var(--font-serif); font-weight:400; letter-spacing:-.02em; }
.mono  { font-family:var(--font-mono); }

.s-title {
  font-family:var(--font-serif); font-weight:400; color:var(--fg-1);
  font-size:6cqh; line-height:1.04; letter-spacing:-.025em; text-wrap:balance; margin:0;
}
.s-title.xl { font-size:8.4cqh; line-height:1.02; letter-spacing:-.03em; }
.s-title.lg { font-size:7cqh; }
.s-title.md { font-size:4.8cqh; }
.s-title.sm { font-size:3.6cqh; line-height:1.1; }
.s-sub {
  font-family:var(--font-sans); color:var(--fg-2); font-size:2.7cqh; line-height:1.5;
  letter-spacing:-.005em; max-width:62ch; margin:0; text-wrap:pretty;
}
.s-sub.dim { color:var(--fg-3); }
.s-sub.lg { font-size:3.1cqh; max-width:30ch; }
.s-kicker { color:var(--fg-3); font-size:2.2cqh; }

/* Gradient-italic accent (ported, incl. solid fallback + selection fix). */
.ia-grad-em { font-style:italic; --ia-em-grad:var(--grad-ember); color:var(--fg-1); }
@supports ((-webkit-background-clip:text) or (background-clip:text)) {
  .ia-grad-em {
    background-image:var(--ia-em-grad); -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:transparent;
  }
}
.grad-aurora{--ia-em-grad:var(--grad-aurora)} .grad-ember{--ia-em-grad:var(--grad-ember)}
.grad-meadow{--ia-em-grad:var(--grad-meadow)} .grad-spectrum{--ia-em-grad:var(--grad-spectrum)}
.ia-grad-em::selection { -webkit-text-fill-color:var(--accent-ink); }

/* Stat pairs (ported, cqh-scaled). */
.stat-num {
  font-family:var(--font-serif); font-size:11cqh; line-height:1; letter-spacing:-.03em;
  font-variant-numeric:tabular-nums; color:var(--fg-1); font-weight:400; white-space:nowrap; display:block;
}
.stat-label {
  font-family:var(--font-mono); font-size:1.55cqh; letter-spacing:.14em; text-transform:uppercase;
  color:var(--fg-3); margin-top:1.4cqh; line-height:1.35;
}

/* ---- Buttons (ported) ---------------------------------------------------- */
.btn {
  font-family:var(--font-sans); font-size:2.1cqh; font-weight:500; letter-spacing:-.005em;
  padding:1.5cqh 2cqw; border-radius:6px; border:1px solid transparent; cursor:pointer;
  transition:all 120ms var(--ease-out); display:inline-flex; align-items:center; gap:.5em; text-decoration:none;
}
.btn-primary { background:var(--accent); color:var(--accent-ink); }
.btn-primary:hover { background:var(--accent-lift); transform:translateY(-1px); }
.btn-secondary { background:transparent; color:var(--fg-1); border-color:var(--border); }
.btn-secondary:hover { border-color:var(--border-strong); }

/* ---- Hairlines + primitives --------------------------------------------- */
.hair { height:1px; width:100%; background:var(--border); border:0; margin:0; }
.chip {
  display:inline-flex; align-items:center; gap:.6em; padding:.7cqh 1.1cqw; border-radius:999px;
  border:1px solid var(--border); background:var(--surface-veil); color:var(--fg-2);
  font-family:var(--font-mono); font-size:1.55cqh; letter-spacing:.04em;
}
.chip img { height:2.1cqh; width:auto; display:block; }
.card {
  background:var(--surface-raised); border:1px solid var(--border); border-radius:14px;
  box-shadow:0 0 0 1px var(--surface-veil) inset;
}

/* Force-dark scope (ported) — keeps embedded terminal/plane surfaces dark. */
.force-dark { background:var(--surface-sunken); }

/* ==========================================================================
   Slide layouts (per kind)
   ========================================================================== */

/* Cover / close */
.cv { position:relative; height:100%; display:flex; flex-direction:column; justify-content:space-between; }
.cv-top { display:flex; align-items:center; justify-content:space-between; }
.cv-logo { height:3.4cqh; width:auto; opacity:.95; }
.cv-mid { display:flex; flex-direction:column; gap:2.4cqh; }
.cv .s-title { max-width:20ch; }
.cv-foot { display:flex; align-items:flex-end; justify-content:space-between; gap:2cqw; }
.cv-prepared { font-family:var(--font-mono); font-size:1.7cqh; letter-spacing:.1em; color:var(--fg-3); text-transform:uppercase; line-height:1.7; }
.cv-prepared b { color:var(--fg-1); font-weight:500; }
.brandchip {
  display:inline-flex; align-items:baseline; gap:.5em; padding:1cqh 1.3cqw; border:1px solid var(--border);
  border-radius:10px; background:var(--surface-veil); font-family:var(--font-serif); font-size:2.6cqh; color:var(--fg-1);
}
.brandchip span { font-family:var(--font-mono); font-size:1.4cqh; letter-spacing:.18em; color:var(--fg-3); text-transform:uppercase; }

/* Ambient visual layer behind cover/close type */
.viz-bg { position:absolute; inset:0; z-index:0; pointer-events:none; }
.viz-bg.dim { opacity:.42; }
.cv-top, .cv-mid, .cv-foot { position:relative; z-index:2; }

/* Agenda / numbered list */
.agenda { display:flex; flex-direction:column; gap:0; max-width:50ch; }
.agenda-row { display:flex; gap:2cqw; align-items:baseline; padding:3cqh 0; border-top:1px solid var(--border); }
.agenda-row:last-child { border-bottom:1px solid var(--border); }
.agenda-n { font-family:var(--font-mono); font-size:1.8cqh; color:var(--accent); letter-spacing:.1em; min-width:3.2cqw; }
.agenda-t { font-family:var(--font-serif); font-size:3.4cqh; color:var(--fg-1); letter-spacing:-.02em; line-height:1.15; }

/* Manifesto */
.manifesto { display:flex; flex-direction:column; gap:3cqh; align-items:center; text-align:center; }
.manifesto .s-title { max-width:24ch; }
.manifesto .s-sub { text-align:center; max-width:54ch; }

/* Stats grid */
.statgrid { display:grid; grid-template-columns:repeat(var(--cols,4),1fr); gap:0; }
.statcell { padding:0 2cqw; border-left:1px solid var(--border); }
.statcell:first-child { border-left:0; padding-left:0; }
.statsrc { font-family:var(--font-mono); font-size:1.5cqh; color:var(--fg-4); letter-spacing:.05em; margin-top:4cqh; }

/* Fork (two-column compare) */
.fork { display:grid; grid-template-columns:1fr 1px 1fr; gap:0; align-items:stretch; }
.fork-rule { background:var(--border); }
.fork-col { padding:0 3cqw; display:flex; flex-direction:column; gap:2.2cqh; }
.fork-col:first-child { padding-left:0; } .fork-col:last-child { padding-right:0; }
.fork-head { font-family:var(--font-mono); font-size:1.7cqh; letter-spacing:.14em; text-transform:uppercase; }
.fork-col.win  .fork-head { color:var(--term-ok); }
.fork-col.lose .fork-head { color:var(--fg-4); }
.fork-li { display:flex; gap:1cqw; align-items:baseline; font-size:2.5cqh; line-height:1.4; }
.fork-col.win  .fork-li { color:var(--fg-1); }
.fork-col.lose .fork-li { color:var(--fg-3); }
.fork-li .g { font-family:var(--font-mono); font-size:2cqh; }
.fork-col.win  .g { color:var(--term-ok); } .fork-col.lose .g { color:var(--fg-4); }

/* Diagram (loop / layer) */
.flow { display:grid; grid-template-columns:repeat(3,1fr); gap:2.4cqw; align-items:stretch; }
.flow-node { position:relative; padding:3cqh 2cqw; border:1px solid var(--border); border-radius:14px; background:var(--surface-raised); display:flex; flex-direction:column; gap:1.2cqh; }
.flow-node .n { font-family:var(--font-mono); font-size:1.5cqh; letter-spacing:.14em; color:var(--accent); text-transform:uppercase; }
.flow-node h4 { font-family:var(--font-serif); font-weight:400; font-size:3.2cqh; letter-spacing:-.02em; color:var(--fg-1); margin:0; }
.flow-node p { font-size:2.1cqh; color:var(--fg-3); line-height:1.4; margin:0; }
.flow-node .arrow { position:absolute; right:-1.7cqw; top:50%; transform:translateY(-50%); color:var(--term-ok); font-family:var(--font-mono); font-size:2.4cqh; z-index:3; }
.flow-node:last-child .arrow { display:none; }
.baseline-strip { margin-top:2.6cqh; padding:1.8cqh 2cqw; border:1px dashed var(--border-strong); border-radius:10px; color:var(--fg-3); font-family:var(--font-mono); font-size:1.8cqh; letter-spacing:.03em; display:flex; align-items:center; gap:1cqw; }
.baseline-strip b { color:var(--term-ok); font-weight:500; }

/* Split (copy + visual) */
.split { display:grid; grid-template-columns:0.86fr 1.14fr; gap:4cqw; align-items:center; height:100%; }
.split.rev { grid-template-columns:1.14fr 0.86fr; }
.split-copy { display:flex; flex-direction:column; gap:2.4cqh; }
.points { display:flex; flex-direction:column; gap:1.8cqh; margin:0; padding:0; list-style:none; }
.points li { display:flex; gap:1.2cqw; align-items:baseline; font-size:2.4cqh; line-height:1.4; color:var(--fg-2); }
.points li .b { color:var(--term-ok); font-family:var(--font-mono); font-size:1.9cqh; }
.points li b { color:var(--fg-1); font-weight:600; }
.split-visual { position:relative; height:100%; display:flex; align-items:center; justify-content:center; min-height:0; }
.caption { font-family:var(--font-mono); font-size:1.6cqh; color:var(--fg-3); letter-spacing:.03em; margin-top:1.6cqh; text-align:center; }
.chiprow { display:flex; gap:1cqw; flex-wrap:wrap; margin-top:1cqh; }

/* Terminal diff (diagnostic) */
.tdiff { display:grid; grid-template-columns:1fr 1fr; gap:2.6cqw; align-items:stretch; height:100%; }
.store-card { border:1px solid var(--border); border-radius:14px; overflow:hidden; display:flex; flex-direction:column; background:var(--surface-raised); }
.store-card .bar { display:flex; align-items:center; gap:.6em; padding:1.4cqh 1.4cqw; border-bottom:1px solid var(--border); }
.store-card .bar i { width:1.1cqh; height:1.1cqh; border-radius:50%; background:var(--border-strong); display:inline-block; }
.store-card .bar .u { font-family:var(--font-mono); font-size:1.5cqh; color:var(--fg-3); margin-left:.6em; }
.store-card .body { padding:1.8cqh 1.6cqw; display:flex; flex-direction:column; gap:1cqh; flex:1; justify-content:center; }
.store-card .prod-img { aspect-ratio:16/6.5; border-radius:8px; border:1px solid var(--border); background:linear-gradient(135deg,#26282d,#1b1c20); display:flex; align-items:center; justify-content:center; color:var(--fg-4); font-family:var(--font-mono); font-size:1.5cqh; }
.store-card .prod-name { font-family:var(--font-serif); font-size:2.8cqh; color:var(--fg-1); letter-spacing:-.02em; }
.store-card .prod-price { font-family:var(--font-mono); font-size:1.9cqh; color:var(--fg-2); }

.code-root { background:#070709; border:1px solid var(--border); border-radius:14px; overflow:hidden; font-family:var(--font-mono); display:flex; flex-direction:column; }
.code-head { display:flex; align-items:center; gap:.6em; padding:1.3cqh 1.4cqw; border-bottom:1px solid var(--border); color:var(--fg-3); font-size:1.5cqh; letter-spacing:.04em; }
.code-head .dot { width:1cqh; height:1cqh; border-radius:50%; }
.code-body { padding:1.8cqh 1.6cqw; overflow:auto; color:#E4E4E7; font-size:1.7cqh; line-height:1.62; flex:1; }
.code-body .ln { white-space:pre-wrap; }
.tk-key{color:#8A909B} .tk-str{color:#C9A74E} .tk-num{color:#F5F7FA} .tk-cm{color:#52525B;font-style:italic}
.tk-pu{color:#71717A} .tk-ok{color:var(--term-ok)} .tk-warn{color:var(--warn)} .tk-bad{color:var(--danger)}
.find { display:flex; gap:.8cqw; align-items:baseline; }
.find .st { font-weight:600; }
.find .st.ok{color:var(--term-ok)} .find .st.thin{color:var(--warn)} .find .st.bad{color:var(--danger)}
.find .f { color:var(--fg-2); } .find .nt { color:var(--fg-4); }
.disclaimer { margin-top:1.4cqh; font-family:var(--font-mono); font-size:1.5cqh; color:var(--warn); letter-spacing:.03em; }

/* Plane reveal */
.plane-stage { position:relative; width:100%; height:78cqh; max-height:78cqh; perspective:1600px; display:flex; align-items:center; justify-content:center; }
.plane-wrap { position:relative; width:min(86%,40cqw); transform-style:preserve-3d; transform:rotateY(-13deg) rotateX(4deg); }
.plane { border-radius:14px; border:1px solid var(--border); overflow:hidden; }
.plane.front { position:relative; z-index:2; background:var(--surface-raised); box-shadow:0 18px 50px -22px var(--scrim-strong), 0 0 0 1px var(--surface-veil) inset; }
.plane.back  { position:absolute; inset:0; z-index:1; background:var(--surface-sunken);
  transform:translate3d(0,0,-120px); opacity:.5;
  box-shadow:0 0 0 1px rgba(189,190,192,.08), 0 22px 64px -24px rgba(189,190,192,.22);
  transition:transform 1.3s var(--ease-inception), opacity 1.3s var(--ease-inception); }
.plane-stage.go .plane.back { transform:translate3d(0,0,52px); opacity:1; }
.plane .ph { padding:1.4cqh 1.4cqw; border-bottom:1px solid var(--border); font-family:var(--font-mono); font-size:1.45cqh; letter-spacing:.1em; text-transform:uppercase; color:var(--fg-3); display:flex; align-items:center; gap:.6em; }
.plane.front .pimg { aspect-ratio:16/8; background:linear-gradient(135deg,#2a2c31,#1a1b1f); display:flex; align-items:center; justify-content:center; color:var(--fg-4); font-family:var(--font-mono); font-size:1.5cqh; }
.plane .pbody { padding:1.6cqh 1.4cqw; display:flex; flex-direction:column; gap:.9cqh; }
.plane.front .pname { font-family:var(--font-serif); font-size:2.5cqh; color:var(--fg-1); }
.plane.front .pcode { font-family:var(--font-mono); font-size:1.7cqh; color:var(--fg-3); }
.plane.front .pmiss { font-family:var(--font-mono); font-size:1.5cqh; color:var(--danger); }
.prow { font-family:var(--font-mono); font-size:1.6cqh; line-height:1.5; opacity:0; transform:translateY(6px);
  transition:opacity .36s var(--ease-inception), transform .36s var(--ease-inception); transition-delay:calc(420ms + var(--row-i,0)*65ms); }
.plane-stage.go .prow { opacity:1; transform:none; }
.prow .k { color:var(--term-key); } .prow .v { color:var(--term-num); } .prow .ok { color:var(--term-ok); }
.intel-band { margin-top:.6cqh; padding-top:1cqh; border-top:1px dashed var(--border-strong); }
.intel-band .lab { color:var(--term-ok); font-size:1.4cqh; letter-spacing:.12em; text-transform:uppercase; }

/* Proof strip */
.proof { display:flex; flex-direction:column; gap:4cqh; }
.proof-group .lab { font-family:var(--font-mono); font-size:1.5cqh; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-4); margin-bottom:1.8cqh; }
.logos { display:flex; flex-wrap:wrap; gap:1.4cqh 1.4cqw; align-items:center; }
.logo-pill { display:inline-flex; align-items:center; gap:.6em; padding:1.2cqh 1.4cqw; border:1px solid var(--border); border-radius:10px; background:var(--surface-veil); color:var(--fg-2); font-size:1.9cqh; }
.logo-pill img { height:2.6cqh; width:auto; }
.logo-pill.hot { border-color:var(--accent); color:var(--fg-1); box-shadow:0 0 0 1px var(--accent) inset; }
.proof-foot { font-family:var(--font-mono); font-size:1.9cqh; color:var(--fg-3); letter-spacing:.04em; }

/* Code / install (tabs) */
.devblock { display:grid; grid-template-columns:0.8fr 1.2fr; gap:4cqw; align-items:center; height:100%; }
.code-tabs { display:flex; gap:0; border-bottom:1px solid var(--border); padding:0 1cqw; }
.code-tab { font-family:var(--font-mono); font-size:1.6cqh; color:var(--fg-3); padding:1.4cqh 1.2cqw; border:0; border-bottom:1px solid transparent; margin-bottom:-1px; background:transparent; cursor:pointer; }
.code-tab.active { color:var(--fg-1); border-bottom-color:var(--accent); }

/* Gauge */
.gauge-wrap { display:grid; grid-template-columns:0.9fr 1.1fr; gap:4cqw; align-items:center; }
.gauge { position:relative; width:34cqh; height:34cqh; }
.gauge svg { width:100%; height:100%; transform:rotate(-90deg); }
.gauge .val { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.gauge .val .n { font-family:var(--font-serif); font-size:9cqh; line-height:1; color:var(--fg-1); }
.gauge .val .l { font-family:var(--font-mono); font-size:1.5cqh; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-3); margin-top:.6cqh; }
.checklist { display:flex; flex-direction:column; gap:1.8cqh; }
.checklist .ci { display:flex; gap:1cqw; align-items:baseline; font-size:2.3cqh; color:var(--fg-2); }
.checklist .ci .b { color:var(--term-ok); font-family:var(--font-mono); }

/* Step flow */
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
.step { position:relative; padding:0 1.8cqw; border-left:1px solid var(--border); display:flex; flex-direction:column; gap:1.2cqh; }
.step:first-child { border-left:0; padding-left:0; }
.step .when { font-family:var(--font-mono); font-size:1.5cqh; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }
.step .what { font-family:var(--font-serif); font-size:2.9cqh; color:var(--fg-1); letter-spacing:-.02em; line-height:1.15; }
.step .d { font-size:2cqh; color:var(--fg-3); line-height:1.4; }

/* Pricing */
.tiers { display:grid; grid-template-columns:repeat(4,1fr); gap:1.4cqw; align-items:stretch; }
.tier { padding:2.6cqh 1.6cqw; border:1px solid var(--border); border-radius:14px; background:var(--surface-raised); display:flex; flex-direction:column; gap:1.4cqh; }
.tier.rec { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset, 0 18px 50px -30px var(--scrim-strong); transform:translateY(-1.2cqh); }
.tier .recflag { font-family:var(--font-mono); font-size:1.3cqh; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); }
.tier .tname { font-family:var(--font-serif); font-size:3cqh; color:var(--fg-1); }
.tier .tprice { font-family:var(--font-mono); font-size:2cqh; color:var(--fg-2); }
.tier .tblurb { font-size:1.85cqh; color:var(--fg-3); line-height:1.4; }
.tier ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.9cqh; }
.tier li { font-size:1.8cqh; color:var(--fg-2); display:flex; gap:.6em; align-items:baseline; }
.tier li .b { color:var(--term-ok); font-family:var(--font-mono); font-size:1.5cqh; }
.addon { margin-top:2.4cqh; padding:1.8cqh 2cqw; border:1px dashed var(--border-strong); border-radius:10px; color:var(--fg-2); font-size:2cqh; }
.addon b { color:var(--fg-1); } .addon .rev { color:var(--term-ok); font-family:var(--font-mono); font-size:1.7cqh; }

/* CTA */
.ctas { display:grid; grid-template-columns:1fr 1fr; gap:2cqw; }
.cta-card { padding:3cqh 2cqw; border:1px solid var(--border); border-radius:14px; background:var(--surface-raised); display:flex; flex-direction:column; gap:1.4cqh; }
.cta-card.primary { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset; }
.cta-card .ck { font-family:var(--font-mono); font-size:1.5cqh; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }
.cta-card h4 { font-family:var(--font-serif); font-weight:400; font-size:3.2cqh; color:var(--fg-1); margin:0; letter-spacing:-.02em; }
.cta-card p { font-size:2cqh; color:var(--fg-3); margin:0; line-height:1.4; }
.contactline { margin-top:3cqh; font-family:var(--font-mono); font-size:1.9cqh; color:var(--fg-3); letter-spacing:.03em; }
.contactline b { color:var(--fg-1); font-weight:500; }

/* ==========================================================================
   Deck chrome (progress, counter, nav, grid, notes, help)
   ========================================================================== */
.deck-progress { position:fixed; top:0; left:0; height:2px; background:var(--accent); width:calc(var(--p,0)*100%); z-index:120; transition:width .42s var(--ease-inception); }
.deck-counter { position:fixed; left:18px; bottom:14px; z-index:120; font-family:var(--font-mono); font-size:12px; letter-spacing:.12em; color:var(--fg-3); }
.deck-counter b { color:var(--fg-1); }
.deck-hint { position:fixed; right:62px; bottom:14px; z-index:120; font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; color:var(--fg-4); display:flex; gap:1em; }
.deck-hint .k { color:var(--fg-3); }
.deck-hint b { color:var(--fg-2); font-weight:500; }

.deck-arrow { position:fixed; top:50%; transform:translateY(-50%); z-index:120; width:44px; height:44px; border-radius:50%;
  border:1px solid var(--border); background:rgba(20,21,24,.55); backdrop-filter:blur(8px); color:var(--fg-2);
  display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:0; transition:opacity .2s var(--ease-out), color .12s; font-size:18px; }
.deck:hover .deck-arrow { opacity:.6; } .deck-arrow:hover { opacity:1; color:var(--fg-1); }
.deck-arrow.prev { left:16px; } .deck-arrow.next { right:16px; }

/* Overview grid */
.deck-grid { position:fixed; inset:0; z-index:200; background:rgba(16,17,20,.92); backdrop-filter:blur(14px);
  display:none; padding:48px; overflow:auto; }
.deck-grid.open { display:block; }
.deck-grid h3 { font-family:var(--font-mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--fg-3); margin:0 0 24px; }
.grid-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:14px; }
.grid-card { text-align:left; padding:16px; border:1px solid var(--border); border-radius:12px; background:var(--surface-raised); cursor:pointer; transition:border-color .12s, transform .12s var(--ease-out); color:var(--fg-2); }
.grid-card:hover { border-color:var(--border-strong); transform:translateY(-2px); }
.grid-card.cur { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset; }
.grid-card .gn { font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; color:var(--accent); }
.grid-card .gt { font-family:var(--font-serif); font-size:17px; color:var(--fg-1); margin-top:8px; line-height:1.2; letter-spacing:-.01em; }
.grid-card .gk { font-family:var(--font-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--fg-4); margin-top:10px; }
.grid-card.appendix .gn { color:var(--fg-4); }

/* Presenter notes */
.deck-notes { position:fixed; left:0; right:0; bottom:0; z-index:150; background:rgba(12,13,15,.96); border-top:1px solid var(--border);
  padding:18px 22px 22px; display:none; max-height:34vh; overflow:auto; }
.deck-notes.open { display:block; }
.deck-notes .nt-h { font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-4); margin-bottom:8px; display:flex; justify-content:space-between; }
.deck-notes .nt-body { font-size:15px; color:var(--fg-1); line-height:1.55; max-width:80ch; }
.deck-notes .nt-next { margin-top:10px; font-size:13px; color:var(--fg-3); }
.deck-notes .nt-next b { color:var(--fg-2); }

/* ==========================================================================
   Reduced motion (ported safety net)
   ========================================================================== */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .reveal { opacity:1; transform:none; }
  .prow { opacity:1; transform:none; }
  .plane.back { transform:translate3d(0,0,52px); opacity:1; }
}

/* ==========================================================================
   Responsive — mobile/portrait reading mode (stack slides, drop 16:9)
   ========================================================================== */
@media (max-width:720px), (max-aspect-ratio:1/1) {
  html, body { overflow:auto; height:auto; }
  .deck { position:static; display:block; min-height:100vh; }
  .stage { width:100%; height:auto; container-type:inline-size; box-shadow:none; }
  .slide { position:static; opacity:1; visibility:visible; transform:none; min-height:96vw;
    padding:64px 22px; border-bottom:1px solid var(--border); }
  /* In inline-size container, switch cqh→cqw-ish by re-stating key sizes */
  .s-title { font-size:34px; } .s-title.xl { font-size:40px; } .s-title.lg { font-size:36px; }
  .s-title.md { font-size:26px; } .s-sub { font-size:17px; } .stat-num { font-size:48px; }
  .split, .split.rev, .tdiff, .devblock, .gauge-wrap, .fork { grid-template-columns:1fr; gap:28px; }
  .fork-rule { display:none; }
  .statgrid { grid-template-columns:1fr 1fr; gap:24px 0; } .statcell { padding:0 16px; }
  .flow, .steps, .tiers, .ctas { grid-template-columns:1fr; gap:14px; }
  .flow-node .arrow { display:none; }
  .plane-stage { height:auto; min-height:340px; }
  .deck-arrow, .deck-hint { display:none; }
  .deck-counter { position:fixed; }
  .eyebrow { font-size:12px; } .stat-label { font-size:11px; }
}

/* ==========================================================================
   Print / PDF — one slide per page, dark preserved, animations flattened
   ========================================================================== */
@media print {
  @page { size:1280px 720px; margin:0; }
  html, body, .deck { overflow:visible; background:var(--canvas); -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .deck { position:static; display:block; }
  .deck::after { display:none; }
  .stage { width:1280px; height:auto; box-shadow:none; container-type:inline-size; }
  .slide { position:static; opacity:1 !important; visibility:visible !important; transform:none !important;
    width:1280px; height:720px; page-break-after:always; break-after:page; }
  .reveal, .prow { opacity:1 !important; transform:none !important; }
  .plane.back { transform:translate3d(0,0,52px) !important; opacity:1 !important; }
  .deck-progress, .deck-counter, .deck-hint, .deck-arrow, .deck-grid, .deck-notes { display:none !important; }
}

/* ==========================================================================
   Additional layout (split visual wrap, trace, qa, matrix)
   ========================================================================== */
.split-vwrap { display:flex; flex-direction:column; justify-content:center; height:100%; min-height:0; gap:1.4cqh; }
.split-visual { flex:1; min-height:0; width:100%; }
.plane-stage { height:100%; }

.trace-flow { display:flex; align-items:center; gap:1.3cqw; flex-wrap:wrap; }
.trace-step { display:flex; flex-direction:column; gap:.5cqh; padding:1.6cqh 1.5cqw; border:1px solid var(--border); border-radius:10px; background:var(--surface-raised); }
.trace-step .tn { font-family:var(--font-mono); font-size:1.35cqh; letter-spacing:.12em; color:var(--accent); }
.trace-step .tt { font-family:var(--font-serif); font-size:2.4cqh; color:var(--fg-1); letter-spacing:-.02em; }
.trace-arrow { color:var(--term-ok); font-family:var(--font-mono); font-size:2.6cqh; }
.trace-foot { display:flex; gap:4cqw; align-items:flex-end; flex-wrap:wrap; margin-top:3.4cqh; }

.qa { display:grid; grid-template-columns:1fr 1fr; gap:3cqh 3.4cqw; }
.qa-item { display:flex; flex-direction:column; gap:1cqh; }
.qa .q { font-family:var(--font-serif); font-size:2.7cqh; color:var(--fg-1); letter-spacing:-.015em; line-height:1.2; }
.qa .a { font-size:2.05cqh; color:var(--fg-3); line-height:1.45; }

.matrix { display:flex; flex-direction:column; gap:.7cqh; }
.mx-row { display:grid; grid-template-columns:1.6fr repeat(6,1fr); gap:.5cqw; align-items:center; }
.mx-head .mx-c, .mx-head .mx-rl { font-family:var(--font-mono); font-size:1.45cqh; letter-spacing:.05em; color:var(--fg-3); padding-bottom:1cqh; border-bottom:1px solid var(--border); }
.mx-rl { font-family:var(--font-mono); font-size:1.9cqh; color:var(--fg-2); }
.mx-c { text-align:center; font-size:2.3cqh; }
.mx-c.on { color:var(--term-ok); } .mx-c.off { color:var(--fg-4); }

@media (max-width:720px), (max-aspect-ratio:1/1) {
  .qa { grid-template-columns:1fr; } .split-vwrap { height:auto; } .plane-stage { height:auto; }
  .mx-row { grid-template-columns:1.4fr repeat(6,1fr); } .mx-c { font-size:13px; } .mx-rl { font-size:12px; }
  .trace-step .tt { font-size:15px; }
}

/* ==========================================================================
   Audit scorecard · value map · per-prospect value line · agent quote
   ========================================================================== */
.tierbars { display:flex; flex-direction:column; gap:2.2cqh; justify-content:center; }
.tierbar .tb-top { display:flex; justify-content:space-between; align-items:baseline; font-family:var(--font-mono); font-size:1.7cqh; color:var(--fg-2); margin-bottom:.9cqh; }
.tierbar .tb-n { color:var(--fg-1); }
.tierbar .tb-track { height:1.1cqh; border-radius:999px; background:var(--bg-3); overflow:hidden; }
.tierbar .tb-fill { height:100%; border-radius:999px; transition:width .8s var(--ease-inception); }
.reportlink { font-family:var(--font-mono); font-size:1.7cqh; color:var(--accent); letter-spacing:.04em; text-decoration:none; align-self:flex-start; border-bottom:1px solid var(--accent); padding-bottom:1px; }
.reportlink:hover { color:var(--accent-lift); }

.agent-quote { font-family:var(--font-serif); font-size:2.3cqh; line-height:1.4; color:var(--fg-1); letter-spacing:-.01em; }
.store-card .reportlink { margin-top:1.6cqh; }

.vmap { display:flex; flex-direction:column; gap:1.6cqh; }
.vmap-row { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; gap:1.2cqw; align-items:stretch; }
.vmap-cell { padding:1.7cqh 1.4cqw; border:1px solid var(--border); border-radius:12px; background:var(--surface-raised); font-size:2cqh; line-height:1.32; color:var(--fg-2); display:flex; flex-direction:column; gap:.7cqh; }
.vmap-cell.gap { border-color:var(--border-strong); }
.vmap-cell.out { color:var(--fg-1); border-color:var(--term-ok); }
.vmap-k { font-family:var(--font-mono); font-size:1.3cqh; letter-spacing:.12em; text-transform:uppercase; color:var(--fg-4); }
.vmap-cell.out .vmap-k { color:var(--term-ok); }
.vmap-arrow { display:flex; align-items:center; color:var(--term-ok); font-family:var(--font-mono); font-size:2.4cqh; }

.foryou { margin-top:2cqh; padding:1.4cqh 1.6cqw; border-left:2px solid var(--accent); background:var(--surface-veil); border-radius:0 8px 8px 0; font-size:2cqh; color:var(--fg-2); line-height:1.4; }
.foryou .fy-k { display:block; font-family:var(--font-mono); font-size:1.3cqh; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin-bottom:.4cqh; }
.foryou b { color:var(--fg-1); }

@media (max-width:720px), (max-aspect-ratio:1/1) {
  .vmap-row { grid-template-columns:1fr; gap:8px; } .vmap-arrow { transform:rotate(90deg); justify-content:center; }
  .gauge-wrap { grid-template-columns:1fr; } .tierbars { gap:16px; }
}

/* ==========================================================================
   Light theme (ported from global.css) + chrome overrides + theme toggle
   ========================================================================== */
[data-theme="light"] {
  --canvas:#F5F5F3; --surface-raised:#FFFFFF; --surface-sunken:#EDEDEB;
  --fg-1:#303238; --fg-2:#383D48; --fg-3:#565256; --fg-4:#81807B;
  --bg-1:#F5F5F3; --bg-2:#FFFFFF; --bg-3:#EDEDEB;
  --border:#D8D8D6; --border-strong:#81807B; --border-soft:#EDEDEB;
  --accent:#303238; --accent-lift:#383D48; --accent-press:#565256; --accent-dim:#81807B; --accent-ink:#F5F5F3;
  --grain-opacity:0.02;
  --surface-veil:rgba(16,17,20,.025); --surface-veil-strong:rgba(16,17,20,.05);
  --hairline:rgba(16,17,20,.10); --hairline-strong:rgba(16,17,20,.16);
  --scrim:rgba(16,17,20,.10); --scrim-strong:rgba(16,17,20,.16);
  --term-key:#2E6B65; --term-str:#8A6A1F; --term-num:#25272C; --term-meta:#81807B; --term-ok:#3C7A5A;
  --grad-aurora:radial-gradient(circle at 18% 115%,#178079 0%,#3D5C7A 50%,#4B45C4 95%);
  --grad-ember:radial-gradient(circle at 18% 115%,#E8701F 0%,#B0655F 50%,#5C4A66 95%);
  --grad-meadow:radial-gradient(circle at 18% 115%,#5E8C76 0%,#3F8A5A 50%,#178079 95%);
  --grad-spectrum:radial-gradient(circle at 18% 115%,#A85A1E 0%,#B0655F 22%,#5E8C76 45%,#178079 70%,#4B45C4 92%);
}
[data-theme="light"] .deck::after { mix-blend-mode:multiply; }
[data-theme="light"] .stage     { box-shadow:0 24px 80px -40px rgba(16,17,20,.18); }
[data-theme="light"] .deck-grid  { background:rgba(245,245,243,.94); }
[data-theme="light"] .deck-notes { background:rgba(255,255,255,.97); }
[data-theme="light"] .deck-arrow { background:rgba(245,245,243,.6); }
[data-theme="light"] .code-root  { background:#0A0A0B; }  /* terminal/plane stay dark on light — intentional artifact */
[data-theme="light"] .logo-pill.mono img { filter:invert(1); }  /* mono-white agent/platform marks → black on cream */

.deck-theme {
  position:fixed; bottom:12px; right:16px; z-index:130; width:34px; height:34px; border-radius:999px;
  border:1px solid var(--border); background:var(--surface-veil); color:var(--fg-2);
  display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:15px; line-height:1;
  transition:color .12s var(--ease-out), border-color .12s var(--ease-out);
}
.deck-theme:hover { color:var(--fg-1); border-color:var(--border-strong); }
@media print { .deck-theme { display:none !important; } }