@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;0,9..144,800;1,9..144,400;1,9..144,500;1,9..144,600&family=Pathway+Extreme:ital,opsz,wght@0,8..144,300;0,8..144,400;0,8..144,500;0,8..144,600;0,8..144,700;0,8..144,800;1,8..144,400&display=swap");

/* ============================================================
   SENSIBOO INVESTOR DECK
   Brand source: First Agentic Workflow/brand/brand_config.json
   ============================================================ */

:root {
  /* Brand palette — saturated, not pastel */
  --orchid:       #C97AD4;
  --hot-magenta:  #D63E8A;
  --deep-violet:  #5C2D91;
  --golden-amber: #E8960E;
  --red-orange:   #F05A28;
  --acid-lime:    #C5E840;
  --cyan:         #00AABF;
  --warm-cream:   #FAF3E0;
  --deep-space:   #0D0418;
  --midnight:     #1A0832;
  --dusk:         #2D1054;

  /* Semantic — DARK theme on deep_space */
  --bg:           var(--deep-space);
  --bg-card:      rgba(45, 16, 84, 0.45);     /* dusk, translucent for elevation */
  --ink:          var(--warm-cream);
  --ink-soft:     rgba(250, 243, 224, 0.72);
  --ink-mute:     rgba(250, 243, 224, 0.45);
  --line:         rgba(250, 243, 224, 0.14);
  --line-orchid:  rgba(201, 122, 212, 0.32);

  --accent:       var(--orchid);
  --accent-press: var(--hot-magenta);

  /* Type scale */
  --t-display: clamp(56px, 9vw, 128px);
  --t-title:   clamp(40px, 5.6vw, 80px);
  --t-h2:      clamp(28px, 3.4vw, 44px);
  --t-h3:      clamp(20px, 2.2vw, 28px);
  --t-body:    clamp(16px, 1.4vw, 20px);
  --t-small:   clamp(13px, 1vw, 15px);
  --t-micro:   clamp(11px, 0.8vw, 13px);

  /* Spacing */
  --pad-x: clamp(24px, 5vw, 80px);
  --pad-y: clamp(48px, 7vw, 96px);

  --font-heading: "Fraunces", Georgia, serif;
  --font-body: "Pathway Extreme", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  font-family: var(--font-body);
  font-size: var(--t-body);
  font-weight: 400;
  line-height: 1.5;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.slide + .slide { border-top: 1px solid var(--line); }

/* ============================================================
   SLIDE CHROME
   ============================================================ */
.slide {
  min-height: 100vh;
  padding: var(--pad-y) var(--pad-x);
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* ============================================================
   SLIDE — PROBLEM
   ============================================================ */
#slide-problem {
  padding-top: clamp(16px, 2.4vw, 32px);
  padding-bottom: clamp(28px, 4vw, 56px);
  height: 100vh;
  justify-content: flex-start;
}
#slide-problem .eyebrow { margin: 0 0 14px; }
#slide-problem .slide-title {
  font-size: clamp(30px, 3.6vw, 56px);
  max-width: none;
  margin: 0 0 24px;
}

.problem-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: clamp(56px, 8vw, 120px);
  align-items: center;
  flex: 1;
  min-height: 0;
  margin-top: clamp(40px, 5vw, 72px);
}
@media (max-width: 900px) {
  .problem-grid { grid-template-columns: 1fr; }
  #slide-problem { height: auto; }
}

.problem-grid__left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 14px;
}
.problem-grid__lead {
  font-size: clamp(16px, 1.4vw, 20px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--ink-soft);
  margin: 0;
}
.problem-grid__sub {
  font-size: clamp(14px, 1.2vw, 17px);
  font-weight: 400;
  line-height: 1.5;
  color: var(--ink-soft);
  margin: 0;
}
.problem-grid__kicker {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(20px, 1.8vw, 28px);
  color: var(--orchid);
  margin: 8px 0 0;
  letter-spacing: -0.01em;
}

.problem-grid__right {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
}

.reddit-feed-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.reddit-feed-header__label { color: var(--orchid); }
.reddit-feed-header__refresh { color: var(--ink-mute); letter-spacing: 0.04em; text-transform: none; font-weight: 500; font-size: 11px; }

.reddit-feed {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
  min-height: 0;
}

.reddit-card {
  display: block;
  text-decoration: none;
  background: var(--bg-card);
  border: 1px solid var(--line-orchid);
  border-radius: 12px;
  padding: 14px 16px;
  color: var(--ink);
  transition: border-color 0.15s ease, transform 0.15s ease;
  backdrop-filter: blur(6px);
}
.reddit-card:hover {
  border-color: var(--orchid);
  transform: translateY(-1px);
}
.reddit-card__meta {
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: 6px;
}
.reddit-card__meta-sub { color: var(--orchid); }
.reddit-card__title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(15px, 1.2vw, 17px);
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0 0 6px;
}
.reddit-card__snippet {
  font-size: 12px;
  line-height: 1.45;
  color: var(--ink-soft);
  margin: 0 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.reddit-card__stats {
  display: flex;
  gap: 14px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--ink-mute);
}
.reddit-card__stats span::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--ink-mute);
  margin-right: 6px;
  vertical-align: middle;
}

.reddit-card--skeleton {
  height: 110px;
  background: var(--bg-card);
  border: 1px solid var(--line);
  position: relative;
  overflow: hidden;
}
.reddit-card--skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(201, 122, 212, 0.08), transparent);
  animation: shimmer 1.6s infinite;
}
@keyframes shimmer {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

.reddit-card--error {
  font-size: 12px;
  color: var(--ink-soft);
  font-style: italic;
  text-align: center;
  padding: 24px;
}

/* ============================================================
   SLIDE — SOLUTION
   ============================================================ */
#slide-solution {
  padding-top: clamp(16px, 2.4vw, 32px);
  padding-bottom: clamp(28px, 4vw, 56px);
  height: 100vh;
  justify-content: flex-start;
}
#slide-solution .eyebrow { margin: 0 0 14px; }

.solution-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: clamp(56px, 8vw, 120px);
  align-items: center;
  flex: 1;
  min-height: 0;
  margin-top: clamp(40px, 5vw, 72px);
}
@media (max-width: 900px) {
  .solution-grid { grid-template-columns: 1fr; }
  #slide-solution { height: auto; }
}

.solution-grid__left {
  display: flex;
  flex-direction: column;
  gap: 44px;
}
#slide-solution .slide-title {
  font-size: clamp(30px, 3.6vw, 56px);
  max-width: none;
  margin: 0;
}

.solution-pillars {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.solution-pillar {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px;
  align-items: start;
}
.solution-pillar__num {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(20px, 1.8vw, 26px);
  color: var(--orchid);
  line-height: 1;
  margin-top: 2px;
  font-variant-numeric: tabular-nums;
}
.solution-pillar__title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(16px, 1.4vw, 20px);
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0 0 4px;
}
.solution-pillar__desc {
  font-size: clamp(13px, 1.1vw, 15px);
  line-height: 1.5;
  color: var(--ink-soft);
  margin: 0;
}

.solution-stat {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
.solution-stat__big {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(22px, 2.2vw, 32px);
  color: var(--orchid);
  letter-spacing: -0.01em;
}
.solution-stat__small {
  font-size: clamp(12px, 1vw, 14px);
  color: var(--ink-soft);
  font-weight: 500;
}

/* ---------- Audio player on right ---------- */
.solution-grid__right {
  display: flex;
  justify-content: flex-start;
}
.adventure-player {
  background: var(--bg-card);
  border: 1px solid var(--line-orchid);
  border-radius: 18px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 22px;
  backdrop-filter: blur(6px);
  max-width: 360px;
  width: 100%;
}
.adventure-player__cover {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.adventure-player__meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.adventure-player__eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--orchid);
}
.adventure-player__title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(17px, 1.5vw, 22px);
  letter-spacing: -0.015em;
  color: var(--ink);
  white-space: nowrap;
}
.adventure-player__audio {
  width: 100%;
  height: 40px;
  border-radius: 999px;
  background: var(--red-orange);
  accent-color: var(--red-orange);
}
.adventure-player__audio::-webkit-media-controls-panel {
  background: var(--red-orange);
}
.adventure-player__audio::-webkit-media-controls-current-time-display,
.adventure-player__audio::-webkit-media-controls-time-remaining-display {
  text-shadow: none;
  color: var(--warm-cream);
}
.adventure-player__tags {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.adventure-player__tags span {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--orchid);
}

/* ============================================================
   SLIDE — WHY NOW
   ============================================================ */
#slide-whynow {
  padding-top: clamp(16px, 2.4vw, 32px);
  padding-bottom: clamp(28px, 4vw, 56px);
  height: 100vh;
  justify-content: flex-start;
}
#slide-whynow .eyebrow { margin: 0 0 14px; }
#slide-whynow .slide-title {
  font-size: clamp(30px, 3.6vw, 56px);
  max-width: none;
  margin: clamp(40px, 5vw, 72px) 0 clamp(28px, 3.6vw, 48px);
}

.whynow-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 1.8vw, 24px);
}
@media (max-width: 900px) {
  .whynow-cards { grid-template-columns: 1fr; }
  #slide-whynow { height: auto; }
}

.whynow-card {
  background: var(--bg-card);
  border: 1px solid var(--line-orchid);
  border-radius: 16px;
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  backdrop-filter: blur(6px);
  color: var(--ink-soft);
}
.whynow-card--accent {
  border-color: var(--orchid);
  background: rgba(201, 122, 212, 0.08);
}

.whynow-card__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 4px;
}
.whynow-card__stat {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(28px, 3vw, 44px);
  line-height: 1;
  color: var(--orchid);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.whynow-card__unit {
  font-size: 0.5em;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-left: 4px;
  font-family: var(--font-body);
  font-style: normal;
}
.whynow-card__stat-sub {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mute);
  text-align: right;
  align-self: flex-end;
  max-width: 12ch;
  line-height: 1.3;
}
.whynow-card__spark {
  width: 60px;
  height: 28px;
  color: var(--orchid);
  flex-shrink: 0;
}
.whynow-card__title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(18px, 1.6vw, 22px);
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0;
}
.whynow-card__desc {
  font-size: clamp(12px, 1vw, 14px);
  line-height: 1.5;
  color: var(--ink-soft);
  margin: 0;
  flex: 1;
}
.whynow-card__desc em {
  font-style: italic;
  color: var(--ink);
}
.whynow-card__source {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-top: 2px;
}
.whynow-card__source a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(250, 243, 224, 0.18);
  text-underline-offset: 3px;
  transition: color 0.15s ease, text-decoration-color 0.15s ease;
}
.whynow-card__source a:hover {
  color: var(--orchid);
  text-decoration-color: var(--orchid);
}

a.age-bar__label {
  text-decoration: none;
  transition: color 0.15s ease;
}
a.age-bar__label:hover {
  color: var(--orchid);
}

/* ---------- Age-coverage bar (the gap visual) ---------- */
.whynow-gap {
  margin-top: clamp(24px, 3vw, 40px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: clamp(28px, 4vw, 56px);
  align-items: center;
}
@media (max-width: 900px) {
  .whynow-gap { grid-template-columns: 1fr; }
}

.whynow-gap__punchline {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(20px, 2vw, 30px);
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0;
}
.whynow-gap__kicker {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(20px, 2vw, 30px);
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 12px 0 0;
}

.age-bar {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.age-bar__row {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 12px;
  align-items: center;
}
.age-bar__label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
  text-align: right;
}
.age-bar__row--us .age-bar__label {
  color: var(--red-orange);
  font-weight: 700;
}
.age-bar__track {
  position: relative;
  height: 14px;
  background: rgba(250, 243, 224, 0.08);
  border-radius: 999px;
}
.age-bar__fill {
  position: absolute;
  top: 0;
  bottom: 0;
  background: rgba(250, 243, 224, 0.32);
  border-radius: 999px;
}
.age-bar__fill--us {
  background: var(--red-orange);
}

.age-bar__header {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 12px;
  margin-bottom: 4px;
}
.age-bar__header-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-mute);
}

/* ============================================================
   SLIDE — COMPETITION
   Share-of-playtime stack.
   ============================================================ */
#slide-competition {
  padding-top: clamp(16px, 2.4vw, 32px);
  padding-bottom: clamp(28px, 4vw, 56px);
  height: 100vh;
  justify-content: flex-start;
}
#slide-competition .eyebrow { margin: 0 0 14px; }
#slide-competition .slide-title {
  font-size: clamp(30px, 3.6vw, 56px);
  max-width: none;
  margin: clamp(12px, 1.6vw, 24px) 0 16px;
}
#slide-competition .slide-deck {
  font-size: clamp(15px, 1.3vw, 18px);
  margin-top: 0;
  max-width: none;
}

.competition {
  margin-top: clamp(56px, 7vw, 96px);
  display: flex;
  flex-direction: column;
  gap: 20px;
  flex: 1;
  min-height: 0;
}

/* ---------- Day timeline rows ---------- */
.day-row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 14px;
  align-items: center;
}
.day-row__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-mute);
  text-align: right;
}
.day-row--us .day-row__label {
  color: var(--red-orange);
}

.day-bar {
  display: flex;
  height: 52px;
  background: rgba(250, 243, 224, 0.04);
  border-radius: 10px;
  overflow: hidden;
  gap: 1px;
}
.day-seg {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
  cursor: default;
  transition: opacity 0.15s ease;
}
.day-seg span {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--deep-space);
  white-space: nowrap;
  padding: 0 6px;
  opacity: 0.85;
}
.day-seg:hover { opacity: 1.15; filter: brightness(1.08); }

/* Category colors */
.day-seg--toys     { background: var(--orchid);       }
.day-seg--screens  { background: var(--hot-magenta);  }
.day-seg--reallife { background: var(--acid-lime);    }
.day-seg--activity { background: var(--golden-amber); }
.day-seg--filler   { background: var(--acid-lime); }
.day-seg--filler span { color: var(--deep-space); }
.day-seg--care     { background: rgba(250, 243, 224, 0.10); }
.day-seg--care span { color: var(--ink-soft); }
.day-seg--nap      { background: rgba(250, 243, 224, 0.05); }
.day-seg--nap span { color: var(--ink-mute); font-style: italic; }
.day-seg--us       { background: var(--red-orange); }
.day-seg--us span  { color: var(--warm-cream); font-weight: 700; }

.day-row__axis {
  grid-column: 2 / 3;
  display: flex;
  justify-content: space-between;
  margin-top: 6px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mute);
}

/* ---------- Legend ---------- */
.competition-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 8px;
  padding-left: 124px;
}
.legend-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: var(--ink-soft);
  font-weight: 500;
}
.legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  flex-shrink: 0;
}
.legend-dot--toys     { background: var(--orchid); }
.legend-dot--screens  { background: var(--hot-magenta); }
.legend-dot--reallife { background: var(--acid-lime); }
.legend-dot--activity { background: var(--golden-amber); }
.legend-dot--filler   { background: var(--acid-lime); }
.legend-dot--us       { background: var(--red-orange); }

/* ---------- Claim + source ---------- */
.competition-claim {
  margin-top: 12px;
  padding-left: 124px;
}
.competition-claim__lead {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(16px, 1.4vw, 20px);
  line-height: 1.45;
  color: var(--ink);
  margin: 0;
  max-width: 70ch;
}
.competition-claim__lead em,
.competition-claim__lead .accent {
  color: var(--red-orange);
  font-style: normal;
}

.competition-source {
  margin-top: auto;
  padding-top: 14px;
  font-size: 11px;
  color: var(--ink-mute);
  letter-spacing: 0.04em;
  padding-left: 124px;
}
.competition-source a {
  color: var(--ink-soft);
  text-decoration: underline;
  text-decoration-color: rgba(250, 243, 224, 0.18);
  text-underline-offset: 2px;
  transition: color 0.15s ease;
}
.competition-source a:hover { color: var(--orchid); }

/* ============================================================
   SLIDE — BUSINESS MODEL
   ============================================================ */
#slide-business {
  padding-top: clamp(16px, 2.4vw, 32px);
  padding-bottom: clamp(28px, 4vw, 56px);
  height: 100vh;
  justify-content: flex-start;
}
#slide-business .eyebrow { margin: 0 0 14px; }
#slide-business .slide-title {
  font-size: clamp(30px, 3.6vw, 56px);
  max-width: none;
  margin: clamp(12px, 1.6vw, 24px) 0 12px;
}
#slide-business .slide-deck {
  font-size: clamp(15px, 1.3vw, 18px);
  margin-top: 0;
  max-width: 70ch;
}

/* ---------- View toggles ---------- */
.business-toggles {
  display: flex;
  gap: 12px;
  margin-top: 24px;
}
.business-toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
  padding: 8px 16px;
  border: 1.5px solid var(--line);
  border-radius: 999px;
  transition: all 0.15s ease;
}
.business-toggle:hover { border-color: var(--orchid); color: var(--orchid); }
.business-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.business-toggle__box {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 4px;
  border: 1.5px solid currentColor;
  background: transparent;
  position: relative;
  flex-shrink: 0;
  transition: all 0.15s ease;
}
.business-toggle input:checked ~ .business-toggle__box {
  background: var(--orchid);
  border-color: var(--orchid);
}
.business-toggle input:checked ~ .business-toggle__box::after {
  content: "";
  position: absolute;
  inset: 2px;
  background-image: linear-gradient(45deg, transparent 40%, var(--warm-cream) 40%, var(--warm-cream) 60%, transparent 60%);
  /* simpler: use a checkmark via clip-path, but use a tiny cream square as proxy */
}
.business-toggle:has(input:checked) {
  border-color: var(--orchid);
  color: var(--ink);
}

/* ---------- Business grid ---------- */
.business-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(24px, 3vw, 40px);
  margin-top: 20px;
  flex: 1;
  min-height: 0;
}
.business-grid[data-only="today"]  { grid-template-columns: 1fr; }
.business-grid[data-only="future"] { grid-template-columns: 1fr; }
.business-grid[data-only="today"]  .business-col[data-view="future"],
.business-grid[data-only="future"] .business-col[data-view="today"] {
  display: none;
}
.business-grid[data-only="none"] .business-col { display: none; }

@media (max-width: 900px) {
  .business-grid { grid-template-columns: 1fr; }
  #slide-business { height: auto; }
}

.business-col {
  background: var(--bg-card);
  border: 1px solid var(--line-orchid);
  border-radius: 16px;
  padding: 22px 26px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  backdrop-filter: blur(6px);
  transition: opacity 0.2s ease;
}
.business-col--future {
  border-color: var(--red-orange);
  background: rgba(240, 90, 40, 0.06);
}

.business-col__head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.business-col__eyebrow {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--orchid);
}
.business-col--future .business-col__eyebrow { color: var(--red-orange); }
.business-col__sub {
  font-size: 11px;
  color: var(--ink-mute);
  font-weight: 500;
  letter-spacing: 0.02em;
}

.business-row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 16px;
  align-items: baseline;
  padding: 8px 0;
  border-bottom: 1px dashed var(--line);
}
.business-row:last-child { border-bottom: none; }
.business-row__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.business-row__value {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.business-row__value strong {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(18px, 1.6vw, 22px);
  letter-spacing: -0.01em;
  color: var(--ink);
}
.business-col--future .business-row__value strong { color: var(--ink); }
.business-row__value span {
  font-size: 12px;
  color: var(--ink-soft);
  line-height: 1.4;
}
.business-row__value a {
  color: var(--orchid);
  text-decoration: underline;
  text-decoration-color: rgba(201, 122, 212, 0.4);
  text-underline-offset: 2px;
  transition: color 0.15s ease;
}
.business-row__value a:hover { color: var(--hot-magenta); text-decoration-color: var(--hot-magenta); }

/* ---------- Note ---------- */
.business-note {
  margin-top: 18px;
  padding: 16px 20px;
  background: rgba(250, 243, 224, 0.04);
  border: 1px solid var(--line);
  border-radius: 12px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink-soft);
}
.business-note strong {
  display: block;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--orchid);
  margin-bottom: 4px;
}

/* ============================================================
   SLIDE — TEAM
   Hover any card to swap to the personal story.
   ============================================================ */
#slide-team {
  padding-top: clamp(16px, 2.4vw, 32px);
  padding-bottom: clamp(28px, 4vw, 56px);
  height: 100vh;
  justify-content: flex-start;
}
#slide-team .eyebrow { margin: 0 0 14px; }
#slide-team .slide-title {
  font-size: clamp(30px, 3.6vw, 56px);
  max-width: none;
  margin: clamp(12px, 1.6vw, 24px) 0 12px;
}
#slide-team .slide-deck {
  font-size: clamp(15px, 1.3vw, 18px);
  margin-top: 0;
}

.team-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: clamp(28px, 4vw, 56px);
  margin-top: clamp(28px, 3.6vw, 48px);
  align-items: stretch;
  min-height: 470px;
}
@media (max-width: 1100px) {
  .team-grid { grid-template-columns: 1fr; }
  #slide-team { height: auto; }
}

.team-col {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}

.team-col__head {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--orchid);
}

.team-card-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  flex: 1;
  align-items: stretch;
}
@media (max-width: 1100px) {
  .team-card-row { grid-template-columns: 1fr; }
}

.team-card {
  background: var(--bg-card);
  border: 1px solid var(--line-orchid);
  border-radius: 14px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  backdrop-filter: blur(6px);
  transition: border-color 0.2s ease, transform 0.2s ease;
  position: relative;
  cursor: default;
  min-width: 0;
}
.team-card:hover {
  border-color: var(--orchid);
  transform: translateY(-2px);
}

.team-card--founder {
  flex-direction: column;
  align-items: stretch;
  padding: 22px;
  gap: 28px;
  flex: 1;
}
.team-card--founder .team-card__main {
  flex: 1;
  min-width: 0;
  width: 100%;
}

.team-card__photo {
  display: block;
  width: 88px;
  height: 88px;
  border-radius: 14px;
  object-fit: cover;
  flex-shrink: 0;
}
.team-card--founder .team-card__photo {
  width: clamp(110px, 11vw, 160px);
  height: clamp(110px, 11vw, 160px);
}

.team-card__photo--initials {
  background: linear-gradient(135deg, var(--dusk), var(--midnight));
  border: 1px solid var(--line-orchid);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 28px;
  color: var(--orchid);
  letter-spacing: 0.02em;
}
.team-card__photo--initials::before {
  content: attr(data-initials);
}

.team-card__main {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  flex: 1;
}

.team-card__name {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(16px, 1.3vw, 19px);
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0;
  line-height: 1.2;
}
.team-card--founder .team-card__name {
  font-size: clamp(22px, 2vw, 28px);
}

.team-card__title {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--ink-mute);
  line-height: 1.45;
  text-transform: uppercase;
}
.team-card--founder .team-card__title {
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: none;
  font-weight: 500;
  color: var(--orchid);
  min-height: 0;
}

/* ---------- Body: default vs hover swap ---------- */
.team-card__body {
  position: relative;
  margin-top: auto;
  min-height: 56px;
}
.team-card--founder .team-card__body { margin-top: 4px; }
.team-card__default,
.team-card__hover {
  position: absolute;
  inset: 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--ink-soft);
  transition: opacity 0.2s ease;
}
.team-card--founder .team-card__body { min-height: 90px; }
.team-card--founder .team-card__default,
.team-card--founder .team-card__hover {
  font-size: 11px;
}
.team-card__hover { opacity: 0; }
.team-card:hover .team-card__default { opacity: 0; }
.team-card:hover .team-card__hover { opacity: 1; }

.team-card__hover p {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 500;
  color: var(--ink);
  font-size: clamp(13px, 1.1vw, 15px);
  line-height: 1.45;
  margin: 0;
}
.team-card__hover strong {
  font-style: normal;
  color: var(--orchid);
  font-weight: 500;
}

.team-card__list {
  margin: 0;
  padding: 0 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.team-card__list li {
  font-size: 11px;
  line-height: 1.45;
  color: var(--ink-soft);
}
.team-card__list strong {
  color: var(--ink);
  font-weight: 600;
}
.team-card__default p {
  margin: 0;
}

/* ============================================================
   SLIDE — FUTURE PLANS
   Branching paths from today.
   ============================================================ */
#slide-future {
  padding-top: clamp(16px, 2.4vw, 32px);
  padding-bottom: clamp(28px, 4vw, 56px);
  height: 100vh;
  justify-content: flex-start;
}
#slide-future .eyebrow { margin: 0 0 14px; }
#slide-future .slide-title {
  font-size: clamp(30px, 3.6vw, 56px);
  max-width: none;
  margin: clamp(12px, 1.6vw, 24px) 0 12px;
}
#slide-future .slide-deck {
  font-size: clamp(15px, 1.3vw, 18px);
  margin-top: 0;
}

.future-tree {
  margin-top: clamp(28px, 3.6vw, 48px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 20px;
  flex: 1;
  min-height: 0;
}

.future-today {
  align-self: center;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 10px 22px;
  border: 1.5px solid var(--orchid);
  border-radius: 999px;
  background: rgba(201, 122, 212, 0.08);
}
.future-today__label {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(15px, 1.3vw, 18px);
  color: var(--orchid);
  letter-spacing: -0.01em;
}
.future-today__detail {
  font-size: 11px;
  color: var(--ink-soft);
  font-weight: 500;
}

.future-branches {
  position: relative;
  height: 36px;
  background:
    linear-gradient(to bottom, var(--orchid) 0%, var(--orchid) 100%) center top / 1.5px 14px no-repeat,
    linear-gradient(to right, transparent calc(12.5% - 0.75px), var(--orchid) calc(12.5% - 0.75px), var(--orchid) calc(12.5% + 0.75px), transparent calc(12.5% + 0.75px), transparent calc(37.5% - 0.75px), var(--orchid) calc(37.5% - 0.75px), var(--orchid) calc(37.5% + 0.75px), transparent calc(37.5% + 0.75px), transparent calc(62.5% - 0.75px), var(--orchid) calc(62.5% - 0.75px), var(--orchid) calc(62.5% + 0.75px), transparent calc(62.5% + 0.75px), transparent calc(87.5% - 0.75px), var(--orchid) calc(87.5% - 0.75px), var(--orchid) calc(87.5% + 0.75px), transparent calc(87.5% + 0.75px), transparent 100%) center / 100% 14px no-repeat;
  margin-bottom: -2px;
}
.future-branches::before {
  content: "";
  position: absolute;
  left: 12.5%;
  right: 12.5%;
  top: 14px;
  height: 1.5px;
  background: var(--orchid);
}
.future-branches::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 14px;
  height: 22px;
  background:
    linear-gradient(to bottom, var(--orchid), var(--orchid)) 12.5% 0 / 1.5px 100% no-repeat,
    linear-gradient(to bottom, var(--orchid), var(--orchid)) 37.5% 0 / 1.5px 100% no-repeat,
    linear-gradient(to bottom, var(--orchid), var(--orchid)) 62.5% 0 / 1.5px 100% no-repeat,
    linear-gradient(to bottom, var(--orchid), var(--orchid)) 87.5% 0 / 1.5px 100% no-repeat;
}

.future-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  flex: 1;
  min-height: 0;
}
@media (max-width: 1100px) {
  .future-cards { grid-template-columns: 1fr 1fr; }
  .future-branches { display: none; }
  #slide-future { height: auto; }
}

.future-card {
  background: var(--bg-card);
  border: 1px solid var(--line-orchid);
  border-radius: 14px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  backdrop-filter: blur(6px);
  transition: border-color 0.2s ease, transform 0.2s ease;
  position: relative;
  cursor: default;
  min-width: 0;
}
.future-card:hover {
  border-color: var(--orchid);
  transform: translateY(-2px);
}

.future-card__num {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(14px, 1.2vw, 16px);
  color: var(--orchid);
  font-variant-numeric: tabular-nums;
}

.future-card__title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(18px, 1.6vw, 22px);
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0;
  line-height: 1.2;
}

.future-card__lever {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--orchid);
}

.future-card__desc {
  font-size: 12px;
  line-height: 1.5;
  color: var(--ink-soft);
  margin: 0;
  flex: 1;
}

.future-card__stat {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.future-card__stat strong {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(20px, 1.8vw, 26px);
  color: var(--ink);
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}
.future-card__stat span {
  font-size: 11px;
  color: var(--ink-mute);
  font-weight: 500;
}

.future-card__hover {
  position: absolute;
  inset: 0;
  background: var(--midnight);
  border: 1px solid var(--orchid);
  border-radius: 14px;
  padding: 18px;
  display: flex;
  align-items: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
}
.future-card:hover .future-card__hover {
  opacity: 1;
  pointer-events: auto;
}
.future-card__hover p {
  font-family: var(--font-heading);
  font-weight: 500;
  font-style: italic;
  font-size: clamp(13px, 1.1vw, 15px);
  line-height: 1.5;
  color: var(--ink);
  margin: 0;
}

.future-more {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 14px;
  padding: 14px 22px;
  border-radius: 999px;
  font-size: 11px;
  color: var(--ink-soft);
  letter-spacing: 0.02em;
}
.future-more__label {
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--orchid);
  font-size: 10px;
}
.future-more__sep { color: var(--ink-mute); }
.future-more__item { color: var(--ink-soft); }

/* ============================================================
   SLIDE — THE ASK
   Phases, total, traction, what we want from the room.
   ============================================================ */
#slide-ask {
  padding-top: clamp(16px, 2.4vw, 32px);
  padding-bottom: clamp(28px, 4vw, 56px);
  height: 100vh;
  justify-content: flex-start;
  overflow: hidden;
}
#slide-ask .eyebrow { margin: 0 0 14px; }
#slide-ask .slide-title {
  font-size: clamp(30px, 3.6vw, 56px);
  max-width: none;
  margin: clamp(12px, 1.6vw, 24px) 0 12px;
}
#slide-ask .slide-deck {
  font-size: clamp(15px, 1.3vw, 18px);
  margin-top: 0;
  max-width: 80ch;
}
#slide-ask .slide-deck em {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 500;
  color: var(--orchid);
}

.ask-phases {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: clamp(24px, 3vw, 36px);
}
@media (max-width: 1100px) {
  .ask-phases { grid-template-columns: 1fr; }
  #slide-ask { height: auto; }
}

.ask-phase {
  background: var(--bg-card);
  border: 1px solid var(--line-orchid);
  border-radius: 14px;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  backdrop-filter: blur(6px);
  position: relative;
  cursor: default;
  min-width: 0;
}
.ask-phase--scale {
  border-color: var(--red-orange);
  background: rgba(240, 90, 40, 0.06);
}

.ask-phase__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
}
.ask-phase__num {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--orchid);
}
.ask-phase--scale .ask-phase__num { color: var(--red-orange); }
.ask-phase__date {
  font-size: 10px;
  font-weight: 500;
  color: var(--ink-mute);
  letter-spacing: 0.04em;
}
.ask-phase__title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(16px, 1.4vw, 19px);
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0;
  line-height: 1.2;
}
.ask-phase__desc {
  font-size: 12px;
  line-height: 1.45;
  color: var(--ink-soft);
  margin: 0;
  flex: 1;
}
.ask-phase__cost {
  padding-top: 8px;
  border-top: 1px solid var(--line);
}
.ask-phase__cost strong {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(20px, 1.8vw, 26px);
  color: var(--ink);
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}

.ask-phase__hover {
  position: absolute;
  inset: 0;
  background: var(--midnight);
  border: 1px solid var(--orchid);
  border-radius: 14px;
  padding: 16px 18px;
  display: flex;
  align-items: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
  overflow-y: auto;
}
.ask-phase--scale .ask-phase__hover { border-color: var(--red-orange); }
.ask-phase:hover .ask-phase__hover { opacity: 1; pointer-events: auto; }
.ask-phase__hover ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}
.ask-phase__hover li {
  font-size: 11px;
  color: var(--ink-soft);
  font-feature-settings: "tnum";
}

/* ---------- Totals row ---------- */
.ask-totals {
  display: grid;
  grid-template-columns: minmax(140px, auto) 1px minmax(0, 1fr);
  gap: 24px;
  margin-top: 18px;
  padding: 16px 22px;
  background: rgba(250, 243, 224, 0.04);
  border: 1px solid var(--line);
  border-radius: 14px;
  align-items: center;
}
@media (max-width: 900px) {
  .ask-totals { grid-template-columns: 1fr; gap: 12px; }
  .ask-totals__divider { display: none; }
}
.ask-totals__label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: 4px;
}
.ask-totals__num {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(28px, 2.6vw, 36px);
  color: var(--orchid);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.ask-totals__divider {
  width: 1px;
  background: var(--line);
  height: 100%;
  align-self: stretch;
}
.ask-totals__items {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-bottom: 4px;
}
.ask-fund {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--ink-soft);
}
.ask-fund--won { color: var(--orchid); }
.ask-fund--applied { color: var(--ink-soft); }
.ask-fund a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(201, 122, 212, 0.4);
  text-underline-offset: 3px;
  transition: color 0.15s ease, text-decoration-color 0.15s ease;
}
.ask-fund a:hover { color: var(--orchid); text-decoration-color: var(--orchid); }
.ask-fund__sub {
  font-weight: 400;
  font-style: italic;
  color: var(--ink-mute);
  font-size: 10px;
}
.ask-totals__sub {
  display: block;
  font-size: 11px;
  color: var(--ink-soft);
  line-height: 1.45;
}
.ask-totals__sub strong { color: var(--ink); font-weight: 600; }

/* ---------- CTA ---------- */
.ask-cta {
  margin-top: 14px;
  padding: 14px 22px;
  background: rgba(201, 122, 212, 0.06);
  border: 1px solid var(--line-orchid);
  border-radius: 14px;
}
.ask-cta p {
  margin: 0 0 6px;
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(15px, 1.3vw, 17px);
  color: var(--ink);
}
.ask-cta ul {
  margin: 0;
  padding: 0 0 0 18px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.ask-cta li {
  font-size: 12px;
  line-height: 1.45;
  color: var(--ink-soft);
}
.ask-cta strong { color: var(--ink); font-weight: 600; }

/* ============================================================
   PRINT / PDF
   Force 16:9 page size matching the on-screen design.
   ============================================================ */
@media print {
  @page {
    size: 1920px 1080px;
    margin: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    width: 1920px;
    background: var(--deep-space) !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    color-adjust: exact !important;
  }

  .slide {
    width: 1920px !important;
    height: 1080px !important;
    min-height: 1080px !important;
    max-height: 1080px !important;
    padding: 80px 100px !important;
    page-break-after: always;
    break-after: page;
    overflow: hidden;
    box-sizing: border-box;
  }
  .slide:last-of-type {
    page-break-after: auto;
    break-after: auto;
  }

  /* Force fixed paddings so clamp/vw don't behave weirdly in print */
  #slide-problem,
  #slide-solution,
  #slide-whynow,
  #slide-market,
  #slide-competition,
  #slide-business,
  #slide-team,
  #slide-future,
  #slide-ask {
    padding: 56px 100px 80px !important;
  }

  /* Cover keeps zero padding (cover__inner handles its own) */
  .cover { padding: 0 !important; }
  .cover__inner {
    width: 1920px !important;
    height: 1080px !important;
    padding: 80px 100px 56px !important;
  }

  /* Hide hover-only content; show defaults at full opacity */
  .team-card__hover,
  .future-card__hover {
    display: none !important;
  }
  .team-card__default,
  .future-card__default {
    opacity: 1 !important;
    position: static !important;
  }
  .team-card__body {
    min-height: 0 !important;
  }

  /* Disable backdrop-filter — slow / unreliable in print */
  .market__controls,
  .market__right,
  .reddit-card,
  .adventure-player,
  .whynow-card,
  .business-col,
  .team-card,
  .future-card,
  .ask-phase {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  /* Don't split cards across pages */
  .reddit-card,
  .whynow-card,
  .business-col,
  .team-card,
  .future-card,
  .ask-phase,
  .ask-totals {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Hide the cover CTA — non-functional in PDF, removes a "click me" hint */
  .cover__cta { display: none !important; }

  /* Hide audio player — can't play in PDF */
  .adventure-player__audio { display: none !important; }
  .adventure-player__tags { display: none !important; }

  /* Subtitle on Problem slide (hover hint) is misleading in PDF */
  .reddit-feed-header__label::after {
    content: " · click in browser";
    color: var(--ink-mute);
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    font-size: 9px;
  }

  /* Section borders — keep them visible on dark */
  .slide + .slide { border-top: none; }
}
.age-bar__axis {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 12px;
  margin-top: 6px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.age-bar__axis-ticks {
  display: flex;
  justify-content: space-between;
}

/* Market Size slide is content-heavy — tighter padding so it fits in one viewport */
#slide-market {
  padding-top: clamp(16px, 2.4vw, 32px);
  padding-bottom: clamp(28px, 4vw, 56px);
  height: 100vh;
  justify-content: flex-start;
}
#slide-market .eyebrow { margin: 0 0 6px; }
#slide-market .slide-title { font-size: clamp(28px, 4vw, 52px); }
#slide-market .slide-deck { font-size: clamp(15px, 1.3vw, 18px); margin-top: 8px; }

.eyebrow {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--t-small);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--orchid);
  margin: 0 0 20px;
}
.eyebrow .dot { color: var(--ink-mute); margin: 0 10px; }

.slide-title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: var(--t-title);
  line-height: 1.02;
  letter-spacing: -0.02em;
  margin: 0;
  color: var(--ink);
  text-wrap: balance;
}
.slide-title .accent {
  color: var(--orchid);
  font-style: italic;
  font-weight: 500;
}
.slide-title .magenta { color: var(--hot-magenta); font-style: italic; }
.slide-title .cyan { color: var(--cyan); font-style: italic; }

.slide-deck {
  font-size: var(--t-h3);
  font-weight: 400;
  line-height: 1.45;
  color: var(--ink-soft);
  margin: 20px 0 0;
  max-width: 60ch;
  text-wrap: pretty;
}

.slide-num {
  position: absolute;
  bottom: 28px;
  right: var(--pad-x);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--t-small);
  color: var(--ink-mute);
  letter-spacing: 0.12em;
}

.brand-mark {
  position: absolute;
  bottom: 28px;
  left: var(--pad-x);
  height: clamp(18px, 1.6vw, 22px);
  width: auto;
  opacity: 0.85;
}

/* ============================================================
   SLIDE 1 — COVER
   Dark background, bold orchid + magenta. Confident, not soft.
   ============================================================ */
.cover {
  background: var(--deep-space);
  color: var(--warm-cream);
  padding: 0;
  overflow: hidden;
}

.cover__inner {
  position: relative;
  height: 100vh;
  min-height: 600px;
  padding: var(--pad-y) var(--pad-x) clamp(28px, 3.5vw, 48px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 1;
}

.cover__top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.cover__logo {
  height: clamp(28px, 3vw, 44px);
  width: auto;
  display: block;
}
.cover__chip {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--t-small);
  letter-spacing: 0.04em;
  color: var(--warm-cream);
  padding: 8px 16px;
  border: 1px solid rgba(250, 243, 224, 0.25);
  border-radius: 999px;
  background: rgba(250, 243, 224, 0.04);
  text-decoration: none;
  transition: all 0.15s ease;
}
.cover__chip:hover {
  border-color: var(--orchid);
  color: var(--orchid);
}

.cover__center { max-width: none; }

.cover__brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.cover__tagline {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--t-small);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--orchid);
  margin: 0;
}

.cover__title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(36px, 5.4vw, 80px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 0;
  color: var(--warm-cream);
  text-wrap: balance;
  max-width: none;
}
.cover__title .accent { font-style: italic; font-weight: 500; }
.cover__title .accent { color: var(--orchid); }
.cover__title .magenta { color: var(--hot-magenta); }

.cover__sub {
  font-size: var(--t-h3);
  font-weight: 400;
  line-height: 1.4;
  color: rgba(250, 243, 224, 0.72);
  margin: 32px 0 0;
  max-width: 48ch;
}

.cover__cta {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 64px;
  padding: 18px 32px;
  background: var(--orchid);
  color: var(--deep-space);
  border: none;
  border-radius: 999px;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--t-body);
  letter-spacing: -0.01em;
  cursor: pointer;
  text-decoration: none;
  transition: transform 0.18s ease, background 0.18s ease;
}
.cover__cta:hover {
  background: var(--hot-magenta);
  color: var(--warm-cream);
  transform: translateY(-2px);
}
.cover__cta-arrow { transition: transform 0.18s ease; }
.cover__cta:hover .cover__cta-arrow { transform: translateX(4px); }

.cover__bottom {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  font-size: var(--t-small);
  color: rgba(250, 243, 224, 0.55);
}
.cover__byline {
  font-family: var(--font-body);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--warm-cream);
}
.cover__byline .meta-inline {
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: rgba(250, 243, 224, 0.55);
  margin-left: 6px;
}
.cover__email {
  display: block;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: rgba(250, 243, 224, 0.7);
  margin-top: 4px;
  text-decoration: none;
}
.cover__email:hover { color: var(--orchid); }

.cover__interactive-note { max-width: 38ch; text-align: right; }
.cover__interactive-note a {
  color: var(--orchid);
  text-decoration: underline;
  text-decoration-color: rgba(201, 122, 212, 0.4);
  text-underline-offset: 2px;
  transition: color 0.15s ease, text-decoration-color 0.15s ease;
}
.cover__interactive-note a:hover { color: var(--hot-magenta); text-decoration-color: var(--hot-magenta); }

/* ============================================================
   SLIDE — MARKET SIZE
   ============================================================ */
.market {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  gap: clamp(20px, 2.5vw, 36px);
  align-items: stretch;
  margin-top: clamp(36px, 4.5vw, 56px);
  flex: 1;
  min-height: 0;
}
@media (max-width: 900px) {
  .market { grid-template-columns: 1fr; }
  #slide-market { height: auto; }
}

.market__left { display: flex; flex-direction: column; }

.market__controls {
  background: var(--bg-card);
  border: 1px solid var(--line-orchid);
  border-radius: 16px;
  padding: 18px 22px;
  flex: 1;
  backdrop-filter: blur(6px);
}

.market__controls h3 {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin: 0 0 12px;
}

.toggle-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 14px;
}
.toggle-row:last-child { margin-bottom: 0; }

.toggle-row__label {
  flex-basis: 100%;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-mute);
  margin-bottom: 4px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.chip {
  appearance: none;
  border: 1.5px solid var(--line);
  background: transparent;
  color: var(--ink-soft);
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 13px;
  padding: 6px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.chip:hover {
  border-color: var(--orchid);
  color: var(--orchid);
}
.chip[aria-pressed="true"] {
  background: var(--orchid);
  border-color: var(--orchid);
  color: var(--deep-space);
  font-weight: 600;
}
.chip__flag {
  display: inline-block;
  margin-left: 4px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--red-orange);
}
.chip[aria-pressed="true"] .chip__flag { color: rgba(13, 4, 24, 0.6); }

.beachhead-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 14px;
  padding: 7px 14px;
  background: transparent;
  border: 1.5px solid var(--line);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-soft);
  cursor: pointer;
  transition: all 0.15s ease;
  font-family: var(--font-body);
}
.beachhead-toggle:hover { border-color: var(--red-orange); color: var(--red-orange); }
.beachhead-toggle[aria-pressed="true"] {
  background: var(--red-orange);
  border-color: var(--red-orange);
  color: var(--warm-cream);
}

.market__scope-note {
  margin: 14px 0 0;
  font-size: var(--t-micro);
  color: var(--ink-mute);
}

/* ---------- Right panel: TAM display ---------- */
.market__right {
  background: var(--bg-card);
  border: 1px solid var(--line-orchid);
  border-radius: 16px;
  padding: 22px 26px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(6px);
}

.market__tam {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin: 0 0 4px;
}

.market__num {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(44px, 6vw, 80px);
  line-height: 1;
  letter-spacing: -0.035em;
  color: var(--orchid);
  margin: 0;
  font-variant-numeric: tabular-nums;
  transition: color 0.3s ease;
}
.market__num-sub {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  color: var(--ink-soft);
  margin: 4px 0 0;
}

.market__breakdown {
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.market__breakdown-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 7px 0;
  font-size: 13px;
}
.market__breakdown-row:not(:last-child) { border-bottom: 1px dashed var(--line); }
.market__breakdown-label {
  color: var(--ink-soft);
  font-weight: 500;
}
.market__breakdown-hint {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: var(--ink-mute);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-top: 2px;
}
.market__breakdown-value {
  font-weight: 700;
  color: var(--orchid);
  font-variant-numeric: tabular-nums;
}

/* ---------- Capture rate presets ---------- */
/* ---------- Capture rate slider ---------- */
.capture-control {
  position: relative;
  margin: 28px 0 0;
  padding: 0 11px;
}
.capture-slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  background: var(--line);
  border-radius: 999px;
  outline: none;
  cursor: pointer;
  margin: 0;
}
.capture-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--orchid);
  border: 3px solid var(--bg-card);
  box-shadow: 0 1px 3px rgba(13, 4, 24, 0.2);
  cursor: pointer;
  transition: transform 0.12s ease;
}
.capture-slider::-webkit-slider-thumb:hover { transform: scale(1.12); }
.capture-slider::-moz-range-thumb {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--orchid);
  border: 3px solid var(--bg-card);
  box-shadow: 0 1px 3px rgba(13, 4, 24, 0.2);
  cursor: pointer;
}

.capture-thumb-label {
  position: absolute;
  top: -22px;
  left: 11px;
  transform: translateX(-50%);
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 14px;
  color: var(--orchid);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  pointer-events: none;
  white-space: nowrap;
  transition: left 0.05s linear;
}

.capture-labels {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--ink-mute);
}

/* ---------- Beachhead callout ---------- */
.market__beachhead {
  padding: 14px 16px;
  background: var(--orchid);
  color: var(--deep-space);
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.45;
}
.market__beachhead strong {
  display: block;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--deep-space);
  opacity: 0.7;
  margin-bottom: 4px;
}
.market__beachhead em {
  font-style: normal;
  font-weight: 700;
  color: var(--deep-space);
  border-bottom: 1.5px solid rgba(13, 4, 24, 0.35);
}

/* Sources footer */
.market__sources {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin-top: 14px;
  font-size: 11px;
  color: var(--ink-mute);
}
.market__sources span:first-child {
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.market__sources a {
  color: var(--ink-soft);
  text-decoration: underline;
  text-decoration-color: var(--line);
  text-underline-offset: 3px;
  transition: color 0.15s ease;
}
.market__sources a:hover { color: var(--orchid); text-decoration-color: var(--orchid); }
.market__sources-note {
  flex-basis: 100%;
  font-style: italic;
  color: var(--ink-mute);
  font-size: 11px;
}
