/* CASCADIAN — Editorial / atmospheric system
   No yellow accents. Half-image splits. Mountain imagery. */
:root {
  --c-paper: #FFFFFF;
  --c-paper-2: #F5F2EC;
  --c-paper-3: #E8E3D6;
  --c-line: #E0DBCD;
  --c-line-2: #BCB6A6;
  --c-ink: #0A0C0E;
  --c-ink-2: #1A1E22;
  --c-mute: #5C5A52;
  --c-dim: #807D72;
  --c-faint: #ADA99C;
  --c-forest: #2E3A2A;
  --c-sand: #C2AC85;
  --c-stone: #6B6356;
  --c-good: #4F7D5D;
  --c-bad: #A14B3A;
  --c-rust: #A85637;
  --f-display: "Funnel Display", "Inter Tight", system-ui, sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { background: #000; color: var(--c-ink); font-family: var(--f-display); -webkit-font-smoothing: antialiased; }

deck-stage > section, .slide {
  width: 1920px; height: 1080px;
  background: var(--c-paper); color: var(--c-ink);
  position: relative; overflow: hidden;
  font-family: var(--f-display);
}
.dark { background: var(--c-ink); color: #E8E3D6; }

/* Top chrome — pitch-deck style: persistent lockup at top-left, page number bottom-right */
.chrome-top {
  position: absolute; top: 48px; left: 80px; right: 80px;
  display: flex; justify-content: flex-end; align-items: center;
  z-index: 30;
}
.chrome-bot {
  position: absolute; bottom: 48px; left: 80px; right: 80px;
  display: flex; justify-content: flex-end; align-items: center;
  font-family: var(--f-mono); font-size: 16px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--c-mute); z-index: 30;
}
.lockup img { height: 34px; display: block; }
/* faded Cascadian logo on pages 2-8 (full strength only on the intro) */
.chrome-top .lockup img { opacity: 1; }
.s1 .chrome-top .lockup img { opacity: 1; }
/* hide the dev-only "Copy photo position" reframe button for now */
#copy-framing-btn { display: none !important; }
/* white logo on photo / dark slides */
.chrome-top.on-photo .lockup img,
.chrome-bot.on-photo .lockup img,
.dark .lockup img {
  filter: invert(1) brightness(1.1);
}
/* intro slide only: drop shadow so the white lockup separates from the bright hero sky */
.s1 .chrome-top.on-photo .lockup img {
  filter: invert(1) brightness(1.1)
          drop-shadow(0 4px 40px rgba(0,0,0,0.45))
          drop-shadow(0 16px 75px rgba(0,0,0,0.34));
}
/* hide all the secondary chrome content the user does not want — keep only logo + page number */
.chrome-top .right, .chrome-bot > span:not(.right) { display: none; }
/* page-number block (bottom-right) */
.chrome-bot .right { display: flex; gap: 14px; align-items: baseline; white-space: nowrap; }
.chrome-bot .right > span { white-space: nowrap; }
.chrome-bot .right > span:nth-last-child(2) { font-size: 28px; font-weight: 500; letter-spacing: -0.01em; color: var(--c-ink); font-family: var(--f-display); }
.chrome-bot .right > span:last-child { color: var(--c-mute); font-size: 16px; }
/* current slide name, sits left of the page numbers */
.chrome-bot .right .slide-name { font-family: var(--f-mono); font-size: 16px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--c-mute); align-self: center; padding-right: 16px; margin-right: 2px; border-right: 1px solid var(--c-line); }
.chrome-bot.on-photo .right .slide-name,
.dark .chrome-bot .right .slide-name { color: rgba(232,227,214,0.7); border-right-color: rgba(232,227,214,0.3); }
/* on dark/photo bottoms, page number flips cream */
.chrome-bot.on-photo .right > span:nth-last-child(2),
.dark .chrome-bot .right > span:nth-last-child(2) { color: #F2EEE3; }
.chrome-bot.on-photo .right > span:last-child,
.dark .chrome-bot .right > span:last-child { color: rgba(232,227,214,0.6); }

.eyebrow { font-family: var(--f-mono); font-size: 14px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--c-mute); }
.eyebrow .num { color: var(--c-ink); margin-right: 16px; font-weight: 500; }
.dark .eyebrow { color: rgba(232,227,214,0.6); }
.dark .eyebrow .num { color: #F2EEE3; }

h1.display, h2.display {
  font-family: var(--f-display); font-weight: 300;
  letter-spacing: -0.035em; line-height: 0.95;
  color: var(--c-ink);
}
.dark h1.display, .dark h2.display { color: #F2EEE3; }
h1.display { font-size: 168px; }
h2.display { font-size: 92px; }
.lede { font-family: var(--f-display); font-weight: 300; font-size: 32px; line-height: 1.3; color: var(--c-ink-2); max-width: 880px; }
.dark .lede { color: #C8C3B5; }
.body { font-size: 20px; line-height: 1.55; color: var(--c-ink-2); }
.dark .body { color: #B8B3A4; }

/* Bottom-left section caption (Anduril-style) */
.section-cap { position: absolute; left: 80px; bottom: 120px; max-width: 560px; z-index: 20; }
.section-cap h3 { font-family: var(--f-display); font-weight: 300; font-size: 56px; line-height: 1.0; letter-spacing: -0.025em; color: #fff; margin-bottom: 18px; }
.section-cap .underline { width: 220px; height: 1px; background: rgba(255,255,255,0.6); margin-bottom: 24px; }
.section-cap p { font-size: 18px; line-height: 1.5; color: rgba(255,255,255,0.85); }

/* Image slot defaults */
image-slot { --slot-bg: #14181B; }

/* ============ SLIDE 1 — TITLE ============ */
.s1 .bg { position: absolute; inset: 0; }
.s1 .bg image-slot { width: 100%; height: 100%; }
.s1 .veil {
  position: absolute; inset: 0;
  /* more dispersed — darkening ramps gently from mid-frame, not a hard bottom band */
  background: linear-gradient(to bottom,
    rgba(10,12,14,0) 0%,
    rgba(10,12,14,0.10) 26%,
    rgba(10,12,14,0.32) 52%,
    rgba(10,12,14,0.58) 76%,
    rgba(10,12,14,0.80) 100%);
  z-index: 5;
}
.s1 .content { position: absolute; inset: 0; z-index: 10; padding: 0 80px 140px; display: flex; flex-direction: column; justify-content: flex-end; }
.s1 h1 { font-size: 22px; font-weight: 200; line-height: 0.84; letter-spacing: -0.05em; color: #fff; text-shadow: 0 6px 50px rgba(8,10,12,0.50), 0 2px 16px rgba(8,10,12,0.32); }
.s1 .strap { margin-top: 56px; display: flex; justify-content: space-between; align-items: flex-end; gap: 64px; }
.s1 .tag { font-size: 32px; font-weight: 300; line-height: 1.25; color: rgba(255,255,255,0.85); max-width: 640px; letter-spacing: -0.005em; text-shadow: 0 4px 38px rgba(8,10,12,0.46), 0 1px 12px rgba(8,10,12,0.30); }
.s1 .meta { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.16em; color: rgba(255,255,255,0.65); text-transform: uppercase; text-align: right; line-height: 1.9; }
/* PRINT/PDF FIX: Chrome rasterizes large-blur text/drop shadows as hard black boxes.
   Swap the heavy glows for tight shadows in print only — the veil already carries legibility. */
@media print {
  .s1 h1, .s1 .tag { text-shadow: none !important; }
  .s1 .chrome-top.on-photo .lockup img {
    filter: invert(1) brightness(1.1) !important;
  }
  /* Strengthen the veil instead — a smooth gradient rasterizes cleanly where a blurred shadow boxes. */
  .s1 .veil {
    background: linear-gradient(to bottom,
      rgba(10,12,14,0) 0%,
      rgba(10,12,14,0.18) 30%,
      rgba(10,12,14,0.48) 56%,
      rgba(10,12,14,0.72) 78%,
      rgba(10,12,14,0.88) 100%) !important;
  }
}

/* ============ SLIDE 2 — WHAT WE ARE (split: image L / white R) ============ */
.s-split { display: grid; grid-template-columns: 1fr 1fr; height: 100%; }
.s-split .img { position: relative; overflow: hidden; }
.s-split .img image-slot { width: 100%; height: 100%; }
.s-split .img .img-veil {
  position: absolute; inset: 0;
  background: rgba(10,12,14,0.3);
}
.s-split .img .caption { position: absolute; left: 56px; bottom: 80px; right: 56px; color: #fff; }
.s-split .img .caption .cap-title { font-size: 36px; font-weight: 300; letter-spacing: -0.015em; line-height: 1.05; margin-bottom: 14px; }
.s-split .img .caption .cap-line { width: 180px; height: 1px; background: rgba(255,255,255,0.55); margin-bottom: 18px; }
.s-split .img .caption .cap-body { font-size: 16px; line-height: 1.5; color: rgba(255,255,255,0.8); max-width: 480px; }
/* Title-on-image variant */
.s-split .img .headline { position: absolute; left: 64px; right: 64px; top: 0; bottom: 0; padding: 160px 0 100px; display: flex; flex-direction: column; justify-content: space-between; color: #fff; z-index: 5; }
.s-split .img .headline .eyebrow { color: rgba(255,255,255,0.7); }
.s-split .img .headline .eyebrow .num { color: #fff; }
.s-split .img .headline h2 { color: #fff; font-size: 84px; font-weight: 300; letter-spacing: -0.035em; line-height: 0.98; margin-top: 28px; max-width: 720px; }
.s-split .img .headline .lede { color: rgba(255,255,255,0.85); font-size: 22px; max-width: 580px; }
.s-split .img .headline .hl-line { width: 220px; height: 1px; background: rgba(255,255,255,0.5); margin-bottom: 22px; }
.s-split .pane.content-only { justify-content: center; padding: 160px 96px 120px; gap: 36px; }
.s-split .pane.content-only .pane-tag { font-family: var(--f-mono); font-size: 14px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-mute); margin-bottom: 4px; }
.s-split .pane { padding: 160px 80px 100px; display: flex; flex-direction: column; gap: 36px; justify-content: center; }
.s-split .pane.dark-pane { background: var(--c-ink); color: #E8E3D6; }
.s-split.flip { grid-template-columns: 1fr 1fr; }
.s-split.flip .img { order: 2; }
.s-split.flip .pane { order: 1; }

.s2 .pane h2 { margin-top: 24px; }
.s2 .pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 24px; padding-top: 28px; border-top: 1px solid var(--c-line); }
.s2 .pillars .num { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.18em; color: var(--c-mute); margin-bottom: 12px; }
.s2 .pillars .name { font-size: 22px; font-weight: 400; line-height: 1.2; color: var(--c-ink); }

/* ============ SLIDE 3 — PROBLEM (white, two columns + atmospheric top band) ============ */
.s3 { padding: 0; }
.s3 .band { position: relative; height: 340px; overflow: hidden; }
.s3 .band image-slot { width: 100%; height: 100%; }
.s3 .band .band-veil { display: none; }
/* brand rule — matches the "Our Architecture" rule (210×1, soft white), anchored bottom-left of the photo */
.s3 .band .band-rule { position: absolute; left: 110px; bottom: 44px; width: 210px; height: 1px; background: rgba(255,255,255,0.85); z-index: 3; }
.s3 .head { padding: 48px 110px 0; }
.s3 h2.display { margin-top: 24px; max-width: none; font-size: 66px; line-height: 1.1; letter-spacing: -0.022em; }
.s3 .lede { margin-top: 22px; font-size: 26px; }
.s3 .split-cols { display: grid; grid-template-columns: 1fr 1fr; padding: 0 80px 80px; gap: 0; }
.s3 .col { padding: 36px 56px 36px 0; border-top: 1px solid var(--c-line); }
.s3 .col + .col { padding-left: 56px; padding-right: 0; border-left: 1px solid var(--c-line); }
.s3 .col .label { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-mute); margin-bottom: 18px; }
.s3 .col h3 { font-size: 38px; font-weight: 300; letter-spacing: -0.015em; line-height: 1.05; margin-bottom: 24px; color: var(--c-ink); }
.s3 .col p { font-size: 17px; line-height: 1.5; color: var(--c-ink-2); margin-bottom: 12px; max-width: 520px; }
.s3 .col .owned { margin-top: 24px; padding-top: 16px; border-top: 1px dashed var(--c-line); font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.06em; color: var(--c-mute); text-transform: uppercase; }
.s3 .col .owned strong { color: var(--c-ink); font-weight: 500; }
.s3 .col.next h3 { color: var(--c-forest); }
.s3 .col.next .owned strong { color: var(--c-good); }
.s3 .problem-bullets { list-style: none; margin: 0; padding: 64px 110px 0; display: flex; flex-direction: column; gap: 0; counter-reset: pb; }
.s3 .problem-bullets li { font-size: 27px; font-weight: 300; line-height: 1.3; letter-spacing: -0.01em; color: var(--c-ink); padding: 32px 0 32px 96px; position: relative; border-top: 1px solid var(--c-line); white-space: nowrap; }
.s3 .problem-bullets li::before { counter-increment: pb; content: "0" counter(pb); position: absolute; left: 0; top: 36px; font-family: var(--f-mono); font-size: 18px; letter-spacing: 0.1em; color: var(--c-mute); font-weight: 400; }

/* ============ SLIDE 4 — SOLUTION (full-bleed dark with cards) ============ */
.s4 { background: var(--c-ink); color: #E8E3D6; }
.s4 .bg { position: absolute; inset: 0; }
.s4 .bg image-slot { width: 100%; height: 100%; }
.s4 .veil { position: absolute; inset: 0; background: rgba(10,12,14,0.82); }
.s4 .content { position: relative; z-index: 10; padding: 140px 64px 100px; display: grid; grid-template-rows: auto 1fr; gap: 40px; height: 100%; }
.s4 .head { max-width: 1400px; }
.s4 h2 { color: #F2EEE3; margin-top: 18px; }
.s4 .lede { color: #C8C3B5; margin-top: 22px; font-size: 26px; }
/* 3-card grid (default) — clean 1px white dividers between cards */
.s4 .cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; background: transparent; border: 0; border-top: 1px solid rgba(255,255,255,0.35); border-bottom: 1px solid rgba(255,255,255,0.35); }
.s4 .card { background: transparent; padding: 36px 32px; display: flex; flex-direction: column; border-right: 1px solid rgba(255,255,255,0.35); min-width: 0; }
.s4 .card:last-child { border-right: 0; }
.s4 .card .num { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.18em; color: rgba(232,227,214,0.55); margin-bottom: 24px; }
.s4 .card h3 { font-size: 38px; font-weight: 300; letter-spacing: -0.015em; line-height: 1.05; color: #F2EEE3; margin-bottom: 8px; }
.s4 .card .sub { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(232,227,214,0.5); margin-bottom: 22px; }
.s4 .card .body { font-size: 16px; line-height: 1.5; color: #B8B3A4; margin-bottom: 16px; }
.s4 .card ul { list-style: none; margin-top: auto; padding-top: 16px; border-top: 1px solid rgba(255,255,255,0.1); }
.s4 .card li { padding: 10px 0; font-size: 14px; color: #C8C3B5; display: flex; gap: 12px; border-bottom: 1px solid rgba(255,255,255,0.06); line-height: 1.4; }
.s4 .card li::before { content: "→"; color: rgba(232,227,214,0.4); font-family: var(--f-mono); flex-shrink: 0; }

/* 5-card variant for Slide 05 Solution — narrower columns, tighter typography */
.s4 .cards.five { grid-template-columns: repeat(5, 1fr); }
.s4 .cards.five .card { padding: 28px 22px; }
.s4 .cards.five .card .num { font-size: 11px; margin-bottom: 18px; }
.s4 .cards.five .card h3 { font-size: 30px; margin-bottom: 6px; }
.s4 .cards.five .card .sub { font-size: 10px; letter-spacing: 0.14em; margin-bottom: 16px; }
.s4 .cards.five .card .body { font-size: 14px; margin-bottom: 14px; }
.s4 .cards.five .card ul { padding-top: 12px; }
.s4 .cards.five .card li { padding: 8px 0; font-size: 12px; gap: 10px; line-height: 1.35; }

/* ============ SLIDE 5 — WHY NOW (split: image L / white R, three rows) ============ */
.s5 .pane { padding: 130px 80px 100px; display: flex; flex-direction: column; gap: 28px; justify-content: center; }
.s5 .pane h2 { font-size: 76px; }
.s5 .rows { display: flex; flex-direction: column; margin-top: 16px; }
.s5 .row { display: grid; grid-template-columns: 64px 1fr; gap: 28px; padding: 32px 0; border-top: 1px solid var(--c-line); }
.s5 .row:last-child { border-bottom: 1px solid var(--c-line); }
.s5 .row .num { font-family: var(--f-mono); font-size: 14px; letter-spacing: 0.16em; color: var(--c-mute); padding-top: 6px; }
.s5 .row h4 { font-size: 30px; font-weight: 400; letter-spacing: -0.012em; color: var(--c-ink); margin-bottom: 10px; }
.s5 .row .when { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-mute); margin-bottom: 14px; }
.s5 .row p { font-size: 18px; line-height: 1.55; color: var(--c-ink-2); }

/* ============ SLIDE 6 — MARKET (white, big stats, terrain bar bottom) ============ */
.s6 { display: grid; grid-template-rows: auto 1fr 220px; }
.s6 .head { padding: 160px 80px 0; }
.s6 .head h2 { margin-top: 18px; max-width: 1600px; }
.s6 .head .lede { margin-top: 22px; font-size: 26px; }
.s6 .stats { display: grid; grid-template-columns: repeat(3, 1fr); padding: 0 80px; align-self: center; border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); margin: 0 80px; }
.s6 .stat { padding: 56px 36px; border-right: 1px solid var(--c-line); }
.s6 .stat:last-child { border-right: 0; }
.s6 .stat .v { font-size: 132px; font-weight: 200; letter-spacing: -0.04em; line-height: 1; color: var(--c-ink); margin-bottom: 24px; }
.s6 .stat .l { font-size: 20px; color: var(--c-ink); margin-bottom: 6px; }
.s6 .stat .s { font-family: var(--f-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.14em; color: var(--c-mute); }
.s6 .terrain { position: relative; overflow: hidden; }
.s6 .terrain image-slot { width: 100%; height: 100%; }
.s6 .terrain .veil { display: none; }
.s6 .terrain .wedge { position: absolute; left: 80px; right: 80px; top: 36px; font-family: var(--f-mono); font-size: 14px; color: #fff; letter-spacing: 0.06em; display: flex; gap: 40px; align-items: baseline; }
.s6 .terrain .wedge .label { font-size: 12px; text-transform: uppercase; letter-spacing: 0.16em; color: rgba(255,255,255,0.7); }
.s6 .terrain .wedge .step { font-family: var(--f-display); font-size: 22px; font-weight: 400; }
.s6 .terrain .wedge .arrow { color: rgba(255,255,255,0.6); }

/* ============ SLIDE 7 — PRODUCT (split: image L / dark pane R, dashboard) ============ */
.s7 .pane.dark-pane { padding: 130px 80px 100px; gap: 32px; }
.s7 .pane h2 { color: #F2EEE3; font-size: 76px; }
.s7 .pipeline { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-top: 8px; }
.s7 .pipeline .step { border: 1px solid rgba(255,255,255,0.15); padding: 12px 6px; text-align: center; font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(232,227,214,0.6); }
.s7 .pipeline .step.terminal { background: #E8E3D6; color: var(--c-ink); border-color: #E8E3D6; }
.s7 .ev-wrap { margin-top: 8px; }
.s7 .ev-wrap .tag { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(232,227,214,0.5); margin-bottom: 18px; }
.s7 .ev { display: grid; grid-template-columns: 130px 1fr; gap: 20px; padding: 12px 0; border-top: 1px solid rgba(255,255,255,0.1); }
.s7 .ev .t { font-family: var(--f-mono); font-size: 12px; color: rgba(232,227,214,0.6); }
.s7 .ev .b { font-size: 15px; color: #C8C3B5; line-height: 1.4; }
.s7 .theses { margin-top: 16px; border-top: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid rgba(255,255,255,0.1); }
.s7 .thesis { display: grid; grid-template-columns: 70px 1fr 90px 90px; align-items: center; padding: 14px 0; border-top: 1px solid rgba(255,255,255,0.06); font-family: var(--f-mono); font-size: 12px; }
.s7 .thesis:first-of-type { border-top: 0; }
.s7 .thesis .dir { letter-spacing: 0.14em; font-weight: 500; }
.s7 .thesis.long .dir { color: var(--c-good); }
.s7 .thesis.short .dir { color: var(--c-bad); }
.s7 .thesis .name { font-family: var(--f-display); font-size: 15px; color: #E8E3D6; }
.s7 .thesis .col { text-align: right; color: rgba(232,227,214,0.7); }
.s7 .thesis .col .v { display: block; font-size: 16px; color: #F2EEE3; }
.s7 .thesis .col .l { font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(232,227,214,0.4); }

/* ============ SLIDE 8 — COMPETITION (white, atmospheric band on top, table) ============ */
.s8 { display: grid; grid-template-rows: 220px auto 1fr; }
.s8 .band { position: relative; overflow: hidden; }
.s8 .band image-slot { width: 100%; height: 100%; }
.s8 .band .veil { display: none; }
.s8 .head { padding: 40px 80px 0; }
.s8 .head h2 { margin-top: 18px; font-size: 76px; }
.s8 .head .lede { margin-top: 16px; font-size: 22px; }
.s8 table { margin: 30px 80px 0; width: calc(100% - 160px); border-collapse: collapse; table-layout: fixed; }
.s8 th, .s8 td { text-align: center; padding: 18px 8px; border-bottom: 1px solid var(--c-line); font-size: 15px; color: var(--c-mute); font-weight: 400; }
.s8 th { font-family: var(--f-mono); font-size: 12px; font-weight: 400; letter-spacing: 0.12em; color: var(--c-mute); text-transform: uppercase; padding-bottom: 16px; line-height: 1.25; vertical-align: bottom; }
.s8 th.row-h, .s8 td.row-h { width: 22%; }
.s8 th:not(.row-h) { width: 9.75%; }
.s8 th.row-h, .s8 td.row-h { text-align: left; font-family: var(--f-display); }
.s8 td.row-h { color: var(--c-ink); font-size: 17px; }
.s8 td.row-h .sub { display: block; font-family: var(--f-mono); font-size: 10px; color: var(--c-mute); letter-spacing: 0.06em; text-transform: uppercase; margin-top: 4px; }
.s8 tr.us td { background: var(--c-paper-2); border-color: var(--c-line-2); }
.s8 tr.us td.row-h .sub { color: var(--c-forest); }
.s8 .check { color: var(--c-good); font-family: var(--f-mono); font-size: 15px; }
.s8 .dash { color: var(--c-faint); }
.s8 .partial { color: var(--c-stone); font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; }
.s8 .footnote { padding: 24px 80px 120px; font-size: 22px; font-weight: 300; color: var(--c-mute); line-height: 1.4; max-width: 1500px; }
.s8 .footnote em { color: var(--c-ink); font-style: normal; font-weight: 400; }

/* ============ SLIDE 9 — BUSINESS MODEL (white, three tiers) ============ */
.s9 { padding: 160px 80px 80px; display: grid; grid-template-rows: auto 1fr auto; gap: 50px; }
.s9 h2 { margin-top: 18px; font-size: 84px; }
.s9 .lede { margin-top: 18px; font-size: 22px; }
.s9 .tiers { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--c-line); }
.s9 .tiers.four { grid-template-columns: repeat(4, 1fr); }
.s9 .tiers.four .tier { padding: 32px 24px 24px 0; }
.s9 .tiers.four .tier:not(:first-child) { padding-left: 24px; }
.s9 .tiers.four .tier .price { font-size: 44px; }
.s9 .tiers.four .tier .audience { font-size: 13px; margin: 12px 0 22px; }
.s9 .tiers.four .tier li { font-size: 13px; padding: 10px 0; }
.s9 .tier { padding: 36px 36px 28px 0; border-right: 1px solid var(--c-line); display: flex; flex-direction: column; min-width: 0; }
.s9 .tier:not(:first-child) { padding-left: 36px; }
.s9 .tier:last-child { border-right: 0; }
.s9 .tier .name { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.2em; color: var(--c-mute); text-transform: uppercase; margin-bottom: 14px; }
.s9 .tier .price { font-size: 56px; font-weight: 200; letter-spacing: -0.025em; line-height: 1; color: var(--c-ink); }
.s9 .tier .price .unit { font-size: 0.4em; color: var(--c-mute); margin-left: 8px; }
.s9 .tier .audience { font-size: 15px; color: var(--c-mute); margin: 14px 0 28px; font-family: var(--f-mono); letter-spacing: 0.04em; }
.s9 .tier ul { list-style: none; border-top: 1px solid var(--c-line); margin-top: auto; }
.s9 .tier li { padding: 12px 0; border-bottom: 1px solid var(--c-line); font-size: 15px; color: var(--c-ink); display: flex; gap: 14px; }
.s9 .tier li::before { content: "+"; color: var(--c-mute); font-family: var(--f-mono); }
.s9 .tier .when { margin-top: 22px; font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.16em; color: var(--c-forest); text-transform: uppercase; }
.s9 .arc { font-size: 20px; color: var(--c-mute); font-weight: 300; border-top: 1px solid var(--c-line); padding-top: 28px; display: flex; gap: 56px; }
.s9 .arc strong { color: var(--c-ink); font-weight: 500; }

/* --- 07 PRICING (left-half stacked cards, right reserved) --- */
.pricing-split { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: stretch; }
.pricing-grid { display: grid; grid-template-columns: 1fr; grid-auto-rows: 1fr; gap: 18px; }
.pricing-card { border: 1px solid var(--c-line); background: var(--c-paper-2); padding: 24px 36px; display: flex; flex-direction: row; align-items: center; gap: 40px; position: relative; }
.pricing-card.feat { background: rgba(46,58,42,0.07); border-color: var(--c-forest); }
.pricing-card .pc-head { display: flex; flex-direction: column; gap: 8px; flex: 0 0 290px; }
.pricing-card .pc-name { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--c-mute); }
.pricing-card.feat .pc-name { color: var(--c-forest); }
.pricing-card .pc-price { font-family: var(--f-display); font-weight: 200; font-size: 50px; letter-spacing: -0.03em; line-height: 1; color: var(--c-ink); }
.pricing-card .pc-price.txt { font-size: 30px; }
.pricing-card .pc-price .pc-unit { font-family: var(--f-mono); font-size: 15px; font-weight: 400; letter-spacing: 0.04em; color: var(--c-mute); margin-left: 6px; }
.pricing-card .pc-calls { font-family: var(--f-display); font-size: 16px; line-height: 1.45; color: var(--c-ink-2); flex: 1; padding-left: 40px; border-left: 1px solid var(--c-line); align-self: stretch; display: flex; align-items: center; }

/* projection chart (right half) */
.pricing-right { display: flex; flex-direction: column; gap: 14px; }
.proj-head { display: flex; align-items: baseline; justify-content: space-between; }
.proj-title { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--c-mute); }
.proj-legend { display: flex; gap: 22px; font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.06em; color: var(--c-mute); text-transform: uppercase; }
.proj-legend .lg { display: flex; align-items: center; gap: 8px; }
.proj-legend .lg::before { content: ""; width: 18px; border-top: 3px solid var(--c-forest); }
.proj-legend .lg-human::before { border-top: 2.5px solid #6B6356; }
.proj-legend .lg-agent::before { border-top: 2px dashed #9C7E45; }
.proj-chart { width: 100%; height: auto; display: block; }
.proj-chart .grid { stroke: var(--c-line); stroke-width: 1; }
.proj-chart .axis { stroke: var(--c-line-2); stroke-width: 1.5; }
.proj-chart .ax { font-family: var(--f-mono); font-size: 13px; fill: var(--c-dim); }
.proj-chart .xl { font-family: var(--f-mono); font-size: 14px; fill: var(--c-mute); }
.proj-chart .vlab { font-family: var(--f-display); font-weight: 500; }
.proj-chart .vlab.big { fill: var(--c-forest); font-size: 22px; }
.proj-chart .vlab.hum { fill: #6B6356; font-size: 16px; }
.proj-chart .vlab.ag { fill: #9C7E45; font-size: 15px; }
.proj-foot { font-family: var(--f-display); font-size: 14px; line-height: 1.45; color: var(--c-ink-2); margin-top: 2px; }
.proj-foot strong { color: var(--c-ink); font-weight: 500; }

/* ============ SLIDE 10 — FLYWHEEL (split: image L / white R, stages) ============ */
.s10 .pane { padding: 130px 80px 100px; gap: 24px; }
.s10 h2 { font-size: 76px; }
.s10 .stage { display: grid; grid-template-columns: 64px 1fr 48px; gap: 28px; align-items: center; padding: 26px 0; border-top: 1px solid var(--c-line); }
.s10 .stage:last-child { border-bottom: 1px solid var(--c-line); }
.s10 .stage .num { font-family: var(--f-mono); font-size: 14px; letter-spacing: 0.14em; color: var(--c-mute); }
.s10 .stage h4 { font-size: 28px; font-weight: 300; letter-spacing: -0.015em; color: var(--c-ink); margin-bottom: 6px; }
.s10 .stage p { font-size: 17px; color: var(--c-mute); line-height: 1.45; }
.s10 .stage .arrow { font-family: var(--f-mono); color: var(--c-stone); font-size: 20px; text-align: right; }

/* ============ SLIDE 11 — ROADMAP (white, terrain band top, timeline) ============ */
.s11 { display: grid; grid-template-rows: 240px auto 1fr auto; }
.s11 .band { position: relative; overflow: hidden; }
.s11 .band image-slot { width: 100%; height: 100%; }
.s11 .band .veil { display: none; }
.s11 .head { padding: 50px 80px 0; }
.s11 h2 { margin-top: 18px; font-size: 80px; max-width: 1500px; }
.s11 .timeline { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); margin: 60px 80px 0; }
.s11 .timeline::before { content: ""; position: absolute; top: 28px; left: 0; right: 0; height: 1px; background: var(--c-line-2); }
.s11 .milestone { padding-right: 32px; position: relative; padding-top: 64px; }
.s11 .milestone::before { content: ""; position: absolute; top: 22px; left: 0; width: 14px; height: 14px; background: var(--c-paper); border: 1px solid var(--c-line-2); border-radius: 50%; }
.s11 .milestone.now::before { background: var(--c-forest); border-color: var(--c-forest); box-shadow: 0 0 12px rgba(46,58,42,0.4); }
.s11 .milestone .when { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.16em; color: var(--c-ink); text-transform: uppercase; margin-bottom: 18px; }
.s11 .milestone .what { font-size: 18px; line-height: 1.3; color: var(--c-mute); }
.s11 .why { padding: 40px 80px 80px; border-top: 1px solid var(--c-line); margin: 50px 80px 0; display: grid; grid-template-columns: 240px 1fr; gap: 60px; padding: 32px 0 0; }
.s11 .why-wrap { padding: 40px 80px 80px; }
.s11 .why .lab { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.18em; color: var(--c-stone); text-transform: uppercase; }
.s11 .why p { font-size: 20px; line-height: 1.4; color: var(--c-ink); }
.s11 .why p .mute { color: var(--c-mute); font-weight: 300; }

/* ============ SLIDE 12 — TEAM (split: image L / white R) ============ */
.s12 { padding: 160px 80px 80px; display: grid; grid-template-rows: auto 1fr auto; gap: 40px; }
.s12 h2 { margin-top: 18px; font-size: 84px; }
.s12 .lede { margin-top: 18px; font-size: 22px; }
.s12 .roster { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--c-line); }
.s12 .person { padding: 40px 56px 40px 0; border-right: 1px solid var(--c-line); display: grid; grid-template-columns: 180px 1fr; gap: 32px; }
.s12 .person:last-child { padding-left: 56px; padding-right: 0; border-right: 0; }
.s12 .avatar { width: 180px; height: 230px; }
.s12 .avatar image-slot { width: 100%; height: 100%; }
.s12 h3 { font-size: 32px; font-weight: 300; letter-spacing: -0.015em; color: var(--c-ink); margin-bottom: 4px; }
.s12 .role { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.16em; color: var(--c-stone); text-transform: uppercase; margin-bottom: 18px; }
.s12 .bio { font-size: 14px; line-height: 1.55; color: var(--c-mute); }
.s12 .bio em { font-style: normal; color: var(--c-ink); font-weight: 500; }
.s12 .advisors { border-top: 1px solid var(--c-line); padding-top: 28px; display: grid; grid-template-columns: 240px 1fr 1fr 1fr; gap: 40px; }
.s12 .advisors .lab { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.18em; color: var(--c-mute); text-transform: uppercase; line-height: 1.6; }
.s12 .advisors .a-name { font-size: 16px; color: var(--c-ink); margin-bottom: 4px; }
.s12 .advisors .a-meta { font-family: var(--f-mono); font-size: 11px; color: var(--c-mute); }

/* ============ SLIDE 13 — ASK (full-bleed dark, three columns with hairlines) ============ */
.s13 { background: var(--c-ink); color: #E8E3D6; }
.s13 .bg { position: absolute; inset: 0; }
.s13 .bg image-slot { width: 100%; height: 100%; }
.s13 .veil { position: absolute; inset: 0; background: rgba(10,12,14,0.7); }
.s13 .content { position: relative; z-index: 10; padding: 160px 80px 80px; display: grid; grid-template-rows: auto 1fr auto; gap: 50px; height: 100%; }
.s13 h2 { color: #F2EEE3; font-size: 92px; margin-top: 24px; }
.s13 .lede { color: #C8C3B5; margin-top: 18px; font-size: 26px; }
.s13 .three { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(232,227,214,0.2); }
.s13 .ask-card { padding: 36px 40px 28px 0; border-right: 1px solid rgba(232,227,214,0.2); }
.s13 .ask-card:not(:first-child) { padding-left: 40px; }
.s13 .ask-card:last-child { border-right: 0; }
.s13 .ask-card .ix { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.18em; color: #F2EEE3; text-transform: uppercase; margin-bottom: 24px; }
.s13 .ask-card .v { font-size: 56px; font-weight: 200; letter-spacing: -0.025em; line-height: 1; color: #F2EEE3; margin-bottom: 10px; }
.s13 .ask-card .what { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(232,227,214,0.6); margin-bottom: 24px; }
.s13 .ask-card .b { font-size: 15px; line-height: 1.55; color: rgba(232,227,214,0.8); }
.s13 .closer { border-top: 1px solid rgba(232,227,214,0.2); padding-top: 28px; display: flex; justify-content: space-between; align-items: end; gap: 56px; }
.s13 .closer .by { font-size: 28px; font-weight: 300; color: #F2EEE3; max-width: 1100px; line-height: 1.3; }
.s13 .closer .contact { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.14em; color: rgba(232,227,214,0.7); text-transform: uppercase; text-align: right; line-height: 1.7; }

/* ============================================================
   SEQUOIA VARIANT (.sq-*) — namespaced layouts for 10-slide deck
   Only used by "Cascadian Brand Deck - Sequoia.html"
   ============================================================ */

/* --- 07 MARKET — TAM / SAM / SOM ---------------------------- */
.sq-market { background: var(--c-paper); padding: 140px 80px 100px; display: grid; grid-template-rows: auto 1fr auto; gap: 56px; }
.sq-market-head { max-width: 1500px; }
.sq-market-head h2.display { margin-top: 14px; font-size: 76px; line-height: 1.02; }
.sq-market-head .lede { margin-top: 18px; max-width: 1100px; font-size: 26px; }

.sq-tiers { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 32px; align-content: start; }
.sq-tier { background: var(--c-paper-2); border: 1px solid var(--c-line); padding: 40px 36px 32px; display: flex; flex-direction: column; gap: 16px; position: relative; transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1); }
.sq-tier::before { content: ""; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: var(--c-stone); }
.sq-tier.sq-tam::before { background: var(--c-faint); }
.sq-tier.sq-sam::before { background: var(--c-stone); }
.sq-tier.sq-som::before { background: var(--c-forest); }
.sq-tier-tag { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-mute); }
.sq-tier-num { font-family: var(--f-display); font-weight: 200; font-size: 96px; line-height: 0.95; letter-spacing: -0.035em; color: var(--c-ink); margin-top: 4px; }
.sq-tier.sq-som .sq-tier-num { color: var(--c-forest); }
.sq-tier-label { font-family: var(--f-display); font-weight: 400; font-size: 22px; line-height: 1.3; color: var(--c-ink-2); max-width: 380px; }
.sq-tier-evidence { list-style: none; padding: 0; margin: 4px 0 0; display: flex; flex-direction: column; gap: 10px; border-top: 1px solid var(--c-line); padding-top: 18px; }
.sq-tier-evidence li { font-size: 15px; line-height: 1.45; color: var(--c-ink-2); padding-left: 14px; position: relative; }
.sq-tier-evidence li::before { content: ""; position: absolute; left: 0; top: 9px; width: 6px; height: 1px; background: var(--c-stone); }
.sq-source { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-dim); margin-top: auto; padding-top: 12px; }

.sq-market-foot { display: flex; align-items: center; gap: 24px; border-top: 1px solid var(--c-line); padding-top: 28px; font-family: var(--f-display); font-weight: 300; font-size: 22px; line-height: 1.4; color: var(--c-ink-2); }
.sq-market-foot strong { font-weight: 500; color: var(--c-ink); }
.sq-market-foot .sq-arrow { font-family: var(--f-mono); font-size: 28px; color: var(--c-forest); }

/* --- Market V1 — Funnel staircase diagram ------------------- */
.sq-market.mv { padding: 88px 80px 60px; grid-template-rows: auto 1fr auto; gap: 36px; }
.mv .sq-market-head h2.display { font-size: 62px; }
.mv .sq-market-head .lede { font-size: 23px; margin-top: 14px; }
.mv1 .diagram { display: flex; flex-direction: column; }
.mv1 .bars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; align-items: end; height: 300px; border-bottom: 2px solid var(--c-line-2); }
.mv1 .bar { position: relative; border: 1px solid var(--c-line); border-bottom: none; padding: 26px 30px; display: flex; flex-direction: column; gap: 6px; }
.mv1 .bar::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; }
.mv1 .bar.tam::before { background: var(--c-faint); }
.mv1 .bar.sam::before { background: var(--c-stone); }
.mv1 .bar.som::before { background: var(--c-forest); }
.mv1 .bar .sq-tier-tag { font-size: 11px; }
.mv1 .bar .sq-tier-num { font-size: 64px; margin-top: 2px; }
.mv1 .bar.som .sq-tier-num { color: var(--c-forest); }
.mv1 .texts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; padding-top: 26px; }
.mv1 .texts .col { display: flex; flex-direction: column; gap: 14px; }
.mv1 .texts .lab { font-family: var(--f-display); font-weight: 400; font-size: 20px; line-height: 1.3; color: var(--c-ink-2); }
.mv1 .texts .ev { list-style: none; margin: 0; padding: 14px 0 0; border-top: 1px solid var(--c-line); display: flex; flex-direction: column; gap: 9px; }
.mv1 .texts .ev li { font-size: 14px; line-height: 1.4; color: var(--c-ink-2); padding-left: 14px; position: relative; }
.mv1 .texts .ev li::before { content: ""; position: absolute; left: 0; top: 8px; width: 6px; height: 1px; background: var(--c-stone); }
.mv1 .texts .src { font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-dim); margin-top: auto; padding-top: 6px; }

/* --- Market V2 — Dual-stack bars: proven human base + emerging agent layer --- */
.mv-stack .sq-market-head h2.display { font-size: 52px; }
.mv-stack .diagram { display: flex; flex-direction: column; }
.mv-stack .bars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 44px; align-items: end; height: 290px; border-bottom: 2px solid var(--c-line-2); margin-top: 52px; }
.mv-stack .bar { position: relative; display: flex; flex-direction: column; justify-content: flex-end; }
.mv-stack .bar-total { position: absolute; top: -48px; left: 0; }
.mv-stack .bar-total .t-num { font-family: var(--f-display); font-weight: 300; font-size: 40px; letter-spacing: -0.03em; line-height: 1; color: var(--c-ink); }
.mv-stack .bar-total .t-lab { font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-mute); margin-top: 5px; }
.mv-stack .seg { position: relative; border: 1px solid var(--c-line); border-bottom: none; padding: 13px 22px; display: flex; flex-direction: column; gap: 2px; overflow: hidden; justify-content: center; }
.mv-stack .seg-agent { background: rgba(46,58,42,0.09); }
.mv-stack .seg-agent::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--c-forest); }
.mv-stack .seg-human { background: var(--c-paper-2); }
.mv-stack .seg .s-tag { font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; }
.mv-stack .seg-agent .s-tag { color: var(--c-forest); }
.mv-stack .seg-human .s-tag { color: var(--c-mute); }
.mv-stack .seg .s-num { font-family: var(--f-display); font-weight: 200; letter-spacing: -0.03em; line-height: 1; }
.mv-stack .seg-human .s-num { font-size: 44px; color: var(--c-ink); }
.mv-stack .seg-agent .s-num { font-size: 30px; color: var(--c-forest); }

.mv-stack .texts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 44px; padding-top: 24px; }
.mv-stack .texts .col { display: flex; flex-direction: column; gap: 12px; }
.mv-stack .texts .lab { font-family: var(--f-display); font-weight: 400; font-size: 19px; line-height: 1.3; color: var(--c-ink-2); }
.mv-stack .texts .ev { list-style: none; margin: 0; padding: 13px 0 0; border-top: 1px solid var(--c-line); display: flex; flex-direction: column; gap: 10px; }
.mv-stack .texts .ev li { font-size: 13.5px; line-height: 1.45; color: var(--c-ink-2); padding-left: 58px; position: relative; }
.mv-stack .texts .ev li .who { position: absolute; left: 0; top: 1px; font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 500; }
.mv-stack .texts .ev li .who.h { color: var(--c-mute); }
.mv-stack .texts .ev li .who.a { color: var(--c-forest); }
.mv-stack .texts .src { font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-dim); margin-top: auto; padding-top: 6px; }

/* --- 09 TRACTION BAND (above existing .tiers.four) ---------- */
.sq-traction-model { padding-bottom: 80px; }
.sq-traction-band { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); padding: 24px 0; margin: 28px 0 36px; }
.sq-tract-stat { display: flex; flex-direction: column; gap: 6px; padding: 0 36px; border-right: 1px solid var(--c-line); }
.sq-tract-stat:first-child { padding-left: 0; }
.sq-tract-stat:last-child { border-right: 0; padding-right: 0; }
.sq-tract-num { font-family: var(--f-display); font-weight: 300; font-size: 56px; line-height: 1; letter-spacing: -0.03em; color: var(--c-forest); }
.sq-tract-lab { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-mute); line-height: 1.4; }

/* --- 10 TEAM + ASK (dark bg with image) --------------------- */
.sq-team-ask { background: var(--c-ink); color: #E8E3D6; }
.sq-team-ask .bg { position: absolute; inset: 0; }
.sq-team-ask .bg image-slot { width: 100%; height: 100%; }
.sq-team-ask .veil { position: absolute; inset: 0; background: rgba(10,12,14,0.78); }
.sq-ta-content { position: relative; z-index: 10; padding: 150px 80px 80px; display: grid; grid-template-rows: auto 1fr auto; gap: 48px; height: 100%; }
.sq-ta-head h2.display { color: #F2EEE3; font-size: 88px; margin-top: 18px; }
/* brand rule above the ask headline — white, matches the dark Solution slide */
.sq-ta-head::before { content: ""; display: block; width: 210px; height: 1px; background: rgba(255,255,255,0.55); margin-bottom: 20px; }
.sq-ta-team { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-content: center; }
.sq-ta-team-left { display: flex; flex-direction: column; justify-content: center; }
.sq-ta-team-right { display: flex; flex-direction: column; gap: 48px; justify-content: center; }
.sq-ta-uof { display: flex; flex-direction: column; gap: 24px; }
.sq-ta-uof-label { font-family: var(--f-display); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(232,227,214,0.6); }
.sq-ta-uof-item { font-family: var(--f-display); font-weight: 200; font-size: 64px; line-height: 1; letter-spacing: -0.025em; color: #F2EEE3; }
.sq-ta-person { display: grid; grid-template-columns: 200px 1fr; gap: 36px; align-items: start; }
.sq-ta-avatar { width: 200px; height: 200px; background: rgba(232,227,214,0.08); border: 1px solid rgba(232,227,214,0.18); overflow: hidden; }
.sq-ta-avatar image-slot { width: 100%; height: 100%; display: block; }
.sq-ta-name { font-family: var(--f-display); font-weight: 400; font-size: 38px; line-height: 1.05; letter-spacing: -0.015em; color: #F2EEE3; }
.sq-ta-role { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(232,227,214,0.6); margin-top: 8px; margin-bottom: 18px; }
.sq-ta-bio { font-family: var(--f-display); font-weight: 300; font-size: 17px; line-height: 1.6; color: rgba(232,227,214,0.85); max-width: 540px; }
.sq-ta-bio-list { list-style: none; margin: 0; padding: 0; max-width: 540px; display: flex; flex-direction: column; gap: 9px; }
.sq-ta-bio-list li { font-family: var(--f-display); font-weight: 300; font-size: 18px; line-height: 1.35; color: rgba(232,227,214,0.88); padding-left: 20px; position: relative; }
.sq-ta-bio-list li::before { content: ""; position: absolute; left: 0; top: 11px; width: 8px; height: 1px; background: var(--c-sand); }
.sq-ta-ask { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(232,227,214,0.2); padding-top: 28px; }
.sq-ta-ask-card { padding: 0 32px; border-right: 1px solid rgba(232,227,214,0.18); display: flex; flex-direction: column; gap: 10px; }
.sq-ta-ask-card:first-child { padding-left: 0; }
.sq-ta-ask-card:last-child { border-right: 0; padding-right: 0; }
.sq-ta-ix { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.18em; color: rgba(232,227,214,0.6); text-transform: uppercase; }
.sq-ta-v { font-family: var(--f-display); font-weight: 200; font-size: 52px; letter-spacing: -0.025em; line-height: 1; color: #F2EEE3; }
.sq-ta-cv { font-family: var(--f-mono); font-size: 16px; letter-spacing: 0.06em; color: #F2EEE3; line-height: 1.4; word-break: break-all; }
.sq-ta-w { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(232,227,214,0.7); line-height: 1.5; }
.sq-ta-cw { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.12em; color: rgba(232,227,214,0.6); line-height: 1.5; word-break: break-all; }

/* --- 06 FLYWHEEL CARD ACCENT (on existing Moat .card) ------- */
.sq-flywheel-card { position: relative; }
.sq-flywheel-card::after { content: ""; position: absolute; top: 0; right: 0; width: 28px; height: 28px; border-top: 1px solid rgba(242,238,227,0.5); border-right: 1px solid rgba(242,238,227,0.5); }
.sq-flywheel-card ul li strong { color: rgba(242,238,227,0.95); font-weight: 500; letter-spacing: 0.02em; }

/* --- 07 MARKET FIX — prevent footer text overflow ------------ */
.sq-market-foot span:last-child { max-width: 1440px; }

/* --- 09 TRACTION+MODEL FIX — .s9 grid has 3 implicit rows;
   we added a 4th (traction band) so override to 4-row explicit
   grid and tighten all sizing to stay within 1080px ----------- */
.sq-traction-model { grid-template-rows: auto auto auto auto; gap: 22px; padding: 120px 80px 60px; }
.sq-traction-model h2.display { font-size: 68px; margin-top: 12px; }
.sq-traction-model .lede { font-size: 20px; margin-top: 10px; }
.sq-traction-model .sq-traction-band { padding: 16px 0; margin: 0; }
.sq-traction-model .sq-tract-num { font-size: 44px; }
.sq-traction-model .tiers.four .tier { padding: 20px 16px 14px 0; }
.sq-traction-model .tiers.four .tier:not(:first-child) { padding-left: 16px; border-left: 1px solid var(--c-line); }
.sq-traction-model .tiers.four .tier .price { font-size: 38px; }
.sq-traction-model .tiers.four .tier .audience { font-size: 12px; margin: 8px 0 12px; }
.sq-traction-model .tiers.four li { font-size: 12px; padding: 6px 0; }
.sq-traction-model .arc { font-size: 14px; padding-top: 8px; gap: 32px; }

/* ============ s-causal · What is causal intelligence ============ */
.s-causal { padding: 140px 80px 80px; display: flex; flex-direction: column; }
.s-causal .head { max-width: 1600px; }
.s-causal .head h2.display { margin-top: 18px; font-size: 88px; line-height: 1.0; }
.s-causal .head .lede { margin-top: 22px; font-size: 24px; line-height: 1.4; color: var(--c-ink-2); max-width: 1500px; font-weight: 300; }
.s-causal .causal-chain {
  margin-top: 88px;
  display: grid;
  grid-template-columns: 1fr 56px 1fr 56px 1fr 56px 1fr 56px 1fr;
  align-items: stretch;
  gap: 0;
}
.s-causal .node {
  border: 1px solid var(--c-line);
  padding: 32px 28px 28px;
  background: var(--c-paper);
  display: flex; flex-direction: column; gap: 16px;
  min-height: 220px;
}
.s-causal .node .num { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.2em; color: var(--c-mute); }
.s-causal .node .label { font-family: var(--f-display); font-size: 32px; font-weight: 400; line-height: 1.05; letter-spacing: -0.015em; color: var(--c-ink); }
.s-causal .node .sub { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-dim); margin-top: auto; }
.s-causal .node.terminal { background: var(--c-ink); border-color: var(--c-ink); }
.s-causal .node.terminal .num { color: rgba(232,227,214,0.55); }
.s-causal .node.terminal .label { color: #F2EEE3; }
.s-causal .node.terminal .sub { color: rgba(232,227,214,0.6); }
.s-causal .arrow {
  align-self: center;
  width: 100%;
  height: 1px;
  background: var(--c-line-2);
  position: relative;
}
.s-causal .arrow::after {
  content: ""; position: absolute; right: 0; top: -4px;
  width: 0; height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 9px solid var(--c-line-2);
}
.s-causal .foot { margin-top: 72px; display: grid; grid-template-columns: 280px 1fr; gap: 48px; align-items: start; padding-top: 28px; border-top: 1px solid var(--c-line); }
.s-causal .foot .foot-label { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-mute); }
.s-causal .foot .foot-copy { font-size: 22px; line-height: 1.45; color: var(--c-ink-2); max-width: 1200px; font-weight: 300; }

/* === SQ ARCHITECTURE (slide 05) — hub-centric: causal-temporal engine at the core === */
.sq-arch {
  background: var(--c-paper);
  color: var(--c-ink);
  padding: 60px 56px 32px;
  display: grid;
  grid-template-rows: auto 1fr auto auto;
  gap: 16px;
  height: 100%;
  position: relative;
}
.sq-arch-head { display: grid; gap: 6px; max-width: 1500px; }
.sq-arch-head .display { font-size: 48px; line-height: 1.02; letter-spacing: -0.022em; font-weight: 300; margin-top: 4px; }
.sq-arch-head .lede { font-size: 15px; line-height: 1.55; color: var(--c-mute); max-width: 1220px; font-weight: 300; }

/* Main 3-zone architecture grid */
.sq-arch-main {
  display: grid;
  grid-template-columns: 210px 1fr 220px;
  gap: 14px;
  align-items: stretch;
  position: relative;
}

.sq-arch-zone {
  background: var(--c-paper-2);
  border: 1px solid var(--c-line);
  padding: 14px 18px;
  display: grid;
  gap: 8px;
  align-content: start;
  position: relative;
}
.sq-arch-zone-label {
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--c-forest);
  border-bottom: 1px solid var(--c-line);
  padding-bottom: 7px;
  margin-bottom: 2px;
}
.sq-arch-zone-list {
  display: grid;
  gap: 3px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.sq-arch-zone-list li {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  color: var(--c-ink);
  line-height: 1.4;
  padding: 2px 0;
  border-bottom: 1px dotted transparent;
}
.sq-arch-zone-list li::before {
  content: "—";
  display: inline-block;
  width: 16px;
  color: var(--c-mute);
}

/* Flow arrows between zones */
.sq-arch-main::before,
.sq-arch-main::after {
  content: "→";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--f-display);
  font-size: 22px;
  font-weight: 300;
  color: var(--c-mute);
  z-index: 5;
  background: var(--c-paper);
  padding: 2px 4px;
  line-height: 1;
}
.sq-arch-main::before { left: 213px; }
.sq-arch-main::after { right: 224px; }

/* Hero — Causal-Temporal Engine (dark) */
.sq-arch-core {
  background: var(--c-ink);
  color: rgba(242, 238, 227, 0.92);
  border: 1px solid var(--c-ink);
  padding: 18px 24px 16px;
  position: relative;
  display: grid;
  gap: 12px;
  align-content: start;
}
.sq-arch-core-label {
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: rgba(242, 238, 227, 0.45);
}
.sq-arch-core-title {
  font-family: var(--f-display);
  font-size: 26px;
  font-weight: 400;
  letter-spacing: -0.012em;
  line-height: 1.1;
  color: rgba(242, 238, 227, 0.98);
  margin-top: -2px;
}

.sq-arch-core-section-label {
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(242, 238, 227, 0.45);
  padding-top: 10px;
  border-top: 1px solid rgba(242, 238, 227, 0.14);
  margin-bottom: -2px;
}

.sq-arch-core-engines {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}
.sq-arch-core-engine {
  display: grid;
  gap: 3px;
  padding: 6px 8px 4px;
  border-left: 1px solid rgba(242, 238, 227, 0.12);
}
.sq-arch-core-engine:first-child {
  border-left: none;
  padding-left: 0;
}
.sq-arch-core-verb {
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(242, 238, 227, 0.55);
}
.sq-arch-core-engine-name {
  font-family: var(--f-display);
  font-size: 12.5px;
  font-weight: 400;
  color: rgba(242, 238, 227, 0.94);
  line-height: 1.2;
}

.sq-arch-core-model-tags {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  color: rgba(242, 238, 227, 0.86);
  line-height: 1.5;
}

.sq-arch-core-moat {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
  padding: 10px 12px;
  background: rgba(242, 238, 227, 0.06);
  border-left: 2px solid var(--c-signal, #B8862E);
  margin-top: 2px;
}
.sq-arch-core-moat-label {
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--c-signal, #B8862E);
}
.sq-arch-core-moat-text {
  font-size: 12px;
  line-height: 1.4;
  color: rgba(242, 238, 227, 0.92);
  font-weight: 300;
}
.sq-arch-core-moat-text strong {
  font-weight: 500;
  color: rgba(242, 238, 227, 1);
}

/* Foundation strip */
.sq-arch-foundation {
  background: var(--c-paper-2);
  padding: 10px 20px;
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 24px;
  align-items: center;
  border-top: 1px solid var(--c-line);
  border-bottom: 1px solid var(--c-line);
}
.sq-arch-foundation-label {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--c-mute);
}
.sq-arch-foundation-tags {
  font-family: var(--f-mono);
  font-size: 11.5px;
  letter-spacing: 0.04em;
  color: var(--c-ink);
  line-height: 1.5;
}

/* Foot — 4 principles */
.sq-arch-foot {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  padding-top: 10px;
}
.sq-arch-foot-item {
  font-size: 12px;
  color: var(--c-mute);
  line-height: 1.4;
}
.sq-arch-foot-item strong {
  display: block;
  font-family: var(--f-display);
  font-size: 14.5px;
  font-weight: 500;
  letter-spacing: -0.005em;
  color: var(--c-ink);
  margin-bottom: 1px;
}

/* ============ s-mcp · Agent-native (ported from Event Intelligence deck) ============ */
.s-mcp { background: var(--c-ink); color: #E8E3D6; padding: 140px 80px 96px; display: grid; grid-template-rows: auto 1fr; gap: 44px; }
.s-mcp .band { display: none; }
.s-mcp.with-band { padding-top: 178px; }
.s-mcp.with-band .band { display: block; position: absolute; top: 0; left: 0; right: 0; height: 150px; overflow: hidden; z-index: 0; }
.s-mcp.with-band .band image-slot { width: 100%; height: 100%; display: block; }
.s-mcp .head { max-width: 1500px; }
/* brand rule above the headline — matches the "Our Architecture" rule (210×1, soft white) */
.s-mcp .head::before { content: ""; display: block; width: 210px; height: 1px; background: rgba(255,255,255,0.22); margin-bottom: 24px; }
.s-mcp h2.display { color: #F2EEE3; margin-top: 18px; }
.s-sol-report h2.display { font-size: 80px; white-space: nowrap; letter-spacing: -0.022em; }
.s-mcp .lede { color: #C8C3B5; margin-top: 20px; font-size: 25px; max-width: 1180px; }
.s-mcp .mcp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: start; border-top: 1px solid rgba(255,255,255,0.22); padding-top: 40px; }
.s-mcp .mcp-label { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(232,227,214,0.55); margin-bottom: 20px; }
.s-mcp .mcp-fns { display: flex; flex-direction: column; }
.s-mcp .mcp-fn { font-family: var(--f-mono); padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,0.08); font-size: 18px; color: #E8E3D6; display: flex; gap: 14px; align-items: baseline; }
.s-mcp .mcp-fn::before { content: "▸"; color: var(--c-sand); font-size: 12px; flex-shrink: 0; }
.s-mcp .mcp-fn .arg { color: rgba(232,227,214,0.45); }
.s-mcp .mcp-card { background: rgba(232,227,214,0.04); border: 1px solid rgba(255,255,255,0.14); padding: 34px 36px 36px; }
.s-mcp .mcp-q { font-family: var(--f-mono); font-size: 16px; color: var(--c-sand); margin-bottom: 22px; line-height: 1.5; }
.s-mcp .mcp-q .pmt { color: rgba(232,227,214,0.4); }
.s-mcp .mcp-r { font-family: var(--f-display); font-weight: 300; font-size: 22px; line-height: 1.55; color: #C8C3B5; }
.s-mcp .mcp-r .hl { color: #F2EEE3; font-weight: 400; }
.s-mcp .mcp-meta { margin-top: 26px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.1); font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(232,227,214,0.5); line-height: 1.6; }

/* --- 6-card STACKED ROWS layout (solution slide) ------------------- */
/* One card per row, each card is a wide horizontal bar */
.s4 .cards.six {
  grid-template-columns: 1fr;
  border-top: 1px solid rgba(255,255,255,0.35);
  border-bottom: 1px solid rgba(255,255,255,0.35);
  background: transparent;
}

/* Each card: big num | name+sub | explainer | bullets */
.s4 .cards.six .card {
  display: grid;
  grid-template-columns: 120px 320px 680px 1fr;
  align-items: center;
  padding: 0;
  border-right: 0;
  border-bottom: 1px solid rgba(255,255,255,0.12);
  min-height: 0;
}
.s4 .cards.six .card:last-child { border-bottom: 0; }

/* Column 1: giant number */
.s4 .card-row-num {
  padding: 0 24px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-right: 1px solid rgba(255,255,255,0.1);
  font-family: var(--f-display);
  font-size: 80px;
  font-weight: 200;
  letter-spacing: -0.04em;
  color: rgba(232,227,214,0.2);
  line-height: 1;
}

/* Column 2: name + subtitle */
.s4 .card-row-left {
  padding: 20px 32px;
  border-right: 1px solid rgba(255,255,255,0.1);
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
}
.s4 .card-row-left h3   { font-family: var(--f-display); font-size: 30px; font-weight: 300; letter-spacing: -0.015em; color: #F2EEE3; margin: 0; }
.s4 .card-row-left .sub { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(232,227,214,0.45); order: -1; }

/* Column 3: short explainer */
.s4 .card-row-body {
  padding: 20px 36px;
  border-right: 1px solid rgba(255,255,255,0.1);
  height: 100%;
  display: flex;
  align-items: center;
  font-family: var(--f-display);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.6;
  color: #B8B3A4;
}

/* Right column: bullets or badges */
.s4 .card-row-right {
  padding: 16px 28px;
  list-style: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  height: 100%;
}
.s4 .card-row-right li {
  font-family: var(--f-mono);
  font-size: 16px;
  letter-spacing: 0.04em;
  color: #C8C3B5;
  border: 0;
  padding: 0;
  display: flex;
  gap: 10px;
  line-height: 1.4;
}
.s4 .card-row-right li::before { content: "→"; color: rgba(232,227,214,0.35); flex-shrink: 0; }

/* Connector card: badges instead of bullets */
.s4 .card-connector .card-row-right {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.s4 .connector-badge {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  color: rgba(232,227,214,0.75);
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: 4px;
  padding: 5px 12px;
}

/* ============ Forecast report card + tool list — ported from new design ============ */
/* Card container */
.s-mcp .mcp-card { background: #141619; border: 1px solid rgba(236,238,241,.14); border-radius: 4px; padding: 34px 38px; }

/* Code call block */
.fc-report { display: flex; flex-direction: column; }
.fc-call { font-family: var(--f-mono); font-size: 21px; letter-spacing: -.01em; line-height: 1.4; background: #0B0C0E; border: 1px solid rgba(236,238,241,.14); border-radius: 3px; padding: 17px 22px; margin-bottom: 24px; color: #ECEEF1; }
.fc-call .pmt { color: rgba(236,238,241,.33); }
.fc-call .fn { color: #CD6038; }

/* Summary paragraph */
.fc-summary { font-family: var(--f-display); font-weight: 300; font-size: 21px; line-height: 1.5; color: rgba(236,238,241,.58); margin: 0 0 8px; }
.fc-summary .hl { color: #ECEEF1; font-weight: 600; }

/* Data rows */
.fc-rows { display: flex; flex-direction: column; margin-top: 14px; }
.fc-row { display: grid; grid-template-columns: 168px 1fr; gap: 22px; padding: 14px 0; border-top: 1px solid rgba(236,238,241,.07); align-items: baseline; }
.fc-k { font-family: var(--f-mono); font-size: 12.5px; letter-spacing: .16em; text-transform: uppercase; color: rgba(236,238,241,.33); padding-top: 2px; }
.fc-v { font-family: var(--f-mono); font-size: 18px; color: #ECEEF1; line-height: 1.4; }
.fc-base { color: rgba(236,238,241,.33); }
.fc-hi { color: #CD6038; font-weight: 600; }
.fc-lift { color: rgba(236,238,241,.33); margin-left: 10px; font-size: 14px; }

/* Pathway chips */
.fc-chain { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.fc-chain span { display: inline-flex; align-items: center; padding: 3px 11px; border: 1px solid rgba(236,238,241,.14); border-radius: 3px; font-family: var(--f-mono); font-size: 14px; color: #ECEEF1; }
.fc-chain i { font-style: normal; font-family: var(--f-mono); font-size: 13px; color: rgba(236,238,241,.33); }

/* Tool list */
.s-mcp .mcp-label { font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: rgba(236,238,241,.33); margin-bottom: 18px; }
.s-mcp .mcp-fn { font-family: var(--f-mono); font-size: 17px; color: #ECEEF1; display: flex; align-items: baseline; gap: 10px; padding: 11px 0; border-top: 1px solid rgba(236,238,241,.07); border-bottom: none; white-space: nowrap; }
.s-mcp .mcp-fn::before { content: "›"; color: #CD6038; font-size: 16px; flex-shrink: 0; }
.s-mcp .mcp-fn .arg { color: rgba(236,238,241,.33); }

/* Datasets */
.mcp-datasets { display: flex; flex-direction: column; margin-top: 30px; }
.ds-item { display: flex; align-items: baseline; gap: 12px; padding: 9px 0; border-top: 1px solid rgba(236,238,241,.07); }
.ds-item::before { content: none; }
.ds-name { font-family: var(--f-display); font-size: 19px; font-weight: 400; color: #ECEEF1; }
.ds-desc { font-family: var(--f-mono); font-size: 12.5px; letter-spacing: .1em; color: rgba(236,238,241,.33); }

/* Slide 03 — make field labels readable: bigger, heavier, higher-contrast */
.fc-report .fc-k { font-size: 14px; font-weight: 500; letter-spacing: 0.1em; color: rgba(232,227,214,0.78); }

/* Slide 03 — mute the datasets list to grey (matches muted tools) */
.s-mcp .ds-name { color: rgba(232,227,214,0.5); }
.s-mcp .ds-desc { color: rgba(232,227,214,0.3); }
.s-mcp .ds-item::before { color: rgba(194,172,133,0.55); }

/* ============ Slide 04 — Architecture (ported from v3: question big, name small + dark glass) ============ */
.s4 .card-row-left h3   { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(232,227,214,0.45); margin: 0; }
.s4 .card-row-left .sub { font-family: var(--f-display); font-size: 32px; font-weight: 300; letter-spacing: -0.02em; color: #F2EEE3; order: -1; white-space: nowrap; }
.arch-v3 .cards.six .card { background: rgba(232,227,214,0.045); border-color: rgba(255,255,255,0.14); }
.arch-v3 .card-row-num { color: rgba(232,227,214,0.22); border-right-color: rgba(255,255,255,0.1); }
.arch-v3 .card-row-left { border-right-color: rgba(255,255,255,0.1); }
.arch-v3 .card-row-body { border-right-color: rgba(255,255,255,0.1); color: #B8B3A4; }
.arch-v3 .card-row-left h3 { color: rgba(232,227,214,0.4); }
.arch-v3 .card-row-left .sub { color: #F2EEE3; }
.arch-v3 .card-row-right li { color: #C8C3B5; }
.arch-v3 .card-row-right li::before { color: var(--c-sand); }

/* ============ Slide 04 — EXACT v3 card-row geometry (override refined base) ============ */
.s4 .cards.six { display: flex; flex-direction: column; gap: 16px; border: 0; background: transparent; }
.s4 .cards.six .card { flex: 1; display: grid; grid-template-columns: 120px 420px 580px 1fr; align-items: center; padding: 0; background: var(--c-paper-2); border: 1px solid var(--c-line); min-height: 0; }
.s4 .cards.six .card:last-child { border-bottom: 1px solid var(--c-line); }
.s4 .card-row-num { padding: 0 24px; height: 100%; display: flex; align-items: center; justify-content: center; border-right: 1px solid var(--c-line); font-family: var(--f-display); font-size: 80px; font-weight: 200; letter-spacing: -0.04em; color: var(--c-line-2); line-height: 1; }
.s4 .card-row-left { padding: 20px 32px; border-right: 1px solid var(--c-line); height: 100%; display: flex; flex-direction: column; justify-content: center; gap: 8px; }
.s4 .card-row-left h3 { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(232,227,214,0.45); margin: 0; }
.s4 .card-row-left .sub { font-family: var(--f-display); font-size: 32px; font-weight: 300; letter-spacing: -0.02em; color: #F2EEE3; order: -1; white-space: nowrap; }
.s4 .card-row-body { padding: 20px 36px; border-right: 1px solid var(--c-line); height: 100%; display: flex; align-items: center; font-family: var(--f-display); font-size: 18px; font-weight: 300; line-height: 1.6; color: var(--c-ink-2); }
.s4 .card-row-right { padding: 16px 28px; list-style: none; display: flex; flex-direction: column; justify-content: center; gap: 8px; height: 100%; }
.s4 .card-row-right li { font-family: var(--f-mono); font-size: 16px; letter-spacing: 0.04em; color: var(--c-ink-2); border: 0; padding: 0; display: flex; gap: 10px; line-height: 1.4; }
.s4 .card-row-right li::before { content: "→"; color: var(--c-stone); flex-shrink: 0; }
/* dark-glass overrides (re-stated last so they win) */
.arch-v3 .cards.six .card { background: rgba(232,227,214,0.045); border-color: rgba(255,255,255,0.14); }
.arch-v3 .card-row-num { color: rgba(232,227,214,0.22); border-right-color: rgba(255,255,255,0.1); }
.arch-v3 .card-row-left { border-right-color: rgba(255,255,255,0.1); }
.arch-v3 .card-row-body { border-right-color: rgba(255,255,255,0.1); color: #B8B3A4; }
.arch-v3 .card-row-left h3 { color: rgba(232,227,214,0.4); }
.arch-v3 .card-row-left .sub { color: #F2EEE3; }
.arch-v3 .card-row-right li { color: #C8C3B5; }
.arch-v3 .card-row-right li::before { color: var(--c-sand); }

/* Slide 04 — wider name column for the longer stage titles */
.arch-v3 .cards.six .card { grid-template-columns: 116px 460px 1fr 400px; }
.arch-v3 .card-row-left .sub { font-size: 30px; }

/* Slide 04 — bigger readable body/bullets + logo chips */
.arch-v3 .card-row-body { font-size: 21px; line-height: 1.5; }
.arch-v3 .card-row-right li { font-size: 17px; }
.arch-v3 .logo-row { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px; }
.logo-chip { width: 46px; height: 46px; border-radius: 9px; background: #fff; display: flex; align-items: center; justify-content: center; padding: 8px; flex-shrink: 0; }
.logo-chip img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.logo-tag { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.04em; color: #C8C3B5; line-height: 1.4; width: 100%; margin-top: 4px; }

/* ============ Slide 04 — 3-col (num | name | paragraph+tags), bigger text, true centering ============ */
.arch-v3 .cards.six .card { grid-template-columns: 120px 440px 1fr; align-items: stretch; }
.arch-v3 .card-row-num { display: flex; align-items: center; justify-content: center; height: 100%; }
.arch-v3 .card-row-left { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; height: 100%; }
.arch-v3 .card-row-body { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 14px; padding: 26px 44px; border-right: 0; height: 100%; }
.arch-v3 .rb-text { font-family: var(--f-display); font-weight: 300; font-size: 23px; line-height: 1.5; color: #C8C3B5; max-width: 1040px; }
.arch-v3 .rb-tags { display: flex; flex-wrap: wrap; gap: 9px 28px; }
.arch-v3 .rb-tags span { font-family: var(--f-mono); font-size: 17px; letter-spacing: 0.03em; color: rgba(232,227,214,0.62); display: flex; gap: 10px; align-items: baseline; }
.arch-v3 .rb-tags span::before { content: "→"; color: var(--c-sand); flex-shrink: 0; }

/* ============ Slide 05 — Competition heatmap (black squares variant) ============ */
.s8 .hm { margin: 30px 80px 0; }
.s8 .hm-row { display: grid; grid-template-columns: 300px repeat(5, 1fr); gap: 10px; align-items: center; }
.s8 .hm-head { margin-bottom: 12px; }
.s8 .hm-head .hl { font-family: var(--f-display); font-size: 14px; font-weight: 300; letter-spacing: 0; text-transform: none; color: var(--c-mute); text-align: center; line-height: 1.25; }
.s8 .hm-head .hl.lead { text-align: left; }
.s8 .hm-body .hm-row { padding: 16px 0; border-top: 1px solid var(--c-line); }
.s8 .hm-name { font-family: var(--f-display); font-size: 20px; color: var(--c-ink); letter-spacing: -0.01em; }
.s8 .hm-name .sub { display: block; font-family: var(--f-display); font-size: 14px; font-weight: 300; color: var(--c-mute); letter-spacing: 0; text-transform: none; margin-top: 4px; line-height: 1.3; }
.s8 .cell { height: 40px; border: 1px solid var(--c-line); background: transparent; border-radius: 2px; }
.s8 .cell.on { background: var(--c-ink); border-color: var(--c-ink); }
.s8 .cell.part { background: #CFCABE; border-color: #CFCABE; }
.s8 .hm-count { font-family: var(--f-mono); font-size: 15px; color: var(--c-mute); text-align: right; }
.s8 .hm-row.us { background: rgba(168,86,55,0.06); border-top: 1px solid var(--c-rust); }
.s8 .hm-row.us .hm-name { font-weight: 500; }
.s8 .hm-row.us .hm-name .sub { color: var(--c-rust); }
.s8 .hm-row.us .cell.on { background: var(--c-rust); border-color: var(--c-rust); }
.s8 .hm-row.us .hm-count { color: var(--c-rust); font-weight: 500; }
.s8 .footnote { margin: 26px 80px 0; font-size: 16px; color: var(--c-mute); line-height: 1.5; }

/* Slide 05 — competition legend key */
.s8 .hm-legend { display: flex; gap: 34px; margin: 22px 80px 0; align-items: center; }
.s8 .hm-legend .lg { display: flex; align-items: center; gap: 11px; font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.03em; color: var(--c-mute); }
.s8 .hm-legend .sw { width: 26px; height: 22px; border-radius: 2px; flex-shrink: 0; }
.s8 .hm-legend .sw-on { background: var(--c-ink); border: 1px solid var(--c-ink); }
.s8 .hm-legend .sw-part { background: #CFCABE; border: 1px solid #CFCABE; }
.s8 .hm-legend .sw-off { background: transparent; border: 1px solid var(--c-line); }

/* ============ 04b · Architecture — split / flywheel variant ============ */
.s-arch-split { padding: 0; display: grid; grid-template-columns: 5fr 7fr; background: var(--c-paper); overflow: hidden; }
/* left photo pane */
.s-arch-split .lpane { position: relative; overflow: hidden; }
.s-arch-split .lpane image-slot { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.s-arch-split .lpane .veil { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(18,26,31,0.42) 0%, rgba(18,26,31,0.10) 30%, rgba(18,26,31,0.18) 58%, rgba(18,26,31,0.62) 100%); }
.s-arch-split .lpane .l-inner { position: absolute; inset: 0; z-index: 3; padding: 76px 76px 124px; display: flex; flex-direction: column; color: #fff; }

/* ============ Line-art overlays (generated by line-art.js) ============
   A .la-host sits over each photo; the engine injects an <svg class="la"> with
   the active style. Shape styling is shared so all styles read consistently. */
.la-host { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.la-host .la { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.la .ln { fill: none; stroke: #fff; stroke-width: 1.4; stroke-opacity: 0.5; stroke-linecap: round; stroke-linejoin: round; }
.la .ln.faint { stroke-opacity: 0.26; }
.la .ln.tick { stroke-opacity: 0.6; }
.la .node { fill: none; stroke: #fff; stroke-width: 1.4; stroke-opacity: 0.62; }
.la .dot { fill: #fff; fill-opacity: 0.9; stroke: none; }
.la .glow { fill: #fff; fill-opacity: 0.10; stroke: none; }
.s-arch-split .l-eyebrow { font-family: var(--f-mono); font-size: 15px; letter-spacing: 0.26em; text-transform: uppercase; color: rgba(255,255,255,0.72); }
.s-arch-split .l-eyebrow .num { color: #fff; margin-right: 16px; }
.s-arch-split .lpane h2 { font-family: var(--f-display); font-weight: 300; font-size: 62px; line-height: 1.0; letter-spacing: -0.03em; margin: 0 0 16px; }
.s-arch-split .l-foot { margin-top: auto; max-width: 560px; }
.s-arch-split .l-foot .rule { width: 210px; height: 1px; background: rgba(255,255,255,0.55); margin-bottom: 24px; }
.s-arch-split .l-foot p { font-family: var(--f-display); font-weight: 300; font-size: 25px; line-height: 1.46; color: rgba(255,255,255,0.94); }
.s-arch-split .l-mark { position: absolute; left: 76px; bottom: 44px; z-index: 3; font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.24em; text-transform: uppercase; color: rgba(255,255,255,0.5); }
/* right list pane */
.s-arch-split .rpane { position: relative; background: var(--c-paper); padding: 56px 96px; display: flex; flex-direction: column; justify-content: center; }
.s-arch-split .r-label { font-family: var(--f-mono); font-size: 15px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--c-dim); }
.s-arch-split .flow { margin-top: 0; width: 100%; }
.s-arch-split .frow { display: grid; grid-template-columns: 178px 1fr; align-items: center; padding: 22px 0; border-top: 1px solid var(--c-line); }
.s-arch-split .frow:last-child { border-bottom: 1px solid var(--c-line); }
.s-arch-split .frow .fn { font-family: var(--f-display); font-weight: 600; font-size: 96px; letter-spacing: -0.03em; color: #CFCABE; }
.s-arch-split .frow .ft h3 { font-family: var(--f-display); font-weight: 400; font-size: 31px; letter-spacing: -0.018em; color: var(--c-ink); line-height: 1.05; }
.s-arch-split .frow .ft p { font-size: 21px; line-height: 1.4; color: var(--c-ink-2); margin-top: 8px; max-width: 560px; }
/* architecture descriptions: one line each (sentences were shortened) */
.s-arch-split .arch-index .frow .ft p { max-width: none; white-space: nowrap; }
/* sub-bullets as little pills */
.s-arch-split .arch-index .frow .ft .fsub { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.s-arch-split .arch-index .frow .ft .fsub span { background: rgba(12,14,13,0.045); border: 1px solid transparent; color: var(--c-mute); border-radius: 999px; padding: 4px 12px; font-size: 11.5px; letter-spacing: 0.01em; white-space: nowrap;}
.s-arch-split .arch-index .frow .ft .fsub span + span::before { content: none; margin: 0; }
.s-arch-split .frow .ft .fsub { margin-top: 9px; }
.s-arch-split .frow .ft .fsub span { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.02em; color: var(--c-dim); }
.s-arch-split .frow .ft .fsub span + span::before { content: "·"; margin: 0 11px; color: var(--c-faint); }
.s-arch-split .frow .fa { font-family: var(--f-mono); font-size: 19px; color: var(--c-faint); text-align: right; align-self: center; }

/* ============================================================================
   Architecture slide — switchable styles (bottom-left widget):
   numbers · timeline · flow · cascade · index.
   Each row has a .fn number, a .fnode dot, and an .ft text block carrying a
   data-stage label (used for eyebrows). The active mode shows the right marker.
   ============================================================================ */

/* --- shared: hide the marker the active mode doesn't use --- */
.s-arch-split .arch-timeline .fn,
.s-arch-split .arch-flow .fn,
.s-arch-split .arch-cascade .fn { display: none; }
.s-arch-split .arch-numbers .fnode,
.s-arch-split .arch-index .fnode,
.s-arch-split .arch-cascade .fnode { display: none; }

/* ---- MODE: NUMBERS (original) — uses the base .frow / .fn rules above ---- */

/* ---- shared rail scaffold for TIMELINE + FLOW ---- */
.s-arch-split .arch-timeline .frow,
.s-arch-split .arch-flow .frow { grid-template-columns: 58px 1fr; align-items: stretch; padding: 0; border: 0; position: relative; }
.s-arch-split .arch-timeline .ft,
.s-arch-split .arch-flow .ft { padding: 26px 0; border-top: 1px solid var(--c-line); }
.s-arch-split .arch-timeline .frow:last-child .ft,
.s-arch-split .arch-flow .frow:last-child .ft { border-bottom: 1px solid var(--c-line); }
.s-arch-split .arch-timeline .frow::before,
.s-arch-split .arch-flow .frow::before {
  content: ""; position: absolute; top: 0; bottom: 0; left: 18px; width: 2px;
  background: var(--c-line-2); z-index: 0;
}
.s-arch-split .arch-timeline .frow:first-child::before,
.s-arch-split .arch-flow .frow:first-child::before { top: 50%; }
.s-arch-split .arch-timeline .frow:last-child::before,
.s-arch-split .arch-flow .frow:last-child::before { bottom: 50%; }
.s-arch-split .arch-timeline .fnode,
.s-arch-split .arch-flow .fnode { position: relative; }
.s-arch-split .arch-timeline .fnode .dot,
.s-arch-split .arch-flow .fnode .dot {
  position: absolute; top: 50%; left: 18px; transform: translate(-50%, -50%); z-index: 1;
  width: 13px; height: 13px; border-radius: 50%;
  background: var(--c-paper); border: 2px solid var(--c-line-2);
  box-shadow: 0 0 0 5px var(--c-paper);
}

/* ---- MODE: TIMELINE (the keeper) — hollow gray dots, final solid ---- */
.s-arch-split .arch-timeline .frow:last-child .fnode .dot {
  background: var(--c-dim); border-color: var(--c-dim);
  box-shadow: 0 0 0 5px var(--c-paper), 0 0 0 9px rgba(128,125,114,0.16);
}

/* ---- MODE: FLOW — gradient rail + tonal node progression + stage eyebrows ----
   Design idea: the pipeline refines raw signal into a hardened decision, so the
   rail darkens top→bottom and each node fills in further — value made visible. */
.s-arch-split .arch-flow .frow::before {
  background: linear-gradient(180deg, var(--c-line) 0%, var(--c-line-2) 45%, var(--c-dim) 100%);
}
.s-arch-split .arch-flow .ft::before {
  content: attr(data-stage); display: block; font-family: var(--f-mono);
  font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--c-faint); margin-bottom: 10px;
}
.s-arch-split .arch-flow .ft h3 { font-weight: 400; }
/* progressive node fill: hollow-faint → solid-ink */
.s-arch-split .arch-flow .frow:nth-child(1) .dot { border-color: var(--c-faint); }
.s-arch-split .arch-flow .frow:nth-child(2) .dot { border-color: var(--c-line-2); }
.s-arch-split .arch-flow .frow:nth-child(3) .dot { border-color: var(--c-dim); }
.s-arch-split .arch-flow .frow:nth-child(4) .dot { border-color: var(--c-dim); background: var(--c-dim); }
.s-arch-split .arch-flow .frow:nth-child(5) .dot {
  width: 15px; height: 15px; border-color: var(--c-ink); background: var(--c-ink);
  box-shadow: 0 0 0 5px var(--c-paper), 0 0 0 9px rgba(10,12,14,0.10);
}
.s-arch-split .arch-flow .frow:nth-child(5) .ft::before { color: var(--c-mute); }

/* ---- MODE: CASCADE — a stepped waterfall (on-brand for Cascadian) ----
   One continuous path: each stage's left edge drops, then an elbow steps right
   into the next stage. No margin gaps, so the vertical runs read as unbroken
   water; spacing comes from padding. The descent darkens toward the decision. */
.s-arch-split .arch-cascade .flow { padding: 6px 0; }
.s-arch-split .arch-cascade .frow { grid-template-columns: 1fr; padding: 0; border: 0; position: relative; }
.s-arch-split .arch-cascade .ft {
  position: relative; border-left: 2px solid var(--c-line-2);
  padding: 6px 0 34px 28px;          /* bottom padding = vertical air, keeps the path unbroken */
}
.s-arch-split .arch-cascade .frow:last-child .ft { padding-bottom: 8px; }
/* progressive rightward indent — the cascade steps */
.s-arch-split .arch-cascade .frow:nth-child(2) .ft { margin-left: 40px; }
.s-arch-split .arch-cascade .frow:nth-child(3) .ft { margin-left: 80px; }
.s-arch-split .arch-cascade .frow:nth-child(4) .ft { margin-left: 120px; }
.s-arch-split .arch-cascade .frow:nth-child(5) .ft { margin-left: 160px; }
/* elbow bridging the previous step's drop into this step (meets the vertical exactly) */
.s-arch-split .arch-cascade .frow:not(:first-child) .ft::before {
  content: ""; position: absolute; left: -40px; top: -2px; width: 42px; height: 2px;
  background: var(--c-line-2);
}
/* node seated at each elbow — hollow ring, paper halo masks the line behind it */
.s-arch-split .arch-cascade .ft::after {
  content: ""; position: absolute; left: -1px; top: -1px; transform: translate(-50%, -50%);
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--c-paper); border: 2px solid var(--c-dim);
  box-shadow: 0 0 0 5px var(--c-paper); z-index: 2;
}
.s-arch-split .arch-cascade .ft h3 { font-weight: 400; margin-top: -5px; }
.s-arch-split .arch-cascade .ft .fsub span { font-size: 14px; color: var(--c-mute); }
/* tonal descent: rail + elbows + nodes deepen toward the decision */
.s-arch-split .arch-cascade .frow:nth-child(1) .ft { border-left-color: var(--c-line); }
.s-arch-split .arch-cascade .frow:nth-child(2) .ft { border-left-color: var(--c-line-2); }
.s-arch-split .arch-cascade .frow:nth-child(4) .ft { border-left-color: var(--c-dim); }
.s-arch-split .arch-cascade .frow:last-child .ft { border-left-color: var(--c-ink); }
.s-arch-split .arch-cascade .frow:last-child .ft::after {
  border-color: var(--c-ink); background: var(--c-ink); width: 14px; height: 14px;
  box-shadow: 0 0 0 5px var(--c-paper), 0 0 0 9px rgba(10,12,14,0.10);
}

/* ---- MODE: INDEX — editorial: oversized ultra-thin numerals, generous rhythm ---- */
.s-arch-split .arch-index .frow {
  grid-template-columns: 138px 1fr; align-items: start;
  padding: 30px 0; border: 0; border-top: 1px solid var(--c-line);
}
/* dividers sit only BETWEEN stages — no rule above the first or below the last */
.s-arch-split .arch-index .frow:first-child { border-top: 0; }
.s-arch-split .arch-index .fn {
  font-family: var(--f-display); font-weight: 200; font-size: 76px; line-height: 0.9;
  letter-spacing: -0.03em; color: var(--c-line-2);
}
/* stepped gradient down the numbers: light (01) -> dark forest-stone (05) */
.s-arch-split .arch-index .frow:nth-child(1) .fn { color: #C9C4B7; }
.s-arch-split .arch-index .frow:nth-child(2) .fn { color: #A5A497; }
.s-arch-split .arch-index .frow:nth-child(3) .fn { color: #818576; }
.s-arch-split .arch-index .frow:nth-child(4) .fn { color: #5E6556; }
.s-arch-split .arch-index .frow:nth-child(5) .fn { color: #3A4636; }
.s-arch-split .arch-index .ft { padding-top: 6px; }
.s-arch-split .arch-index .ft h3 { font-weight: 300; }
/* larger, higher-contrast component tags — easier to read */
.s-arch-split .arch-index .ft .fsub { margin-top: 13px; }
.s-arch-split .arch-index .ft .fsub span { font-size: 14px; color: var(--c-mute); }

/* ============ 05b Competition (new design — comparison only, zero overrides) ============ */
.s5-new { background: #FFFFFF; color: #15171A; display: grid; grid-template-rows: 270px auto 1fr; font-family: var(--f-display); }
.s5-new .band { position: relative; overflow: hidden; }
.s5-new .band image-slot { width: 100%; height: 100%; }
/* brand rule over the band photo — matches the Problem slide; soft shadow keeps it legible on the bright waterfall */
.s5-new .band .band-rule { position: absolute; left: 80px; bottom: 36px; width: 210px; height: 1px; background: rgba(255,255,255,0.55); box-shadow: 0 1px 2px rgba(0,0,0,0.35); z-index: 3; }
.s5-new .lockup img { filter: invert(1) brightness(1.1); }
.s5-new .band .veil { display: none; }
.s5n-head { padding: 36px 80px 0; }
.s5n-body { padding: 0 80px 80px; overflow: hidden; }
.s5n-title { font-family: var(--f-display); font-size: 76px; font-weight: 300; letter-spacing: -0.035em; line-height: 0.95; color: #15171A; }
.s5n-lede { font-family: var(--f-display); font-weight: 300; font-size: 22px; line-height: 1.3; color: #565C63; margin: 16px 0 0; max-width: 74ch; text-wrap: balance; }
.s5n-legend { display: flex; gap: 34px; margin-top: 24px; }
.s5n-legend span { display: flex; align-items: center; gap: 10px; font-family: var(--f-mono); font-size: 13.5px; letter-spacing: .08em; color: #565C63; white-space: nowrap; }
.s5n-legend-bot { position: absolute; left: 80px; bottom: 48px; display: flex; gap: 34px; z-index: 10; }
.s5n-legend-bot span { display: flex; align-items: center; gap: 10px; font-family: var(--f-display); font-weight: 300; font-size: 16px; color: #565C63; white-space: nowrap; }
.s5n-sw { display: inline-block; width: 24px; height: 14px; border-radius: 2px; }
.s5n-sw-full { background: #EAE9E5; }
.s5n-sw-none { background: transparent; border: 1px solid rgba(21,23,26,.12); }
.s5n-table { width: 100%; border-collapse: collapse; margin-top: 28px; table-layout: fixed; }
.s5n-table thead th { font-family: var(--f-display); font-size: 18px; font-weight: 300; letter-spacing: 0; text-transform: none; color: #565C63; text-align: center; padding: 0 0 16px; vertical-align: bottom; white-space: nowrap; }
.s5n-table thead th.s5n-cap { text-align: left; width: 420px; }
.s5n-table tbody td { padding: 20px 7px; border-top: 1px solid rgba(21,23,26,.12); }
.s5n-rowname { font-size: 24px; color: #15171A; letter-spacing: -.01em; }
.s5n-rowsub { font-family: var(--f-display); font-size: 15px; font-weight: 300; color: #565C63; margin-top: 4px; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.s5n-capcell { width: 420px; }
.s5n-cell { height: 34px; border-radius: 3px; border: 1px solid rgba(21,23,26,.12); }
.s5n-cell.s5n-full { background: #EAE9E5; border-color: #EAE9E5; }
.s5n-cov { font-family: var(--f-mono); font-size: 16px; letter-spacing: .08em; color: #565C63; text-align: right; width: 86px; }
.s5n-us td { border-top: 1.5px solid #C2AC85; }
.s5n-us td, .s5n-us .s5n-capcell { background: rgba(194,172,133,.12); }
.s5n-us .s5n-rowname { font-weight: 500; }
.s5n-us .s5n-cell.s5n-full { background: #D8D0C2; border-color: #D8D0C2; }
/* 3-level competitive-strength shading (S07 competition matrix) */
.s5n-cell.lvl-1 { background: #ECEBE7; border-color: #ECEBE7; }
.s5n-cell.lvl-2 { background: #D2D0C8; border-color: #D2D0C8; }
.s5n-cell.lvl-3 { background: #ADA899; border-color: #ADA899; }
.s5n-us .s5n-cell.lvl-1 { background: #E7DECB; border-color: #E7DECB; }
.s5n-us .s5n-cell.lvl-2 { background: #D2C09C; border-color: #D2C09C; }
.s5n-us .s5n-cell.lvl-3 { background: #C2AC85; border-color: #C2AC85; }
/* S07 competition: fill the slide body so the matrix has no bottom gap */
.s5-fill .s5n-body { display: flex; flex-direction: column; justify-content: center; padding-top: 12px; padding-bottom: 92px; }
.s5-fill .s5n-table { margin-top: 0; }
.s5-fill .s5n-table thead th { padding-bottom: 24px; }
.s5-fill .s5n-table tbody td { padding: 38px 7px; }
.s5-fill .s5n-cell { height: 56px; }
.s5n-cov-us { color: #B4502E; font-weight: 600; }
.s5n-foot { position: absolute; right: 92px; bottom: 64px; font-family: var(--f-display); font-weight: 600; font-size: 21px; letter-spacing: .01em; display: flex; align-items: baseline; gap: 8px; color: #15171A; }
.s5n-tot { font-family: var(--f-mono); font-weight: 400; font-size: 13px; letter-spacing: .14em; opacity: .42; }

/* ============ NEW MARKET + BIZ MODEL LIGHT SLIDES (S6A · S6B · S7A · S7B) ============ */
.sln { background:#FCFCFB; color:#1A1714; font-family:var(--f-display); padding:92px 104px; display:flex; flex-direction:column; }
.sln-chrome { display:flex; justify-content:space-between; align-items:flex-start; }
.sln-logo { display:flex; align-items:center; gap:16px; color:#1A1714; }
.sln-logo svg { width:34px; height:29px; flex-shrink:0; }
.sln-logo span { font-family:var(--f-display); font-weight:600; font-size:27px; letter-spacing:.30em; line-height:1; }
.sln-eyebrow { font-family:var(--f-mono); font-size:14px; letter-spacing:.16em; text-transform:uppercase; color:#9A968D; display:flex; align-items:center; gap:10px; }
.sln-eyebrow .sln-idx { color:#1A1714; font-weight:600; }
.sln-h2 { font-family:var(--f-display); font-weight:300; font-size:76px; line-height:0.95; letter-spacing:-.035em; margin:24px 0 0; color:#1A1714; }
.sln-h2 .soft { color:#585650; }
/* brand rule above the headline — soft dark hairline for the light Market / Business slides */
.sln .sln-h2::before { content:""; display:block; width:210px; height:1px; background:rgba(20,18,15,0.16); margin-bottom:22px; }
.sln-lede { margin:18px 0 0; max-width:1300px; font-size:25px; line-height:1.34; color:#585650; font-family:var(--f-display); font-weight:300; }
.sln-pageno { position:absolute; bottom:64px; right:104px; font-family:var(--f-display); font-weight:600; font-size:21px; display:flex; align-items:baseline; gap:8px; color:#1A1714; }
.sln-pageno span { font-family:var(--f-mono); font-weight:400; font-size:13px; opacity:.42; }

/* S6A — split-bar columns */
.s6a-labels { display:grid; grid-template-columns:repeat(3,1fr); gap:56px; margin-top:16px; }
.s6a-bar-zone { display:flex; align-items:flex-end; gap:56px; margin-top:28px; border-top:1px solid rgba(20,18,15,.16); padding-top:26px; }
.s6a-col-wrap { display:flex; flex-direction:column; justify-content:flex-end; align-self:flex-end; }
.s6a-tags { display:grid; grid-template-columns:repeat(3,1fr); gap:56px; margin-top:12px; }
.s6a-legend { display:flex; gap:28px; margin-top:10px; }
.s6a-legend span { display:flex; align-items:center; gap:8px; font-family:var(--f-mono); font-size:12px; color:#9A968D; white-space:nowrap; }
.s6a-sw { display:inline-block; width:20px; height:12px; border-radius:2px; }
.s6a-sw-gold { background:#B4502E; }
/* 06b split-bar slide — rust accent instead of gold */
[data-screen-label="06b Market (Split bars)"] .s6a-bar-agent { background:#CD6038; }
[data-screen-label="06b Market (Split bars)"] .s6a-sw-gold { background:#CD6038; }
[data-screen-label="06b Market (Split bars)"] .s6a-bnum { color:#fff; }
[data-screen-label="06b Market (Split bars)"] .s6a-detail b { color:#CD6038; }
.s6a-sw-human { background:#D4D3CE; }
.s6a-details { display:grid; grid-template-columns:repeat(3,1fr); gap:56px; margin-top:18px; }
.s6a-footer { font-family:var(--f-display); font-weight:300; font-size:16px; line-height:1.45; color:#9A968D; margin-top:18px; padding-top:16px; border-top:1px solid rgba(20,18,15,.11); grid-column:1/-1; }
/* legacy col kept for fallback */
.s6a-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:56px; margin-top:46px; flex:1; }
.s6a-col { display:flex; flex-direction:column; }
.s6a-tag { font-family:var(--f-display); font-weight:400; font-size:16px; letter-spacing:0; color:#8A857B; margin-top:18px; }
.s6a-val { font-family:var(--f-display); font-weight:500; font-size:52px; color:#1A1714; margin:0 0 18px; line-height:1; display:flex; align-items:baseline; gap:14px; }
.s6a-acro { font-family:var(--f-display); font-weight:600; font-size:28px; letter-spacing:.02em; color:#9A968D; }
.s6a-acro.hot { color:#B4502E; }
.s6a-bar { border-radius:4px; overflow:hidden; border:1px solid rgba(20,18,15,.11); display:flex; flex-direction:column; }
.s6a-bar-agent { background:#EAE9E5; padding:9px 16px; display:flex; flex-direction:column; justify-content:flex-start; border-bottom:1px solid rgba(20,18,15,.10); }
.s6a-bar-human { background:#D8D0C2; padding:9px 16px; display:flex; flex-direction:column; justify-content:flex-end; }
.s6a-blbl { font-family:var(--f-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#9A968D; }
.s6a-blbl.h { color:#7A7468; }
.s6a-bnum { font-family:var(--f-display); font-weight:500; font-size:24px; color:#1A1714; margin-top:1px; }
.s6a-bnum.h { color:#1A1714; }
.s6a-detail { margin:0; font-size:18px; line-height:1.45; color:#585650; font-family:var(--f-display); font-weight:300; }
.s6a-detail b { display:block; color:#1A1714; font-weight:500; margin-bottom:3px; }
.s6a-src { margin-top:auto; padding-top:18px; font-family:var(--f-mono); font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:#9A968D; }

/* S6B — nested blocks */
.s6b-grid { display:grid; grid-template-columns:720px 1fr; gap:90px; margin-top:44px; flex:1; align-items:center; }
.s6b-blocks { position:relative; height:470px; }
.s6b-tam { position:absolute; inset:0; border-radius:10px; background:#EAE9E5; border:1px solid rgba(20,18,15,.11); padding:22px 26px; }
.s6b-sam { position:absolute; left:199px; right:199px; top:100px; bottom:160px; border-radius:10px; background:#F3F2EE; border:1px solid rgba(20,18,15,.11); padding:22px 26px; }
.s6b-som { position:absolute; left:260px; right:260px; top:175px; bottom:195px; border-radius:10px; background:#B4502E; padding:22px 26px; display:flex; flex-direction:column; justify-content:center; }
.s6b-blbl { font-family:var(--f-mono); font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; color:#9A968D; }
.s6b-som .s6b-blbl { color:rgba(255,255,255,.8); }
.s6b-bval { font-family:var(--f-display); font-weight:500; font-size:40px; color:#1A1714; margin-top:2px; }
.s6b-sam .s6b-bval { font-size:36px; }
.s6b-som .s6b-bval { font-size:34px; color:#fff; }
.s6b-detail { display:flex; flex-direction:column; gap:26px; }
.s6b-row { border-top:1px solid rgba(20,18,15,.11); padding-top:18px; }
.s6b-rowtop { display:flex; align-items:baseline; gap:16px; }
.s6b-tier { font-family:var(--f-mono); font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:#9A968D; }
.s6b-tier.som { color:#8C5E29; }
.s6b-rval { font-family:var(--f-display); font-weight:500; font-size:26px; color:#1A1714; }
.s6b-rtag { font-family:var(--f-mono); font-size:12.5px; letter-spacing:.05em; text-transform:uppercase; color:#9A968D; }
.s6b-rdesc { margin:8px 0 0; font-size:16.5px; line-height:1.46; color:#585650; font-family:var(--f-display); font-weight:300; }
.s6b-rdesc b { color:#1A1714; font-weight:500; }

/* S7 shared */
.s7n-h2 { font-family:var(--f-display); font-weight:600; font-size:58px; line-height:1.05; letter-spacing:-.008em; margin:40px 0 0; color:#1A1714; }
.s7n-lede { margin:14px 0 0; max-width:1180px; font-size:25px; line-height:1.34; color:#585650; font-family:var(--f-display); font-weight:300; }
.s7n-chart-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; padding-right:6.4%; }
.s7n-chart-lbl { font-family:var(--f-mono); font-size:14px; letter-spacing:.16em; text-transform:uppercase; color:#9A968D; }
.s7n-legend { display:flex; gap:22px; }
.s7n-leg { display:flex; align-items:center; gap:8px; font-family:var(--f-mono); font-size:13px; color:#585650; }
.s7n-leg i { width:20px; height:3px; border-radius:2px; display:inline-block; flex-shrink:0; }

/* S7A — tiers + chart */
.s7a-grid { flex:1; display:grid; grid-template-columns:620px 1fr; gap:80px; margin-top:28px; border-top:1px solid rgba(20,18,15,.16); padding-top:72px; }
.s7a-tiers { display:flex; flex-direction:column; gap:14px; justify-content:flex-start; }
/* Solid plan cards — uniform fill, no per-tier highlight.
   name + price on top, hairline rule, description below. */
.s7a-tier { display:flex; flex-direction:column; gap:9px; padding:15px 26px; border-radius:8px; background:#EAE9E5; }
.s7a-tier-left { display:flex; align-items:baseline; justify-content:space-between; gap:18px; }
.s7a-tier-name { font-family:var(--f-display); font-size:27px; font-weight:600; letter-spacing:-.01em; text-transform:none; color:#1A1714; line-height:1; }
.s7a-tier-price { display:flex; align-items:baseline; gap:4px; }
.s7a-price-val { font-family:var(--f-display); font-weight:500; color:#1A1714; }
.s7a-price-unit { font-family:var(--f-mono); font-size:15px; color:#857F74; }
.s7a-divider { width:100%; height:1px; background:rgba(20,18,15,.13); }
.s7a-tier-desc { margin:0; font-size:17px; color:#5A574F; line-height:1.4; font-family:var(--f-display); font-weight:300; }
.s7a-chart-side { display:flex; flex-direction:column; justify-content:flex-start; }
.s7a-footnote { margin:22px 0 0; font-size:20px; color:#585650; line-height:1.5; font-family:var(--f-display); font-weight:300; letter-spacing:.004em; max-width:none; }
.s7a-footnote b { color:#1A1714; font-weight:500; }

/* S7B — chart hero */
.s7b-inner { flex:1; display:flex; flex-direction:column; margin-top:26px; }
.s7b-main { flex:1; display:grid; grid-template-columns:1fr 360px; gap:64px; align-items:center; }
.s7b-callout-val { font-family:var(--f-display); font-weight:500; font-size:64px; color:#1A1714; line-height:1; }
.s7b-callout-sub { font-size:20px; color:#585650; line-height:1.4; margin-top:10px; font-family:var(--f-display); font-weight:300; }
.s7b-callout-div { height:1px; background:rgba(20,18,15,.11); margin:16px 0; }
.s7b-callout-note { font-size:17px; color:#585650; line-height:1.45; font-family:var(--f-display); font-weight:300; }
.s7b-callout-note b { color:#8C5E29; font-weight:500; }
.s7b-tier-row { display:flex; gap:18px; margin-top:28px; margin-bottom:30px; }
.s7b-card { background:#EAE9E5; border:1px solid rgba(20,18,15,.11); border-radius:8px; padding:24px 26px; display:flex; flex-direction:column; gap:10px; flex:1; }
.s7b-card.hl { background:rgba(180,80,46,.08); border-color:rgba(180,80,46,.4); }
.s7b-card-name { font-family:var(--f-mono); font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:#9A968D; }
.s7b-card.hl .s7b-card-name { color:#8C5E29; }
.s7b-card-price { font-family:var(--f-display); font-weight:500; font-size:42px; color:#1A1714; display:flex; align-items:baseline; gap:4px; }
.s7b-card-price.sm { font-size:30px; }
.s7b-card-unit { font-family:var(--f-mono); font-size:15px; color:#9A968D; }
.s7b-card-desc { margin:0; font-size:16px; color:#585650; line-height:1.4; font-family:var(--f-display); font-weight:300; }

/* =====================================================================
   03 · SOLUTION — one slide, toggleable views (cockpit v4 is the default):
     • .sol-cockpit4 — cockpit v4 (prediction-market graph → causal → answer) · DEFAULT
     • .sol-agent    — agent / MCP (original) · select via .show-agent
     • .sol-cockpit  — cockpit v1 (report panel beside the chat)
     • .sol-cockpit2 — cockpit v2 (report embedded in Claude's answer, MCP tools right)
     • .sol-cockpit3 — cockpit v3 (agent-MCP frame)
   Default is cockpit v4 with no class; .show-agent / .show-cockpit / .show-cockpit2 /
   .show-cockpit3 on .s-mcp switch away from it (variant-switcher widget).
   Same gpu-export-controls forecast throughout so the views read as one product.
   ===================================================================== */
.s-mcp.sol-host { grid-template-rows: 1fr; gap: 0; }
.sol-stage { min-height: 0; }
.sol-agent { display: none; grid-template-rows: auto 1fr; gap: 44px; min-height: 0; }
.sol-cockpit, .sol-cockpit2, .sol-cockpit3 { display: none; grid-template-rows: auto 1fr; gap: 34px; min-height: 0; }
.sol-cockpit4 { display: grid; grid-template-rows: auto 1fr; gap: 34px; min-height: 0; } /* cockpit v4 — default view */
/* explicit switches override the cockpit-v4 default */
.s-mcp.show-agent .sol-cockpit4, .s-mcp.show-cockpit .sol-cockpit4, .s-mcp.show-cockpit2 .sol-cockpit4, .s-mcp.show-cockpit3 .sol-cockpit4 { display: none; }
.s-mcp.show-agent .sol-agent { display: grid; }
.s-mcp.show-cockpit .sol-cockpit { display: grid; }
.s-mcp.show-cockpit2 .sol-cockpit2 { display: grid; }
.s-mcp.show-cockpit3 .sol-cockpit3 { display: grid; }
.s-mcp.show-cockpit4 .sol-cockpit4 { display: grid; }
.sol-cockpit .head, .sol-cockpit2 .head, .sol-cockpit3 .head, .sol-cockpit4 .head { max-width: 1500px; }
.sol-cockpit h2.display { color: #F2EEE3; margin-top: 16px; }
.sol-cockpit .lede { color: #C8C3B5; margin-top: 18px; font-size: 24px; max-width: 1180px; }
.sol-cockpit .lede .hl, .sol-cockpit2 .lede .hl { color: #F2EEE3; }

/* App window shell ---------------------------------------------------- */
.ck-window { display: grid; grid-template-rows: auto 1fr; background: #101216; border: 1px solid rgba(236,238,241,.14); border-radius: 9px; overflow: hidden; box-shadow: 0 30px 80px -30px rgba(0,0,0,.7); min-height: 0; }
.ck-topbar { display: flex; align-items: center; gap: 16px; padding: 13px 20px; background: #16191E; border-bottom: 1px solid rgba(236,238,241,.08); }
.ck-dots { display: flex; gap: 7px; }
.ck-dots i { width: 10px; height: 10px; border-radius: 50%; background: rgba(236,238,241,.16); }
.ck-title { font-family: var(--f-mono); font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: rgba(236,238,241,.5); }
.ck-title b { color: rgba(236,238,241,.82); font-weight: 500; }
.ck-status { margin-left: auto; display: flex; align-items: center; gap: 9px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: rgba(236,238,241,.42); }
.ck-status .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--c-good); box-shadow: 0 0 0 3px rgba(79,125,93,.18); }

.ck-body { display: grid; grid-template-columns: 0.92fr 1.34fr; min-height: 0; }

/* Left — conversation ------------------------------------------------- */
.ck-chat { display: flex; flex-direction: column; gap: 18px; padding: 30px 30px 24px; border-right: 1px solid rgba(236,238,241,.08); overflow: hidden; }
.ck-msg-user { align-self: flex-end; max-width: 90%; background: #1E2228; border: 1px solid rgba(236,238,241,.1); border-radius: 13px 13px 4px 13px; padding: 14px 17px; font-family: var(--f-display); font-weight: 300; font-size: 19px; line-height: 1.45; color: #E9EBEE; }
.ck-turn { display: flex; gap: 13px; }
.ck-avatar { flex-shrink: 0; width: 30px; height: 30px; border-radius: 7px; background: rgba(205,96,56,.14); border: 1px solid rgba(205,96,56,.4); display: flex; align-items: center; justify-content: center; color: #CD6038; font-family: var(--f-mono); font-size: 16px; }
.ck-assist { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.ck-who { font-family: var(--f-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: rgba(236,238,241,.42); }
.ck-tool { display: inline-flex; align-self: flex-start; align-items: center; gap: 9px; padding: 7px 12px; background: #0B0C0E; border: 1px solid rgba(236,238,241,.12); border-radius: 6px; font-family: var(--f-mono); font-size: 13px; color: rgba(236,238,241,.6); }
.ck-tool .fn { color: #CD6038; }
.ck-tool .tick { color: var(--c-good); font-size: 13px; }
.ck-answer { font-family: var(--f-display); font-weight: 300; font-size: 19.5px; line-height: 1.52; color: rgba(236,238,241,.78); }
.ck-answer .hl { color: #F2EEE3; font-weight: 500; }
.ck-answer .acc { color: #CD6038; font-weight: 500; }
.ck-cite { margin-top: 2px; display: flex; align-items: center; gap: 8px; font-family: var(--f-mono); font-size: 13px; color: rgba(236,238,241,.4); }
.ck-cite .arrow { color: #CD6038; }
.ck-input { margin-top: auto; display: flex; align-items: center; gap: 12px; padding: 13px 16px; background: #0E1013; border: 1px solid rgba(236,238,241,.12); border-radius: 10px; font-family: var(--f-display); font-weight: 300; font-size: 16px; color: rgba(236,238,241,.34); }
.ck-input .send { margin-left: auto; color: rgba(236,238,241,.3); font-family: var(--f-mono); font-size: 15px; }

/* Right — generated report artifact ---------------------------------- */
.ck-report { background: #15181C; padding: 24px 32px 22px; display: flex; flex-direction: column; gap: 12px; overflow: hidden; }
.ck-rhead { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.ck-eyebrow { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .18em; text-transform: uppercase; color: rgba(236,238,241,.4); margin-bottom: 7px; }
.ck-rtitle { font-family: var(--f-display); font-weight: 400; font-size: 23px; line-height: 1.18; color: #F2EEE3; }
.ck-stamp { text-align: right; font-family: var(--f-mono); font-size: 11.5px; line-height: 1.7; color: rgba(236,238,241,.38); white-space: nowrap; }

/* Headline odds + trajectory chart */
.ck-oddsrow { display: grid; grid-template-columns: auto 1fr; gap: 30px; align-items: center; padding: 2px 0; }
.ck-bignum { display: flex; align-items: baseline; gap: 10px; }
.ck-bignum .from { font-family: var(--f-mono); font-size: 24px; color: rgba(236,238,241,.34); }
.ck-bignum .arrow { color: rgba(236,238,241,.34); font-size: 20px; }
.ck-bignum .to { font-family: var(--f-display); font-weight: 500; font-size: 54px; line-height: .9; color: #CD6038; letter-spacing: -.02em; }
.ck-bignum .lift { font-family: var(--f-mono); font-size: 13px; letter-spacing: .04em; color: var(--c-good); align-self: flex-end; padding-bottom: 6px; }
.ck-chart { width: 100%; height: 94px; }
.ck-chart svg { width: 100%; height: 100%; display: block; }
.ck-xlabels { display: flex; justify-content: space-between; font-family: var(--f-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: rgba(236,238,241,.32); margin-top: 4px; }

.ck-div { height: 1px; background: rgba(236,238,241,.08); }

/* Lower analysis row: market-vs-calibrated | causal drivers */
.ck-split2 { display: grid; grid-template-columns: 1fr 1fr; gap: 34px; }
.ck-panel-label { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: rgba(236,238,241,.4); margin-bottom: 13px; }

/* market-vs-calibrated bars */
.ck-bar { display: grid; grid-template-columns: 1fr 44px; align-items: center; gap: 12px; margin-bottom: 13px; }
.ck-bar .lbl { font-family: var(--f-mono); font-size: 12px; letter-spacing: .02em; color: rgba(236,238,241,.55); margin-bottom: 7px; grid-column: 1 / -1; }
.ck-bar .track { height: 10px; background: rgba(236,238,241,.07); border-radius: 5px; overflow: hidden; }
.ck-bar .fill { height: 100%; border-radius: 5px; }
.ck-bar .fill.market { background: rgba(236,238,241,.32); }
.ck-bar .fill.cal { background: #CD6038; }
.ck-bar .pct { font-family: var(--f-mono); font-size: 16px; text-align: right; color: #ECEEF1; }
.ck-bar.is-market .pct { color: rgba(236,238,241,.55); }
.ck-edge { font-family: var(--f-mono); font-size: 12.5px; line-height: 1.5; color: var(--c-good); }
.ck-edge b { color: var(--c-good); font-weight: 500; }
.ck-edge span { color: rgba(236,238,241,.42); }

/* causal drivers */
.ck-drivers { display: flex; flex-direction: column; gap: 13px; }
.ck-drv { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 14px; }
.ck-drv .dn { font-family: var(--f-display); font-weight: 300; font-size: 15.5px; color: rgba(236,238,241,.72); }
.ck-drv .dv { display: flex; align-items: center; gap: 10px; }
.ck-drv .dbar { width: 84px; height: 6px; background: rgba(236,238,241,.07); border-radius: 4px; overflow: hidden; }
.ck-drv .dbar i { display: block; height: 100%; background: rgba(205,96,56,.7); border-radius: 4px; }
.ck-drv .dpt { font-family: var(--f-mono); font-size: 13px; color: rgba(236,238,241,.5); width: 36px; text-align: right; }

/* Recommendation strip + ledger foot */
.ck-rec { display: flex; align-items: center; gap: 16px; padding: 14px 18px; background: rgba(205,96,56,.06); border: 1px solid rgba(205,96,56,.28); border-radius: 7px; }
.ck-rec .tag { font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: #CD6038; flex-shrink: 0; }
.ck-rec .txt { font-family: var(--f-display); font-weight: 300; font-size: 18px; line-height: 1.4; color: #ECEEF1; }
.ck-rec .txt b { font-weight: 500; }
.ck-foot { display: flex; align-items: center; gap: 14px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .04em; color: rgba(236,238,241,.42); }
.ck-foot .chip { padding: 5px 10px; border: 1px solid rgba(236,238,241,.14); border-radius: 4px; color: rgba(236,238,241,.5); }
.ck-foot .chip b { color: var(--c-good); font-weight: 500; }

/* =====================================================================
   COCKPIT v2 (.sol-cockpit2) — Claude chat with the report embedded in
   the answer · MCP tools + datasets in a right rail.
   ===================================================================== */
.c2-grid { display: grid; grid-template-columns: 1.78fr 1fr; gap: 50px; min-height: 0; align-items: stretch; }

/* left — chat window */
.c2-window { display: flex; flex-direction: column; min-height: 0; background: #0E1013; border: 1px solid rgba(236,238,241,.12); border-radius: 12px; overflow: hidden; box-shadow: 0 30px 80px -34px rgba(0,0,0,.7); }
.c2-bar { display: flex; align-items: center; gap: 14px; padding: 13px 20px; background: #16191E; border-bottom: 1px solid rgba(236,238,241,.08); }
.c2-model { font-family: var(--f-mono); font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: rgba(236,238,241,.7); }
.c2-conn { margin-left: auto; display: flex; align-items: center; gap: 9px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: rgba(236,238,241,.42); }
.c2-conn .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--c-good); box-shadow: 0 0 0 3px rgba(79,125,93,.18); }
.c2-thread { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 13px; padding: 20px 28px 16px; overflow: hidden; }
.c2-user { align-self: flex-end; max-width: 76%; background: #1E2228; border: 1px solid rgba(236,238,241,.1); border-radius: 13px 13px 4px 13px; padding: 11px 16px; font-family: var(--f-display); font-weight: 300; font-size: 17px; line-height: 1.4; color: #E9EBEE; flex-shrink: 0; }
.c2-assistant { display: flex; gap: 14px; min-height: 0; flex-shrink: 0; }
.c2-assistant .ck-avatar { margin-top: 2px; }
.c2-msg { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 11px; }
.c2-tool { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; padding: 6px 11px; background: #0B0C0E; border: 1px solid rgba(236,238,241,.12); border-radius: 6px; font-family: var(--f-mono); font-size: 12.5px; color: rgba(236,238,241,.55); }
.c2-tool .fn { color: #CD6038; }
.c2-tool .tick { color: var(--c-good); }
.c2-say { font-family: var(--f-display); font-weight: 300; font-size: 17.5px; line-height: 1.45; color: rgba(236,238,241,.8); }
.c2-say b { color: #F2EEE3; font-weight: 500; }
.c2-logged { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .03em; color: rgba(236,238,241,.4); white-space: nowrap; }

/* embedded report artifact */
.c2-artifact { border: 1px solid rgba(236,238,241,.15); border-radius: 11px; overflow: hidden; background: #15181C; flex-shrink: 0; }
.c2-art-bar { display: flex; align-items: center; gap: 9px; padding: 10px 16px; background: #1B1F24; border-bottom: 1px solid rgba(236,238,241,.08); font-family: var(--f-mono); font-size: 12.5px; letter-spacing: .03em; color: rgba(236,238,241,.66); }
.c2-art-ico { color: #CD6038; }
.c2-art-time { margin-left: auto; color: rgba(236,238,241,.4); white-space: nowrap; }
.c2-art-body { padding: 13px 18px 14px; display: flex; flex-direction: column; gap: 11px; }
.c2-art-top { display: grid; grid-template-columns: auto 1fr; gap: 22px; align-items: center; }
.c2-artifact .ck-bignum .from { font-size: 18px; }
.c2-artifact .ck-bignum .arrow { font-size: 15px; }
.c2-artifact .ck-bignum .to { font-size: 40px; }
.c2-artifact .ck-bignum .lift { font-size: 12px; padding-bottom: 4px; }
.c2-artifact .ck-chart { height: 52px; }
.c2-artifact .ck-xlabels { font-size: 10px; margin-top: 2px; }
.c2-art-bars { display: flex; flex-direction: column; gap: 9px; }
.c2-art-bars .ck-bar { grid-template-columns: 1fr 42px; gap: 12px; margin-bottom: 0; }
.c2-art-bars .ck-bar .lbl { margin-bottom: 4px; font-size: 12px; }
.c2-art-bars .ck-bar .pct { font-size: 15px; }
.c2-art-drv { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; padding-top: 1px; }
.c2-art-drv .dl { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: rgba(236,238,241,.38); margin-right: 2px; }
.c2-art-drv span:not(.dl) { font-family: var(--f-mono); font-size: 11.5px; padding: 4px 9px; border: 1px solid rgba(236,238,241,.12); border-radius: 5px; color: rgba(236,238,241,.6); }
.c2-art-drv span b { color: #CD6038; font-weight: 500; }

/* Claude mark — official app-icon PNG (assets/claude-mark.png) */
.claude-mark { flex-shrink: 0; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; }
.claude-mark img { width: 100%; height: 100%; display: block; border-radius: 7px; }
.c2-assistant .claude-mark { width: 30px; height: 30px; margin-top: 2px; }

/* =====================================================================
   COCKPIT v3 (.sol-cockpit3) — reuses the V2 window frame (chat left,
   tools right) but embeds the IN-DEPTH report (pathway / window /
   recommendation / counterfactual) in Claude's answer. No follow-up input.
   ===================================================================== */
.c3-close { font-size: 18px; line-height: 1.45; }
/* agent-MCP-inspired frame: divider line under the head + matching spacing */
.sol-cockpit3 { gap: 44px; }
.c3-grid { border-top: 1px solid rgba(255,255,255,0.22); padding-top: 40px; }

/* in-depth artifact: two columns inside the card */
.c3-body2 { display: grid; grid-template-columns: 1.05fr 1fr; gap: 18px 40px; align-items: start; padding: 18px 22px 20px; }
.c3-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.c3-rows { display: flex; flex-direction: column; }
.c3-artifact .fc-row { grid-template-columns: 116px 1fr; gap: 16px; padding: 9px 0; }
.c3-artifact .fc-row:first-child { border-top: none; padding-top: 0; }
.c3-artifact .fc-k { font-size: 11px; letter-spacing: .14em; color: rgba(236,238,241,.34); }
.c3-artifact .fc-v { font-size: 14px; color: #ECEEF1; }
.c3-artifact .fc-chain { gap: 5px; }
.c3-artifact .fc-chain span { font-size: 11.5px; padding: 2px 8px; }
.c3-artifact .fc-chain i { font-size: 11px; }
.c3-artifact .fc-decision .fc-v { color: #CD6038; }

/* right — MCP tools + datasets rail */
.c2-tools { align-self: start; padding-top: 4px; }
.c2-tools .mcp-fn { font-size: 15.5px; padding: 9px 0; }
.c2-tools .mcp-datasets { margin: 0; }

/* =====================================================================
   COCKPIT v4 (.sol-cockpit4) — V3 frame, but Claude's answer is assembled
   from focused "widget modules": grounded prose → causal chain → a chart
   that backs the odds → a grounded/sources line.
   ===================================================================== */
.sol-cockpit4 { gap: 44px; }
.c4-grid { border-top: 1px solid rgba(255,255,255,0.22); padding-top: 40px; }
.c4-stream { gap: 7px; }
.c4-lead { font-family: var(--f-display); font-weight: 300; font-size: 18px; line-height: 1.5; color: rgba(236,238,241,.82); }
.c4-lead b { color: #F2EEE3; font-weight: 600; }
.c4-lead .acc { color: #CD6038; font-weight: 600; }

/* widget module shell */
.c4-mod { border: 1px solid rgba(236,238,241,.13); border-radius: 10px; overflow: hidden; background: #15181C; }
.c4-mod-h { display: flex; align-items: baseline; gap: 10px; padding: 9px 16px; background: #1A1E22; border-bottom: 1px solid rgba(236,238,241,.07); font-family: var(--f-mono); font-size: 11px; letter-spacing: .15em; text-transform: uppercase; color: rgba(236,238,241,.55); }
.c4-mod-hr { margin-left: auto; letter-spacing: .03em; text-transform: none; color: rgba(236,238,241,.38); font-size: 11.5px; }
.c4-mod-b { padding: 10px 18px; }

/* causal-chain widget */
.c4-chain { display: flex; align-items: stretch; gap: 6px; }
.c4-step { flex: 1; display: flex; flex-direction: column; gap: 3px; padding: 7px 12px; background: #0E1013; border: 1px solid rgba(236,238,241,.1); border-radius: 7px; }
.c4-step.is-end { border-color: rgba(205,96,56,.4); background: rgba(205,96,56,.07); }
.c4-node { font-family: var(--f-mono); font-size: 13px; color: #ECEEF1; }
.c4-step.is-end .c4-node { color: #CD6038; }
.c4-sub { font-family: var(--f-display); font-weight: 300; font-size: 11.5px; line-height: 1.28; color: rgba(236,238,241,.5); }
.c4-arrow { align-self: center; font-style: normal; font-family: var(--f-mono); color: rgba(205,96,56,.7); font-size: 14px; flex-shrink: 0; }

/* odds-chart widget */
.c4-odds { display: grid; grid-template-columns: auto 1fr; gap: 26px; align-items: center; }
.c4-mod .ck-chart { height: 66px; }
.c4-mod .ck-bignum .from { font-size: 18px; }
.c4-mod .ck-bignum .arrow { font-size: 15px; }
.c4-mod .ck-bignum .to { font-size: 42px; }
.c4-mod .ck-bignum .lift { font-size: 12px; padding-bottom: 4px; }
.c4-take { margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(236,238,241,.07); font-family: var(--f-display); font-weight: 300; font-size: 14.5px; line-height: 1.4; color: rgba(236,238,241,.64); }
.c4-take b { color: var(--c-good); font-weight: 600; }

/* grounded / sources line */
.c4-grounded { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .02em; color: rgba(236,238,241,.46); padding-top: 2px; }
.c4-grounded .g-ico { color: #CD6038; }
.c4-grounded b { color: var(--c-good); font-weight: 500; }
.c4-grounded .g-sep { color: rgba(236,238,241,.25); }

/* detailed answer prose (third) — a touch fuller than the MCP summary */
.c4-answer { font-family: var(--f-display); font-weight: 300; font-size: 16px; line-height: 1.46; color: rgba(236,238,241,.82); }
.c4-answer p { margin: 0 0 7px; }
.c4-answer p:last-child { margin-bottom: 0; }
.c4-answer b { color: #F2EEE3; font-weight: 600; }
.c4-answer .acc { color: #CD6038; font-weight: 600; }

/* V4 tools rail — original agent-slide sizing, fitted to fill the full column height */
.c4-grid .c2-tools { align-self: stretch; display: flex; flex-direction: column; padding-top: 0; }
.c4-grid .c2-tools .mcp-fns { flex: 1; justify-content: space-between; margin: 14px 0 0; }
.c4-grid .c2-tools .mcp-fn { font-size: 17px; padding: 0; min-height: 38px; display: flex; align-items: center; }
.c4-grid .c2-tools .mcp-label { margin-bottom: 0; }
.c4-grid .c2-tools .mcp-label + .mcp-datasets,
.c4-grid .c2-tools .mcp-fns + .mcp-label { margin-top: 22px; }
.c4-grid .c2-tools .ds-item { padding: 11px 0; }

/* cockpit v4 — drop the fake-window title bar (three dots); keep the rounded card + graphic */
.sol-cockpit4 .c2-window .c2-bar { display: none; }
/* more breathing room above the user message now that the bar is gone */
.sol-cockpit4 .c2-window .c2-thread { padding-top: 40px; }
/* lift the header + its lower divider ~30px; keep the card + MCP tools in place
   (drop section top-padding by 30, add it back above the card) */
.s-mcp.show-cockpit4 { padding-top: 110px; }
.s-mcp.show-cockpit4 .c4-grid { padding-top: 70px; }

/* V4 · real MCP tool-call chips */
.c4-calls { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.c4-mcp { font-family: var(--f-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(236,238,241,.42); margin-right: 2px; }
.c4-call { display: inline-flex; align-items: center; gap: 7px; padding: 5px 10px; background: #0B0C0E; border: 1px solid rgba(236,238,241,.12); border-radius: 6px; font-family: var(--f-mono); font-size: 12px; color: #CD6038; }
.c4-call i { font-style: normal; color: var(--c-good); font-size: 11px; }

/* V4 · chart caption (why they shifted / where it goes) */
.c4-cap { margin-top: 11px; padding-top: 11px; border-top: 1px solid rgba(236,238,241,.07); font-family: var(--f-display); font-weight: 300; font-size: 14px; line-height: 1.42; color: rgba(236,238,241,.62); }
.c4-cap b { color: #CD6038; font-weight: 600; }

/* V4 · knock-on effects row */
.c4-knock { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.c4-knock .kl { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .15em; text-transform: uppercase; color: rgba(236,238,241,.4); margin-right: 2px; }
.c4-knock span:not(.kl) { font-family: var(--f-mono); font-size: 12px; padding: 4px 10px; border: 1px solid rgba(236,238,241,.12); border-radius: 6px; color: rgba(236,238,241,.66); }
.c4-knock b { color: var(--c-good); font-weight: 600; }

/* V4 · prediction-market chart — proper aspect (no preserveAspectRatio stretch) */
.c4-tool { align-self: flex-start; }
.c4-statline { display: flex; align-items: baseline; gap: 12px; margin-bottom: 4px; }
.c4-statline .from { font-family: var(--f-mono); font-size: 14px; color: rgba(236,238,241,.5); }
.c4-statline .arrow { font-family: var(--f-mono); color: rgba(236,238,241,.4); }
.c4-statline .to { font-family: var(--f-display); font-weight: 600; font-size: 25px; color: #CD6038; letter-spacing: -.01em; }
.c4-statline .lift { font-family: var(--f-mono); font-size: 12px; color: var(--c-good); margin-left: auto; }
.c4-chart { width: 100%; }
.c4-chart svg { width: 100%; height: auto; display: block; }

/* V4 · headerless widgets — title + odds folded into the chart container; right gutter on the answer */
.c4-chart-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 13px 18px 0; }
.cth-title { font-family: var(--f-display); font-weight: 400; font-size: 18px; line-height: 1.2; color: #F2EEE3; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.cth-sub { font-family: var(--f-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: rgba(236,238,241,.4); }
.cth-odds { display: flex; align-items: baseline; gap: 8px; font-family: var(--f-mono); white-space: nowrap; }
.cth-odds .from { font-size: 15px; color: rgba(236,238,241,.5); }
.cth-odds .arrow { color: rgba(236,238,241,.4); }
.cth-odds .to { font-family: var(--f-display); font-weight: 600; font-size: 23px; color: #CD6038; letter-spacing: -.01em; }
.cth-odds .lift { font-size: 11px; color: var(--c-good); }
.c4-chartmod .c4-chart { padding: 6px 18px 12px; }
.c4-stream { padding-right: 104px; }

/* ============================================================
   Transcript review (Jun 2 meeting) — new + deepened slides
   ============================================================ */

/* --- 02 Problem · tighten to fit the new cap line (A3 / B1) --- */
.s3 .problem-bullets { padding-top: 30px; }
.s3 .problem-bullets li { padding-top: 20px; padding-bottom: 20px; }
.s3 .problem-bullets li::before { top: 24px; }
.s3 .problem-cap { padding: 16px 110px 0; }
.s3 .problem-cap .pc-line { font-family: var(--f-display); font-weight: 400; font-size: 34px; letter-spacing: -0.02em; color: var(--c-ink); line-height: 1.05; }
.s3 .problem-cap .pc-why { margin-top: 12px; max-width: 1180px; font-size: 19px; line-height: 1.42; color: var(--c-mute); font-weight: 300; }

/* --- 03 Causal Chain · light columns w/ divider lines (essence is the hero) --- */
.s-causalq { background: var(--c-paper); color: var(--c-ink); padding: 96px 80px 64px; display: grid; grid-template-rows: auto 1fr; gap: 40px; }
.s-causalq .cq-eyebrow { font-family: var(--f-mono); font-size: 14px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--c-mute); }
.s-causalq .cq-eyebrow .num { color: var(--c-ink); margin-right: 16px; font-weight: 500; }
.s-causalq .cq-h2 { font-family: var(--f-display); font-weight: 300; color: var(--c-ink); font-size: 92px; line-height: 1.0; letter-spacing: -0.025em; margin: 4px 0 0; }
.s-causalq .cq-diagram { display: grid; grid-template-columns: repeat(5,1fr); gap: 0; align-content: center; }

/* columns separated by divider lines — equal padding so every image is the same width */
.s-causalq .qcol { padding: 0 28px; border-left: 1px solid var(--c-line); display: flex; flex-direction: column; }
.s-causalq .qcol:first-child { border-left: none; }

/* image inside a rounded rectangle within each section (uniform across columns) */
.s-causalq .qviz { position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 14px; background: var(--c-paper-3); }
.s-causalq .qviz img { width: 100%; height: 100%; object-fit: cover; display: block; }
.s-causalq .qviz::after { content: ""; position: absolute; inset: 0; border-radius: 14px; box-shadow: inset 0 0 0 1px rgba(10,12,14,0.06); background: linear-gradient(180deg, rgba(10,12,14,0) 60%, rgba(10,12,14,0.14)); }

/* essence promoted to the hero, with highlighted phrases */
.s-causalq .qess { font-family: var(--f-display); font-weight: 300; font-size: 25px; line-height: 1.26; letter-spacing: -0.015em; color: var(--c-ink); margin-top: 22px; }
.s-causalq .qess mark { background: none; color: var(--c-forest); font-weight: 500; box-shadow: inset 0 -0.42em 0 rgba(194,172,133,0.32); padding: 0 1px; }
.s-causalq .qcol.c5 .qess mark { color: var(--c-good); box-shadow: inset 0 -0.42em 0 rgba(79,125,93,0.20); }

/* --- 03b Causal Chain · full-bleed photos with white overlay text --- */
.s-causalq-full .cq-diagram { grid-template-columns: repeat(5,1fr); grid-auto-rows: 600px; gap: 22px; align-content: center; }
.s-causalq-full .cq-diagram.cq-3col { grid-template-columns: repeat(3,1fr); max-width: 85%; margin-inline: auto; }
/* each column is a photo panel, separated by white space between */
.s-causalq-full .qcol { position: relative; padding: 0; border: none; border-radius: 0; overflow: hidden; min-height: 0; }
.s-causalq-full .qviz { position: absolute; inset: 0; aspect-ratio: auto; border-radius: 0; background: var(--c-ink); }
.s-causalq-full .qviz img { width: 100%; height: 100%; object-fit: cover; }
/* legibility gradient — dark at the bottom where the text sits */
.s-causalq-full .qviz::after { content: ""; position: absolute; inset: 0; border-radius: 0; box-shadow: none;
  background: linear-gradient(180deg, rgba(10,12,14,0.10) 0%, rgba(10,12,14,0) 34%, rgba(10,12,14,0.55) 74%, rgba(10,12,14,0.86) 100%); }
/* essence overlaid inside the photo, anchored to the bottom, in white */
.s-causalq-full .qess { position: relative; z-index: 2; margin-top: auto; padding: 24px 20px 22px;
  color: rgba(255,255,255,0.92); font-size: 18px; line-height: 1.3; text-shadow: 0 1px 14px rgba(0,0,0,0.45); }
.s-causalq-full .qess mark { background: none; color: #FFFFFF; font-weight: 600;
  box-shadow: inset 0 -0.4em 0 rgba(194,172,133,0.55); padding: 0 1px; text-shadow: 0 1px 14px rgba(0,0,0,0.5); }
.s-causalq-full .qcol.c5 .qess mark { color: #FFFFFF; box-shadow: inset 0 -0.4em 0 rgba(126,196,150,0.55); }
.s-causalq-full .qcol-tag { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; color: #ffffff; margin-bottom: 9px; }
.s-causalq-full .qcol-title { font-family: var(--f-display); font-size: 32px; font-weight: 500; color: #fff; line-height: 1.12; letter-spacing: -0.015em; margin-bottom: 14px; text-shadow: 0 1px 14px rgba(0,0,0,0.5); }
.s-causalq-full .qcol-body { font-family: var(--f-display); font-size: 13.5px; font-weight: 300; color: rgba(255,255,255,0.72); line-height: 1.48; text-shadow: 0 1px 10px rgba(0,0,0,0.4); }
/* PRINT/PDF FIX: stacked blurred text-shadows box into a dark rectangle in Chrome's PDF engine.
   Drop them and let the existing .qviz::after gradient carry legibility (same fix as s1). */
@media print {
  .s-causalq-full .qess,
  .s-causalq-full .qess mark,
  .s-causalq-full .qcol-tag,
  .s-causalq-full .qcol-title,
  .s-causalq-full .qcol-body { text-shadow: none !important; }
  .s-causalq-full .qviz::after {
    background: linear-gradient(180deg, rgba(10,12,14,0.12) 0%, rgba(10,12,14,0) 28%, rgba(10,12,14,0.58) 64%, rgba(10,12,14,0.92) 100%) !important;
  }
}

/* --- 07 ROI / Value (A1) --- */
.s-roi .roi-row { display: flex; align-items: stretch; justify-content: center; gap: 28px; margin-top: 46px; }
.roi-card { flex: 1; max-width: 420px; background: #F5F2EC; border: 1px solid #E0DBCD; border-radius: 16px; padding: 34px 32px; display: flex; flex-direction: column; gap: 14px; }
.roi-tag { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; color: #9A968D; }
.roi-num { font-family: var(--f-display); font-weight: 600; font-size: 72px; line-height: 0.9; letter-spacing: -0.03em; color: #1A1714; }
.roi-num .roi-unit { font-size: 22px; font-weight: 300; letter-spacing: 0; color: #7E7A70; margin-left: 10px; }
.roi-desc { font-size: 18px; line-height: 1.42; color: #585650; font-weight: 300; }
.roi-op { align-self: center; flex: 0 0 auto; font-size: 38px; color: #C2AC85; }
.roi-card-hl { background: #2E3A2A; border-color: #2E3A2A; }
.roi-card-hl .roi-tag { color: rgba(255,255,255,0.6); }
.roi-card-hl .roi-num { color: #FFFFFF; }
.roi-card-hl .roi-num .roi-unit { color: rgba(255,255,255,0.7); }
.roi-card-hl .roi-desc { color: rgba(255,255,255,0.82); }

/* ROI cards — light/white, taller & roomier, three standalone value props */
.s-roi .roi-row { gap: 36px; margin-top: 56px; align-items: stretch; }
.s-roi .roi-card {
  background: #FFFFFF;
  border: 1px solid var(--c-line);
  border-radius: 16px;
  padding: 44px 40px 40px;
  gap: 0;
  justify-content: flex-start;
  box-shadow: 0 18px 48px -28px rgba(10,12,14,0.22);
  position: relative;
}
.s-roi .roi-card::before {
  content: "";
  display: block;
  width: 36px;
  height: 2px;
  background: var(--c-rust);
  margin-bottom: 24px;
}
.s-roi .roi-tag {
  font-family: var(--f-display);
  font-size: 23px;
  font-weight: 500;
  letter-spacing: -0.015em;
  line-height: 1.15;
  color: var(--c-ink);
  margin-bottom: 10px;
}
.s-roi .roi-num {
  font-family: var(--f-mono);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--c-rust);
  margin-bottom: 0;
}
.s-roi .roi-desc {
  font-size: 17px;
  line-height: 1.52;
  color: var(--c-mute);
  font-weight: 300;
  margin-top: auto;
  padding-top: 22px;
  border-top: 1px solid var(--c-line);
}

/* --- 06 Competition · soften cells where Cascadian competes less (A5) --- */
.s5n-us .s5n-cell.s5n-full.s5n-soft { background: #ECE7DC; border-color: #ECE7DC; }

/* --- Appendix · Why Cascadian (placeholder) --- */
.s-why .why-row { display: flex; align-items: stretch; gap: 28px; margin-top: 50px; }
.why-card { flex: 1; background: #F5F2EC; border: 1px dashed #C9C2B2; border-radius: 16px; padding: 34px 32px; display: flex; flex-direction: column; gap: 14px; }
.why-tag { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; color: #9A968D; }
.why-body { font-size: 21px; line-height: 1.4; color: #585650; font-weight: 300; }
.why-body b { color: #1A1714; font-weight: 500; }

/* --- 06 Product Demo (dark walkthrough) --- */
.s-demo { background: #0A0C0E; color: #ECEEF1; }
.s-demo .demo-h2 { color: #F4F2EC; }
.s-demo .demo-h2::before { background: rgba(255,255,255,0.18); }
.s-demo .demo-lede { color: rgba(236,238,241,0.6); }
.demo-card { margin-top: 34px; display: flex; flex-direction: column; background: #0E1013; border: 1px solid rgba(236,238,241,0.12); border-radius: 16px; overflow: hidden; }
.demo-bar { display: flex; align-items: center; gap: 14px; padding: 13px 22px; border-bottom: 1px solid rgba(236,238,241,0.08); }
.demo-bar .ck-dots { display: inline-flex; gap: 7px; }
.demo-bar .ck-dots i { width: 11px; height: 11px; border-radius: 50%; background: rgba(236,238,241,0.22); display: inline-block; }
.demo-bar-title { font-family: var(--f-mono); font-size: 14px; letter-spacing: 0.03em; color: rgba(236,238,241,0.72); }
.demo-bar-title b { color: #ECEEF1; font-weight: 600; }
.demo-live { margin-left: auto; font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: #8FBF8F; display: flex; align-items: center; gap: 8px; }
.demo-live .dot { width: 7px; height: 7px; border-radius: 50%; background: #8FBF8F; box-shadow: 0 0 0 3px rgba(143,191,143,0.16); }
.demo-body { padding: 26px 30px 24px; display: flex; flex-direction: column; gap: 18px; }
.demo-q { align-self: flex-start; max-width: 1120px; background: rgba(236,238,241,0.06); border: 1px solid rgba(236,238,241,0.08); border-radius: 12px; padding: 15px 20px; font-family: var(--f-display); font-size: 22px; font-weight: 300; color: #ECEEF1; }
.demo-tool { font-family: var(--f-mono); font-size: 14px; color: rgba(236,238,241,0.58); }
.demo-tool .tick { color: #8FBF8F; }
.demo-tool .fn { color: #CD6038; }
.demo-split { display: grid; grid-template-columns: 1.5fr 1fr; gap: 44px; align-items: start; }
.demo-answer p { font-family: var(--f-display); font-weight: 300; font-size: 22px; line-height: 1.4; color: rgba(236,238,241,0.9); margin: 0 0 16px; }
.demo-answer b { color: #FFFFFF; font-weight: 500; }
.demo-answer .acc { color: #CD6038; font-weight: 500; }
.demo-rec { display: flex; align-items: baseline; gap: 12px; font-size: 21px; margin-bottom: 0; }
.demo-rec b { color: #FFFFFF; font-weight: 500; }
.demo-rec-tag { flex: 0 0 auto; font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: #CD6038; border: 1px solid rgba(205,96,56,0.4); border-radius: 999px; padding: 5px 12px; }
.demo-odds-lbl { font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(236,238,241,0.45); margin-bottom: 14px; }
.demo-odbar { display: grid; grid-template-columns: 1fr 120px auto; align-items: center; gap: 12px; margin-bottom: 12px; font-family: var(--f-mono); font-size: 13px; color: rgba(236,238,241,0.7); }
.demo-odbar .otrack { height: 8px; background: rgba(236,238,241,0.1); border-radius: 999px; overflow: hidden; }
.demo-odbar .ofill { display: block; height: 100%; border-radius: 999px; }
.demo-odbar .ofill.mkt { background: rgba(236,238,241,0.45); }
.demo-odbar .ofill.cal { background: #CD6038; }
.demo-odbar .opct { font-size: 15px; color: #ECEEF1; }
.demo-edge { margin-top: 4px; font-family: var(--f-mono); font-size: 13px; color: rgba(236,238,241,0.6); }
.demo-edge b { color: #CD6038; }
.demo-chain { margin-top: 2px; }
.demo-chain .c4-step { background: #15181C; }
.demo-foot { margin-top: 6px; padding-top: 14px; border-top: 1px solid rgba(236,238,241,0.07); font-family: var(--f-mono); font-size: 13px; color: rgba(236,238,241,0.55); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.demo-foot b { color: rgba(236,238,241,0.85); font-weight: 500; }
.demo-foot .g-ico { color: #CD6038; }

/* --- 05b Solution variant · in-slide comparator (two live demos, brief) --- */
.srx-window { width: 100%; height: 100%; min-height: 0; background: #fff; border-radius: 12px; box-shadow: 0 30px 80px -34px rgba(0,0,0,0.7); overflow: hidden; display: flex; flex-direction: column; font-family: 'Hanken Grotesk', ui-sans-serif, system-ui, sans-serif; }
.srx-frame { flex: 1; width: 100%; min-height: 0; border: 0; display: block; background: #fff; }
.srx-frame[hidden] { display: none; }
.srx-top { display: flex; align-items: center; gap: 14px; padding: 14px 30px; border-bottom: 1px solid rgba(0,0,0,0.10); background: rgba(255,255,255,0.92); flex-shrink: 0; }
.srx-brand { display: flex; align-items: center; gap: 8px; color: #26231d; }
.srx-brand span { font-size: 13px; letter-spacing: 0.18em; color: #57524a; }
.srx-viewas { font-size: 13px; color: #938c82; margin-left: 4px; }
.srx-tabs { display: flex; gap: 6px; }
.srx-tabs button { font-size: 13px; padding: 6px 13px; border-radius: 8px; border: 1px solid transparent; background: transparent; color: #57524a; font-family: inherit; cursor: default; }
.srx-tabs button.on { background: rgba(191,77,40,0.07); color: #a3431f; border-color: rgba(191,77,40,0.26); }
.srx-body { position: relative; flex: 1; min-height: 0; overflow: hidden; }
.srx-col { max-width: 760px; margin: 0 auto; padding: 26px 24px 60px; }
.srx-asked { font-size: 15px; color: #938c82; padding-bottom: 16px; margin-bottom: 24px; border-bottom: 1px solid rgba(0,0,0,0.06); }
.srx-asked span { color: #57524a; }
.srx-h1 { font-size: 34px; font-weight: 700; color: #26231d; letter-spacing: -0.02em; line-height: 1.2; margin: 0 0 10px; }
.srx-byline { font-size: 14px; color: #938c82; margin-bottom: 24px; }
.srx-p { font-size: 17px; line-height: 1.68; color: #57524a; margin: 0 0 16px; }
.srx-lead { font-size: 18px; color: #26231d; }
.srx-figs { display: flex; flex-wrap: wrap; gap: 34px; align-items: flex-end; padding: 20px 0; border-top: 1px solid rgba(0,0,0,0.10); border-bottom: 1px solid rgba(0,0,0,0.10); margin: 22px 0; }
.srx-fig-n .n { font-size: 34px; font-weight: 600; line-height: 1; color: #26231d; font-variant-numeric: tabular-nums; }
.srx-fig-n .n.accent { color: #bf4d28; }
.srx-fig-n .l { font-size: 14px; color: #57524a; margin-top: 7px; }
.srx-read { margin-left: auto; display: flex; align-items: center; gap: 9px; }
.srx-read .rl { font-size: 14px; color: #57524a; }
.srx-read .rp { font-size: 15px; font-weight: 600; color: #a3431f; background: rgba(191,77,40,0.07); border: 1px solid rgba(191,77,40,0.26); border-radius: 999px; padding: 6px 14px; }
.srx-h2 { font-size: 21px; font-weight: 600; color: #26231d; letter-spacing: -0.01em; margin: 34px 0 12px; }
.srx-figure { margin: 18px 0 6px; }
.srx-fbox { border-radius: 14px; border: 1px solid rgba(0,0,0,0.10); background: #fcfbf9; padding: 20px; }
.srx-fhead { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.srx-live { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; letter-spacing: 0.05em; color: #2f8f4e; }
.srx-live .d { width: 7px; height: 7px; border-radius: 9px; background: #2f8f4e; }
.srx-fcat { font-size: 11px; color: #938c82; letter-spacing: 0.05em; text-transform: uppercase; }
.srx-fq { font-size: 18px; font-weight: 600; color: #26231d; line-height: 1.3; margin-bottom: 12px; }
.srx-leg { display: flex; gap: 22px; flex-wrap: wrap; margin-bottom: 6px; }
.srx-leg .lg { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; color: #57524a; }
.srx-leg .lg i { width: 9px; height: 9px; border-radius: 9px; display: inline-block; }
.srx-leg .lg b { color: #26231d; font-variant-numeric: tabular-nums; }
.srx-chart { width: 100%; height: auto; display: block; overflow: visible; margin: 2px 0; }
.srx-ffoot { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(0,0,0,0.06); font-size: 13px; color: #57524a; font-variant-numeric: tabular-nums; }
.srx-ffoot .dim { color: #938c82; }
.srx-ffoot b { color: #3d5a80; }
.srx-figure figcaption { font-size: 14px; color: #938c82; margin-top: 10px; font-style: italic; line-height: 1.5; }
.srx-fade { position: absolute; left: 0; right: 0; bottom: 0; height: 130px; background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 90%); pointer-events: none; }