/* ═══════════════════════════════════════════════════════════
   Investing for Mummies — homepage
   Follows IFM Brand Guidelines 2026 v2.0:
   navy/teal/mint/gold palette · Lora + Nunito only ·
   radius 16/14/12/10 · soft navy shadows · 135° gradients.
   ═══════════════════════════════════════════════════════════ */
:root {
  /* Brand palette (guidelines §3) */
  --navy:      #1a3a5c;
  --navy-lt:   #264d78;
  --teal:      #2a9d8f;
  --teal-dk:   #1f7d72;
  --muted:     #5a7d8a;
  --cream:     #f7faf9;
  --white:     #ffffff;
  --mint:      #bde9e4;
  --mint-lt:   #e0f3f0;
  --gold:      #c9a84c;
  --gold-lt:   #f5f0e0;
  --success:   #27ae60;

  /* semantic aliases used across the page */
  --paper:      var(--cream);
  --paper-2:    var(--mint-lt);
  --sand:       #dcebe8;
  --ink:        var(--navy);
  --ink-soft:   var(--muted);
  --ink-mute:   #7e98a2;
  --line:       var(--mint);
  --line-soft:  #d9efeb;
  --teal-deep:  var(--navy);
  --sage:       var(--teal);
  --sage-deep:  var(--teal-dk);
  --mint-soft:  var(--mint-lt);
  --coral:      var(--teal);
  --coral-deep: var(--teal-dk);
  --coral-soft: var(--mint);
  --gold-soft:  var(--gold-lt);
  --card:       var(--white);

  --shadow:     0 2px 12px rgba(26,58,92,.06);
  --shadow-lg:  0 8px 24px rgba(26,58,92,.15);

  --grad-primary: linear-gradient(135deg, var(--navy), var(--teal));

  --serif: 'Lora', Georgia, serif;
  --sans:  'Nunito', system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html, body { overflow-x: clip; }
body {
  margin: 0;
  background: var(--cream);
  color: var(--navy);
  font-family: var(--sans);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; display: block; }
a { color: var(--teal-dk); text-decoration: none; }
a:hover { color: var(--navy); }
button { font: inherit; color: inherit; border: none; background: none; cursor: pointer; }

.wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 32px; }
/* headspace-style soft blobs behind key sections */
section { padding: 104px 0; position: relative; }
#founder, #book, #corporate { overflow: hidden; }
#founder::before {
  content: ''; position: absolute; width: 560px; height: 560px; border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, rgba(189,233,228,.65), transparent 68%);
  top: -160px; right: -160px; pointer-events: none;
}
#book::before {
  content: ''; position: absolute; width: 520px; height: 520px; border-radius: 50%;
  background: radial-gradient(circle at 60% 40%, rgba(245,240,224,.9), transparent 68%);
  bottom: -140px; left: -140px; pointer-events: none;
}
#corporate::after {
  content: ''; position: absolute; width: 440px; height: 440px; border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, rgba(42,157,143,.10), transparent 70%);
  top: -120px; left: -120px; pointer-events: none;
}
.section-sand { background: var(--mint-lt); }
.section-teal { background: linear-gradient(135deg, var(--navy-lt), var(--navy)); color: var(--mint-lt); }

.display, h1, h2, h3 { font-family: var(--serif); font-weight: 600; letter-spacing: -0.01em; line-height: 1.05; }

.eyebrow {
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--teal-dk);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.eyebrow::before { content:''; width: 22px; height: 2px; background: var(--teal); border-radius: 2px; }
.eyebrow.on-teal { color: var(--gold); }
.eyebrow.on-teal::before { background: var(--gold); }

.hand {
  font-family: var(--serif);
  font-style: italic;
  color: var(--teal-dk);
  font-size: 1.35em;
  line-height: 1.1;
}

/* Buttons — radius 12, Nunito 800 (guidelines §5) */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 28px; border-radius: 12px;
  font-family: var(--sans); font-weight: 800; font-size: 15px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
  cursor: pointer; border: 2px solid transparent; white-space: nowrap;
}
.btn .arw { transition: transform .18s ease; }
.btn:hover .arw { transform: translateX(4px); }
.btn-primary { background: var(--grad-primary); color: #fff; box-shadow: 0 4px 16px rgba(26,58,92,.2); }
.btn-primary:hover { color:#fff; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(26,58,92,.25); }
.btn-teal { background: var(--grad-primary); color: #fff; box-shadow: 0 4px 16px rgba(26,58,92,.2); }
.btn-teal:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(26,58,92,.25); }
.btn-ghost { border-color: var(--mint); color: var(--muted); background: var(--white); }
.btn-ghost:hover { border-color: var(--teal); color: var(--navy); }
.btn-gold { background: var(--gold); color: #fff; box-shadow: 0 4px 16px rgba(26,58,92,.18); }
.btn-gold:hover { background: #b8973d; color: #fff; transform: translateY(-2px); }
.btn-lg { padding: 17px 34px; font-size: 16px; }

/* ── cinematic intro ── */
.intro {
  position: fixed; inset: 0; z-index: 200; background: var(--navy);
  display: grid; place-items: center; cursor: pointer;
  transition: transform .7s cubic-bezier(.7,0,.3,1);
}
.intro.exit { transform: translateY(-100%); }
.intro-word {
  font-family: var(--serif); font-weight: 700; font-style: italic;
  font-size: clamp(80px, 16vw, 240px); color: #fff; position: relative;
  animation: introPop .5s cubic-bezier(.2,.9,.3,1.2) both;
}
.intro-word.struck::after {
  content: ''; position: absolute; left: -4%; right: 104%; top: 52%; height: 8px;
  background: var(--gold); border-radius: 8px; right: auto; width: 0;
  animation: strike .3s ease .18s forwards;
}
@keyframes strike { to { width: 108%; } }
@keyframes introPop { from { opacity: 0; transform: scale(.85) translateY(20px); } to { opacity: 1; transform: none; } }
.intro-final {
  font-family: var(--serif); font-weight: 600;
  font-size: clamp(40px, 7vw, 96px); color: #fff; text-align: center; padding: 0 24px;
  animation: introPop .6s cubic-bezier(.2,.9,.3,1.2) both;
}
.intro-final em { font-style: italic; color: var(--gold); }
.intro-skip {
  position: absolute; bottom: 28px; right: 32px; color: rgba(224,243,240,.6);
  font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
}
.intro-skip:hover { color: #fff; }

/* ── kinetic type hero ── */
.heroX { padding: 64px 0 88px; overflow: hidden; position: relative; }
.heroX::before {
  content: ''; position: absolute; width: 620px; height: 620px; border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, rgba(189,233,228,.55), transparent 68%);
  top: -200px; right: -180px; pointer-events: none;
}
.hx-lines { max-width: 1280px; margin: 0 auto; padding: 0 32px; position: relative; z-index: 2; }
.hx-line {
  font-family: var(--serif); font-weight: 600; color: var(--navy);
  font-size: clamp(58px, 9.6vw, 148px); line-height: 1.02; letter-spacing: -0.02em;
  display: flex; align-items: center; gap: clamp(10px, 1.6vw, 26px); white-space: nowrap;
}
.hx-line em { font-style: italic; color: var(--teal); }
.hx-line.l3 em { color: var(--teal-dk); }
.hx-line { opacity: 0; transform: translateY(60px); animation: hxIn .9s cubic-bezier(.2,.75,.25,1) forwards; }
.hx-line.l1 { animation-delay: .05s; }
.hx-line.l2 { animation-delay: .17s; }
.hx-line.l3 { animation-delay: .29s; }
@keyframes hxIn { to { opacity: 1; transform: none; } }
.hx-chip {
  display: inline-block; height: .74em; aspect-ratio: 1.45; border-radius: 100px;
  overflow: hidden; flex: none; box-shadow: 0 8px 24px rgba(26,58,92,.25);
  border: 3px solid var(--white); will-change: transform;
}
.hx-chip img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hx-chip.tall { aspect-ratio: 1.1; border-radius: 34px; }
.hx-chip.round { aspect-ratio: 1; border-radius: 50%; }
.hx-coin {
  display: inline-grid; place-items: center; height: .6em; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 32% 30%, #f0d9a8, var(--gold) 70%, #8a640f);
  color: var(--navy); font-size: .38em; font-weight: 700; flex: none;
  box-shadow: 0 8px 20px rgba(201,168,76,.4); animation: coinBob 4.5s ease-in-out infinite;
}
@keyframes coinBob { 0%,100% { transform: translateY(0) rotate(-6deg); } 50% { transform: translateY(-10px) rotate(6deg); } }
.hx-sub-row {
  max-width: 1280px; margin: 44px auto 0; padding: 0 32px;
  display: flex; align-items: center; gap: 40px; flex-wrap: wrap; position: relative; z-index: 2;
  opacity: 0; animation: hxIn .8s ease .5s forwards;
}
.hx-sub { font-size: 19px; line-height: 1.5; color: var(--muted); max-width: 340px; margin: 0; }
.hx-sub em { font-style: italic; color: var(--teal-dk); font-family: var(--serif); font-size: 1.08em; }
.hx-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-avatars .av img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 900px) {
  .hx-line { white-space: normal; flex-wrap: wrap; }
}

/* ── Nav ── */
.nav {
  position: sticky; top: 0; z-index: 60;
  background: color-mix(in oklab, var(--cream) 90%, transparent);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line-soft);
}
.nav-in { max-width: 1280px; margin: 0 auto; padding: 14px 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.nav-brand { display: flex; align-items: center; gap: 12px; }
.nav-brand img { width: auto; height: 48px; }
.nav-brand b { font-family: var(--serif); font-weight: 700; font-size: 21px; letter-spacing: -.01em; color: var(--navy); }
.nav-links { display: flex; gap: 28px; align-items: center; }
.nav-links a { font-family: var(--sans); font-weight: 700; font-size: 14.5px; color: var(--muted); transition: color .18s; }
.nav-links a:hover { color: var(--navy); }

/* ── Hero ── */
.hero { padding: 72px 0 88px; overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 64px; align-items: center; }
/* she.inc / girlswhocode scale — bigger, cleaner type */
.hero h1 { font-size: clamp(50px, 6.6vw, 98px); margin: 20px 0 24px; color: var(--navy); }
.hero h1 em { font-style: italic; color: var(--teal); }
.hero .sub { font-size: 20px; line-height: 1.55; color: var(--muted); max-width: 520px; margin-bottom: 32px; }
.hero-cta { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.hero-trust { margin-top: 30px; display: flex; align-items: center; gap: 16px; color: var(--muted); font-size: 14.5px; }
.hero-avatars { display: flex; }
.hero-avatars .av {
  width: 40px; height: 40px; border-radius: 50%; border: 2.5px solid var(--cream);
  margin-left: -12px; overflow: hidden; background: var(--sand);
}
.hero-avatars .av:first-child { margin-left: 0; }

/* Hero collage */
.hero-collage { position: relative; height: 560px; }
.hero-photo { position: absolute; border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-lg); background: var(--sand); }
.hero-photo.p1 { width: 62%; height: 68%; top: 0; right: 0; z-index: 2; }
.hero-photo.p2 { width: 46%; height: 46%; bottom: 0; left: 0; z-index: 3; border: 6px solid var(--cream); }
.hero-photo.p3 { width: 34%; height: 34%; top: 40%; right: 8%; z-index: 4; border: 6px solid var(--cream); border-radius: 50%; }
.hero-note {
  position: absolute; z-index: 5; bottom: 8%; right: -2%;
  background: var(--gold-lt); color: var(--navy);
  font-family: var(--serif); font-style: italic; font-weight: 600;
  font-size: 20px; line-height: 1.2;
  padding: 14px 20px; border-radius: 14px; transform: rotate(-3deg);
  box-shadow: var(--shadow); max-width: 210px;
  border: 1px solid #e8dcb4;
}
.hero-blob { position: absolute; z-index: 1; width: 320px; height: 320px; background: radial-gradient(circle at 40% 40%, var(--mint), transparent 70%); top: -40px; left: -40px; opacity: .8; }

/* Section heads */
.shead { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: end; margin-bottom: 56px; }
.shead h2 { font-size: clamp(40px, 5vw, 68px); margin: 14px 0 0; color: var(--navy); }
.shead h2 em { font-style: italic; color: var(--teal); }
.shead p { color: var(--muted); font-size: 18px; margin: 0; max-width: 460px; }
.section-teal .shead h2 { color: #fff; }
.section-teal .shead h2 em { color: var(--gold); }
.section-teal .shead p { color: color-mix(in oklab, var(--mint-lt) 82%, transparent); }

/* ── Founder note ── */
.founder { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 72px; align-items: center; }
.founder-photo { position: relative; }
.founder-photo .frame { aspect-ratio: 4/5; border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-lg); background: var(--sand); }
.founder-photo .sig-badge {
  position: absolute; bottom: -20px; left: -20px; background: var(--white);
  padding: 16px 20px; border-radius: 14px; box-shadow: var(--shadow-lg);
}
.founder-photo .sig-badge .n { font-family: var(--serif); font-style: italic; font-weight: 600; font-size: 28px; color: var(--teal-dk); line-height: 1; }
.founder-photo .sig-badge small { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-mute); font-weight: 800; }
.founder h2 { font-size: clamp(34px, 3.8vw, 50px); margin: 16px 0 22px; color: var(--navy); }
.founder h2 em { font-style: italic; color: var(--teal); }
.founder p { color: var(--muted); font-size: 18px; line-height: 1.68; margin: 0 0 18px; }
.founder p strong { color: var(--navy); font-weight: 800; }
.founder .pull { font-family: var(--serif); font-size: 25px; font-style: italic; color: var(--teal-dk); line-height: 1.35; margin: 24px 0; font-weight: 600; }

/* ═══ GAME NIGHT spectacle ═══ */
.gn {
  position: relative; margin: 0 0 28px; border-radius: 18px; overflow: hidden;
  background: linear-gradient(165deg, #0e2237, #1a3a5c 70%, #14304d);
  padding: 54px 34px 30px; box-shadow: 0 24px 60px rgba(14,34,55,.45);
}
.gn-marquee { position: absolute; top: 0; left: 0; right: 0; height: 12px; display: flex; justify-content: space-around; align-items: center; }
.gn-marquee i { width: 7px; height: 7px; border-radius: 50%; background: var(--gold); opacity: .25; }
@media (prefers-reduced-motion: no-preference) {
  .gn-marquee i { animation: gnBulb 1.4s ease-in-out infinite; }
}
@keyframes gnBulb { 0%,100% { opacity: .2; box-shadow: none; } 50% { opacity: 1; box-shadow: 0 0 10px 2px rgba(240,217,168,.7); } }
.gn-live { display: inline-flex; align-items: center; gap: 10px; font-size: 11.5px; font-weight: 800; letter-spacing: .2em; color: var(--gold); margin-bottom: 22px; }
.gn-live-dot { width: 9px; height: 9px; border-radius: 50%; background: #e34f4f; animation: gnPulse 1.2s ease-in-out infinite; }
@keyframes gnPulse { 0%,100% { opacity: 1; } 50% { opacity: .3; } }
.gn-stage { display: grid; grid-template-columns: 1.25fr 1fr; gap: 22px; align-items: stretch; }

.gn-screen { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.13); border-radius: 14px; padding: 22px 24px; display: flex; flex-direction: column; }
.gn-screen-head { display: flex; align-items: center; gap: 10px; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: rgba(224,243,240,.65); }
.gn-logo { width: auto; height: 28px; }
.gn-timer { margin-left: auto; width: 14px; height: 14px; border-radius: 50%; border: 2.5px solid var(--gold); border-top-color: transparent; opacity: .4; }
.gn-timer.run { opacity: 1; animation: gnSpin 1s linear infinite; }
@keyframes gnSpin { to { transform: rotate(360deg); } }
.gn-q { font-family: var(--serif); font-weight: 600; font-size: clamp(21px, 2.3vw, 30px); color: #fff; margin: 18px 0 16px; line-height: 1.2; animation: gnQIn .45s ease both; }
@keyframes gnQIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.gn-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.gn-opt { border: 1px solid rgba(255,255,255,.16); border-radius: 10px; padding: 11px 14px; font-size: 14.5px; font-weight: 700; color: rgba(224,243,240,.92); transition: all .3s; }
.gn-opt b { color: var(--gold); margin-right: 8px; }
.gn-opt.locked { opacity: .55; }
.gn-opt.win { background: rgba(42,157,143,.3); border-color: #2a9d8f; box-shadow: 0 0 24px rgba(42,157,143,.35); opacity: 1; }
.gn-status { margin-top: 14px; font-size: 13px; font-weight: 700; color: rgba(224,243,240,.6); min-height: 20px; }
.gn-flash { color: #fff; animation: gnQIn .3s ease both; }
.gn-flash.gold { color: var(--gold); }

.gn-board { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.13); border-radius: 14px; padding: 18px 20px; }
.gn-board-title { font-size: 11px; font-weight: 800; letter-spacing: .18em; color: rgba(224,243,240,.65); margin-bottom: 14px; }
.gn-rows { position: relative; }
.gn-row { position: absolute; left: 0; right: 0; height: 38px; display: flex; align-items: center; gap: 10px; transition: transform .8s cubic-bezier(.2,.9,.3,1); }
.gn-rank { width: 22px; text-align: center; font-size: 14px; font-weight: 800; color: rgba(224,243,240,.7); }
.gn-dot { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.gn-name { width: 64px; font-size: 14px; font-weight: 800; color: #fff; }
.gn-bar { flex: 1; height: 8px; border-radius: 8px; background: rgba(255,255,255,.09); overflow: hidden; }
.gn-bar i { display: block; height: 100%; border-radius: 8px; transition: width .8s cubic-bezier(.2,.9,.3,1); }
.gn-score { width: 78px; text-align: right; font-size: 13.5px; font-weight: 800; color: var(--gold); font-variant-numeric: tabular-nums; position: relative; }
.gn-plus { position: absolute; right: 0; top: -16px; font-size: 11px; color: #7be2b8; animation: gnPlus 1.4s ease both; }
@keyframes gnPlus { 0% { opacity: 0; transform: translateY(6px); } 25% { opacity: 1; } 100% { opacity: 0; transform: translateY(-10px); } }

.gn-phones { display: flex; justify-content: center; gap: 18px; margin-top: 26px; flex-wrap: wrap; }
.gn-phone { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.gn-phone-name { font-size: 11px; font-weight: 800; letter-spacing: .06em; }
.gn-phone-body { width: 52px; height: 78px; border-radius: 12px; border: 2px solid rgba(255,255,255,.22); background: rgba(255,255,255,.05); display: grid; place-items: center; transition: all .3s; }
.gn-phone.in .gn-phone-body { border-color: #2a9d8f; background: rgba(42,157,143,.22); box-shadow: 0 0 18px rgba(42,157,143,.35); }
.gn-check { color: #7be2b8; font-size: 22px; font-weight: 800; animation: gnQIn .3s ease both; }
.gn-dots { display: flex; gap: 3px; }
.gn-dots i { width: 5px; height: 5px; border-radius: 50%; background: rgba(224,243,240,.5); animation: gnType 1s ease-in-out infinite; }
.gn-dots i:nth-child(2) { animation-delay: .15s; }
.gn-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes gnType { 0%,100% { opacity: .3; } 50% { opacity: 1; } }

.gn-confetti { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.gn-confetti i { position: absolute; top: -14px; border-radius: 2px; animation: gnFall linear both; }
@keyframes gnFall { to { transform: translateY(120vh) rotate(540deg); } }

.gn-caption { text-align: center; margin-top: 24px; font-size: 14.5px; color: rgba(224,243,240,.75); font-weight: 600; }
.gn-caption b { color: var(--gold); }

@media (max-width: 900px) {
  .gn-stage { grid-template-columns: 1fr; }
  .gn-phones { gap: 10px; }
}

/* ── stacked game deck (lxme-style card stacking) ── */
.game-stack { position: relative; }
/* slots are transparent wrappers — cards behave as direct siblings */
.game-stack-slot { display: contents; }
.game-stack .game-stack-card {
  position: sticky;
  margin-bottom: 46vh;
  height: clamp(460px, 64vh, 620px);
  box-shadow: 0 -18px 50px rgba(14,34,55,.35), 0 8px 24px rgba(26,58,92,.2);
  will-change: transform, filter;
  transform-origin: top center;
}
.game-stack .game-stack-slot:last-child .game-stack-card { margin-bottom: 0; }
.game-stack-num {
  margin-left: auto; align-self: flex-start;
  font-size: 12px; font-weight: 800; letter-spacing: .12em;
  color: rgba(26,58,92,.45); font-variant-numeric: tabular-nums;
  padding-right: 66px; /* clear the tag pill */
}
@media (max-width: 900px) {
  .game-stack .game-stack-card { position: static; margin-bottom: 20px; transform: none !important; filter: none !important; height: auto; }
}

/* ── Games showcase — cards styled like the actual games catalogue (guidelines §7):
   pastel gradient pairs, huge emoji, Lora navy titles, tag pill top-right ── */
.games-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.game-card {
  position: relative; border-radius: 14px; overflow: hidden; padding: 26px;
  min-height: 270px; display: flex; flex-direction: column; gap: 16px;
  color: var(--navy); box-shadow: 0 2px 12px rgba(26,58,92,.06);
  transition: transform .2s ease, box-shadow .2s ease; cursor: default;
}
.game-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(26,58,92,.25); }
.game-head { display: flex; align-items: center; gap: 18px; }
.game-emoji-big { font-size: 4.4rem; line-height: 1; flex: none; filter: drop-shadow(0 4px 8px rgba(26,58,92,.18)); }
.game-tag-pill {
  position: absolute; top: 12px; right: 12px;
  font-size: 10px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; padding: 3px 10px; border-radius: 10px;
  background: rgba(255,255,255,.78); color: var(--navy);
  box-shadow: 0 1px 4px rgba(26,58,92,.12); z-index: 2;
}
.game-body { display: grid; grid-template-columns: 1fr 150px; gap: 18px; align-items: stretch; flex: 1; }
.game-shot { border-radius: 10px; overflow: hidden; background: rgba(255,255,255,.5); border: 2px dashed rgba(26,58,92,.22); min-height: 130px; }
.game-try { font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--teal-dk); margin-top: 6px; }
.game-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 12.5px; font-weight: 700; color: var(--muted); flex-wrap: wrap; }
.game-foot a { color: var(--teal-dk); font-weight: 800; }
.game-foot a:hover { color: var(--navy); }

/* mini-game internals — .opt spec from guidelines §5 */
.gm { flex: 1; display: grid; grid-template-columns: 1fr 132px; gap: 14px; align-items: stretch; }
.gm-col { display: flex; min-width: 0; }
.gm-col .gm-stage { flex: 1; }
.gm-shot { border-radius: 10px; overflow: hidden; background: rgba(255,255,255,.55); border: 2px dashed rgba(26,58,92,.22); }
.gm-shot img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
@media (max-width: 640px) { .gm { grid-template-columns: 1fr; } .gm-shot { min-height: 150px; } }
.gm-stage { background: rgba(255,255,255,.6); border-radius: 12px; padding: 16px 18px; flex: 1; display: flex; flex-direction: column; gap: 10px; }
.gm-suitor { font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.gm-pitch { font-family: var(--serif); font-style: italic; font-weight: 600; font-size: 19px; color: var(--navy); line-height: 1.3; }
.gm-row { display: flex; gap: 8px; flex-wrap: wrap; }
.gm-opt {
  flex: 1; min-width: 90px; padding: 10px 12px; border: 2px solid var(--teal); border-radius: 12px;
  background: #fff; font: 700 0.92rem 'Nunito', sans-serif; color: var(--navy);
  box-shadow: 0 2px 8px rgba(42,157,143,.10); transition: all .15s ease; text-align: center;
}
.gm-opt:hover { border-color: var(--navy); background: var(--mint-lt); transform: translateY(-1px); }
.gm-opt.buy { border-color: var(--success); }
.gm-opt.kbc { text-align: left; }
.gm-opt.correct { border-color: var(--success); color: #1a5c3a; background: #e8f5f2; }
.gm-opt.wrong { border-color: #c0392b; color: #7a1a1a; background: #fce8e8; }
.gm-opt.dim { opacity: .45; }
.gm-letter { font-weight: 900; color: var(--teal-dk); margin-right: 6px; }
.gm-kbc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.gm-feedback { border-radius: 10px; padding: 12px 14px; font-size: 14px; line-height: 1.5; }
.gm-feedback.ok  { background: #e8f5f2; border-left: 4px solid var(--success); color: #1a5c3a; }
.gm-feedback.bad { background: #fce8e8; border-left: 4px solid #c0392b; color: #7a1a1a; }
.gm-feedback b { display: block; margin-bottom: 2px; }
.gm-next { display: block; margin-top: 8px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--teal-dk); }
.gm-next:hover { color: var(--navy); }
.gm-ticker { display: flex; justify-content: space-between; align-items: baseline; }
.gm-cash { font-family: var(--serif); font-weight: 700; font-size: 26px; color: var(--navy); font-variant-numeric: tabular-nums; }
.gm-round { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.gm-tm-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.gm-tm-head .on { color: var(--navy); }
.gm-tm-lever { padding: 8px 16px; border-radius: 12px; border: 2px solid var(--gold); background: var(--gold-lt); font: 800 13px 'Nunito', sans-serif; color: var(--navy); transition: all .15s; }
.gm-tm-lever:hover { background: var(--gold); transform: translateY(-1px); }
.gm-tm-row { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px dashed rgba(26,58,92,.15); font-size: 15px; color: var(--navy); font-weight: 600; }
.gm-tm-row b { font-family: var(--serif); font-size: 18px; transition: color .3s; }
.gm-tm-then { color: #c0392b; }
.gm-tm-note { font-size: 13px; font-style: italic; color: var(--muted); }

/* mid-game photo band */
.game-room { margin-top: 20px; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 14px; align-items: stretch; }
.game-room-copy { display: flex; flex-direction: column; justify-content: center; padding-right: 10px; }
.game-room-shot { border-radius: 12px; overflow: hidden; min-height: 190px; background: rgba(255,255,255,.1); }
.gc-coral { background: linear-gradient(135deg, #e0f3f0, #bde9e4); }   /* Swayamvar — mint/teal */
.gc-teal  { background: linear-gradient(135deg, #e8f5f2, #c4e8d6); }   /* Stock Rush — its green */
.gc-sage  { background: linear-gradient(135deg, #e6edf5, #c6d7e8); }   /* Time Machine — navy tint */
.gc-gold  { background: linear-gradient(135deg, #f5f0e0, #eBD9a0); }   /* KBC — gold */
/* actual-game palettes */
.gc-stockrush { background: linear-gradient(150deg, #ffffff, #f0eee7); border: 1px solid #e4e1d6; }   /* Stock Rush Pro — its clean paper UI */
.gc-kbc { background: linear-gradient(150deg, #0d3b3a, #062225); }   /* KBC — the show's dark teal stage */
.gc-kbc .game-tag-pill { background: rgba(201,168,76,.9); color: #062225; }

/* dark-card overrides — shared by KBC + Mutual Fund cards */
.game-card.game-dark h3 { color: #fff; }
.game-dark .game-try { color: #7be2b8; }
.game-dark .game-foot span { color: rgba(224,243,240,.75); }
.game-dark .game-foot a { color: #7be2b8; }
.game-dark .game-stack-num { color: rgba(224,243,240,.45); }
.game-dark .game-emoji-big { filter: drop-shadow(0 4px 10px rgba(0,0,0,.5)); }
.game-dark .gm-stage { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); }
.game-dark .gm-suitor, .game-dark .gm-round { color: rgba(224,243,240,.65); }
.game-dark .gm-pitch, .game-dark .gm-cash { color: #fff; }
.game-dark .gm-opt { background: rgba(255,255,255,.1); color: #fff; border-color: rgba(255,255,255,.3); }
.game-dark .gm-opt:hover { background: rgba(255,255,255,.2); border-color: #c9a84c; }
.game-dark .gm-letter { color: #f0d9a8; }
.game-dark .gm-feedback.ok  { background: rgba(42,157,143,.18); color: #bde9e4; border-left-color: #2a9d8f; }
.game-dark .gm-feedback.bad { background: rgba(227,79,79,.15); color: #f4c7c7; border-left-color: #e34f4f; }
.game-dark .gm-next { color: #f0d9a8; }
.game-dark .gm-next:hover { color: #fff; }
.game-dark .gm-shot { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.3); }
.gc-mf    { background: linear-gradient(150deg, #0f2c44, #081c2e); }   /* Mutual Fund Manager — the game's own dark navy */
.gc-mf h3 { color: #fff !important; }
.gc-mf .game-try { color: #7be2b8; }
.gc-mf .game-foot span { color: rgba(224,243,240,.75); }
.gc-mf .game-foot a { color: #7be2b8; }
/* ── MF LIVE screen-tour card ── */
.mfx-card { padding: 0 !important; }
.mfx { position: relative; width: 100%; height: 100%; border-radius: inherit; overflow: hidden; }
.mfx-shot { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; opacity: 0; transition: opacity .9s ease; }
.mfx-shot.on { opacity: 1; }
.mfx-scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4,20,31,.82) 0%, rgba(4,20,31,.25) 40%, rgba(4,20,31,.88) 100%); }
.mfx-copy { position: absolute; top: 24px; left: 28px; right: 28px; }
.mfx-copy h3 { color: #fff; font-size: 26px; margin: 0; font-weight: 700; }
.mfx-cap { color: #fff; font-size: 15.5px; font-weight: 700; margin: 10px 0 0; max-width: 520px; animation: gnQIn .5s ease both; text-shadow: 0 2px 12px rgba(0,0,0,.6); }
.mfx-steps { position: absolute; left: 28px; right: 28px; bottom: 20px; display: flex; gap: 8px; flex-wrap: wrap; }
.mfx-step { font-size: 12px; font-weight: 800; letter-spacing: .05em; padding: 7px 14px; border-radius: 10px; background: rgba(255,255,255,.12); color: rgba(224,243,240,.85); border: 1px solid rgba(255,255,255,.2); transition: all .2s; }
.mfx-step:hover { background: rgba(255,255,255,.22); }
.mfx-step.on { background: #c9a84c; color: #062225; border-color: #c9a84c; }
.mfx-num { position: absolute; top: 26px; right: 28px; color: rgba(224,243,240,.55); padding: 0; }
@keyframes gnQIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* KBC trailer video card */
.kbc-video { flex: 1; min-height: 0; display: flex; }
.kbc-video video { width: 100%; height: 100%; object-fit: contain; border-radius: 10px; background: #04181c; box-shadow: 0 10px 30px rgba(0,0,0,.5); }

/* Swayamvar maroon scrim variant */
.mfx-maroon .mfx-scrim { background: linear-gradient(180deg, rgba(43,7,16,.62) 0%, rgba(43,7,16,0) 34%, rgba(43,7,16,0) 62%, rgba(43,7,16,.66) 100%); }
.mfx-maroon .mfx-step.on { background: #e8b64c; color: #2b0710; border-color: #e8b64c; }

/* Stock Rush light scrim variant — dark text on its paper UI */
.mfx-light .mfx-scrim { background: linear-gradient(180deg, rgba(250,249,245,.9) 0%, rgba(250,249,245,0) 36%, rgba(250,249,245,0) 60%, rgba(250,249,245,.92) 100%); }
.mfx-light .mfx-copy h3 { color: var(--navy); }
.mfx-light .game-try { color: var(--teal-dk); }
.mfx-light .mfx-cap { color: var(--navy); text-shadow: none; }
.mfx-light .mfx-step { background: rgba(26,58,92,.08); color: var(--navy); border-color: rgba(26,58,92,.2); }
.mfx-light .mfx-step.on { background: var(--navy); color: #fff; border-color: var(--navy); }
.mfx-light + .mfx-num, .mfx-light .mfx-num { color: rgba(26,58,92,.5); }

/* ── KBC stage + phone composition ── */
.gc-kbc .gm { grid-template-columns: 1fr 1.25fr; }   /* give the show real screen space */
.kbc-duo { position: relative; flex: 1; min-height: 0; border-radius: 10px; overflow: hidden; }
.kbc-duo .stage { width: 100%; height: 100%; object-fit: cover; object-position: top center; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.5); display: block; }
.kbc-duo .phone {
  position: absolute; right: 10px; bottom: 10px; width: 22%;
  border-radius: 14px; border: 3px solid rgba(255,255,255,.85);
  box-shadow: 0 14px 34px rgba(0,0,0,.55);
  transform: rotate(3deg);
}
@media (max-width: 640px) { .gc-kbc .gm { grid-template-columns: 1fr; } .kbc-duo { min-height: 220px; } }
@media (max-width: 640px) { .mf-shots { grid-template-columns: 1fr; } }
.game-card h3 { font-size: 26px; color: var(--navy); margin: 0; font-weight: 700; }
.game-card p { font-size: 15px; line-height: 1.5; color: var(--muted); margin: 0; font-weight: 600; }
.game-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.game-badge { font-size: 11px; font-weight: 800; letter-spacing: .05em; padding: 4px 10px; border-radius: 10px; background: rgba(255,255,255,.7); color: var(--teal-dk); text-transform: uppercase; }

/* featured game card w/ video — Hidden Treasures (same frame as other stack cards) */
.game-feature {
  margin-top: 16px; border-radius: 14px; overflow: hidden; padding: 26px;
  background: linear-gradient(135deg, #f5f0e0, #e0f3f0);
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 24px; align-items: stretch;
  box-shadow: 0 2px 12px rgba(26,58,92,.06);
  transition: transform .2s ease, box-shadow .2s ease;
}
.game-feature-copy { align-self: center; }
.game-feature:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(26,58,92,.25); }
.game-feature h3 { font-size: 26px; color: var(--navy); margin: 0; font-weight: 700; }
.game-feature-video { position: relative; display: flex; align-items: stretch; min-height: 220px; }
.game-feature-video video { width: 100%; height: 100%; object-fit: contain; border-radius: 10px; display: block; box-shadow: 0 10px 30px rgba(26,58,92,.25); background: #0e2237; }
@media (max-width: 900px) { .game-feature { grid-template-columns: 1fr; } .game-feature-video video { height: auto; } }

.games-lib {
  margin-top: 20px; border-radius: 16px; padding: 30px 34px;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14);
  display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap;
}
.games-lib .big { font-family: var(--serif); font-weight: 700; font-size: 52px; color: var(--gold); line-height: 1; }
.lib-chips { display: flex; gap: 8px; flex-wrap: wrap; max-width: 640px; }
.lib-chip { font-size: 12.5px; font-weight: 700; padding: 6px 13px; border-radius: 10px; background: rgba(255,255,255,.1); color: var(--mint-lt); border: 1px solid rgba(255,255,255,.14); white-space: nowrap; }

/* ── How it works ── */
.how-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.how-card { background: var(--white); border: 1px solid var(--line-soft); border-radius: 14px; padding: 32px; box-shadow: var(--shadow); }
.how-card .n { font-family: var(--serif); font-style: italic; font-size: 22px; color: var(--teal); font-weight: 600; }
.how-card h3 { font-size: 23px; margin: 8px 0 10px; color: var(--navy); font-weight: 700; }
.how-card p { color: var(--muted); font-size: 15.5px; margin: 0; }
.learn-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px 40px; margin-top: 8px; }
.learn-item { display: flex; gap: 14px; align-items: flex-start; padding: 14px 0; border-bottom: 1px solid var(--line-soft); }
.learn-item .tick { flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--mint-lt); color: var(--teal-dk); display: grid; place-items: center; font-size: 14px; font-weight: 800; margin-top: 2px; }
.learn-item span { font-size: 16.5px; color: var(--navy); }

/* stats */
.stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; border-radius: 16px; overflow: hidden; background: var(--white); border: 1px solid var(--line-soft); box-shadow: var(--shadow); }
.stat { padding: 34px 28px; border-right: 1px solid var(--line-soft); }
.stat:last-child { border-right: none; }
.stat .num { font-family: var(--serif); font-weight: 600; font-size: 54px; line-height: 1; color: var(--navy); }
.stat .num .u { font-size: .5em; font-style: italic; color: var(--teal); }
.stat .lab { font-size: 12.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-mute); font-weight: 800; margin-top: 10px; }

/* ═══ THE BOX OFFICE — batches as Bollywood posters ═══ */
.boxoffice { }
.bo-marquee {
  display: flex; align-items: center; gap: 18px; justify-content: center;
  background: linear-gradient(180deg, #10151c, #1a2230);
  border-radius: 14px; padding: 16px 22px; margin-bottom: 26px;
  box-shadow: inset 0 0 0 2px rgba(246,201,69,.25), 0 10px 26px rgba(26,58,92,.18);
}
.bo-title {
  color: #f6c945; font-weight: 800; font-size: 14px; letter-spacing: .22em;
  text-align: center; text-shadow: 0 0 18px rgba(246,201,69,.5); white-space: nowrap;
}
.bo-bulbs { display: flex; gap: 8px; flex: 1; justify-content: space-evenly; min-width: 0; overflow: hidden; }
.bo-bulbs i {
  width: 9px; height: 9px; border-radius: 50%; flex: none;
  background: #f6c945; box-shadow: 0 0 10px #f6c945;
  animation: boBlink 1.2s ease-in-out infinite;
}
@keyframes boBlink { 0%,100% { opacity: 1; } 50% { opacity: .25; box-shadow: none; } }

.bo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: stretch; }
.film {
  display: flex; flex-direction: column; color: var(--navy);
  transition: transform .25s ease;
  filter: drop-shadow(0 14px 30px rgba(26,58,92,.16));
}
.film:hover { transform: translateY(-8px) scale(1.02); color: var(--navy); }
.film .film-poster { flex: 1; }

.film-poster {
  position: relative; overflow: hidden;
  border-radius: 14px 14px 0 0;
  padding: 30px 26px 22px;
  min-height: 250px;
  display: flex; flex-direction: column;
  background:
    radial-gradient(120% 90% at 85% -10%, color-mix(in oklab, var(--film-accent) 55%, #fff) 0%, transparent 45%),
    linear-gradient(160deg, color-mix(in oklab, var(--film-accent) 88%, #000) 0%, color-mix(in oklab, var(--film-accent) 60%, #08131c) 100%);
  color: #fff;
}
.film-status {
  position: absolute; top: 14px; right: -38px; transform: rotate(38deg);
  font-size: 10px; font-weight: 800; letter-spacing: .12em;
  padding: 5px 44px; white-space: nowrap; pointer-events: none;
  background: #f6c945; color: #10151c; box-shadow: 0 2px 8px rgba(0,0,0,.3);
}
.film-status.st-few { background: #ff5d5d; color: #fff; animation: boBlink 1.6s ease-in-out infinite; }
.film-status.st-soon { background: #9fb3c8; color: #10151c; }
.film-prog {
  font-size: 10px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase;
  color: rgba(255,255,255,.75); margin-bottom: 10px;
}
.film-title {
  font-family: var(--serif); font-weight: 700; font-size: 30px; line-height: 1.04;
  margin: 0 0 12px; color: #fff; letter-spacing: -.01em;
  text-shadow: 0 3px 14px rgba(0,0,0,.35);
  padding-right: 20px;
}
.film-tagline {
  font-family: var(--serif); font-style: italic; font-size: 15.5px; line-height: 1.45;
  color: rgba(255,255,255,.92); margin-bottom: auto; padding-bottom: 14px;
}
.film-genre { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.65); }
.film-stars { font-size: 13px; color: #f6c945; margin-top: 6px; letter-spacing: 2px; }
.film-stars span { color: rgba(255,255,255,.75); font-size: 11.5px; font-weight: 700; letter-spacing: .02em; margin-left: 6px; }
.film-shine {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(115deg, transparent 30%, rgba(255,255,255,.18) 45%, transparent 60%);
  transform: translateX(-120%);
}
.film:hover .film-shine { animation: filmShine .9s ease; }
@keyframes filmShine { to { transform: translateX(120%); } }

/* ticket stub with perforation */
.film-stub {
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
  background: #fffdf8; border: 1px solid #efe7d6; border-top: none;
  border-radius: 0 0 14px 14px; padding: 14px 18px;
  position: relative;
}
.film-stub::before {
  content: ''; position: absolute; top: -1px; left: 10px; right: 10px; height: 0;
  border-top: 2px dashed color-mix(in oklab, var(--film-accent) 40%, #fff);
}
.stub-left { display: flex; flex-direction: column; gap: 5px; min-width: 0; flex: 1; }
.stub-row { flex: none; font-size: 12.5px; line-height: 1.4; font-weight: 700; color: var(--muted); }
.stub-right {
  flex: none; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 4px;
  border-left: 2px dashed #ddd2ba; padding-left: 16px; align-self: stretch; justify-content: center;
}
.stub-book {
  font-size: 12px; font-weight: 900; letter-spacing: .08em; line-height: 1.15;
  color: #fff; background: var(--film-accent);
  border-radius: 8px; padding: 7px 12px;
  transition: transform .2s ease;
}
.film:hover .stub-book { transform: scale(1.08); }
.stub-right small { font-size: 10.5px; font-weight: 800; color: var(--ink-mute); text-transform: uppercase; letter-spacing: .04em; }

/* the "you" poster */
.film-you .you-poster {
  background:
    radial-gradient(120% 90% at 85% -10%, rgba(255,255,255,.14) 0%, transparent 45%),
    linear-gradient(160deg, #1a3a5c 0%, #0c1e30 100%);
  border: 2px dashed rgba(255,255,255,.3); border-bottom: none;
}
.film-you { --film-accent: #c9a84c; cursor: default; }

@media (max-width: 980px) { .bo-grid { grid-template-columns: 1fr 1fr; } .bo-grid > .film:nth-child(3):last-child { grid-column: 1 / -1; } .bo-bulbs { display: none; } }
@media (max-width: 640px) { .bo-grid { grid-template-columns: 1fr; } .bo-grid > .film:nth-child(3):last-child { grid-column: auto; } .bo-title { white-space: normal; letter-spacing: .14em; } }

/* ═══ SCROLL STORY — the one idea (rebuilt) ═══ */
.vid-fallback { position: absolute; inset: 0; border-radius: 10px; display: grid; place-content: center; justify-items: center; gap: 10px; background: linear-gradient(160deg, #10314c, #0b2437); color: #cfe9e2; text-align: center; }
.vid-fallback span { font-size: 40px; }
.vid-fallback b { font-family: var(--sans); font-size: 14px; letter-spacing: .04em; text-transform: uppercase; opacity: .8; }
.story { position: relative; height: 146vh; background: linear-gradient(180deg, #0c1e30, var(--navy) 30%, #0c1e30); }
.story-stick { position: sticky; top: 0; height: 100vh; overflow: hidden; }
.story-curve { position: absolute; inset: 0; width: 100%; height: 100%; }
.story-comet-layer { position: absolute; inset: 0; pointer-events: none; }
.story-comet { position: absolute; transform: translate(-50%, -50%); width: 54px; height: 54px; }
.story-comet img { width: 100%; height: 100%; border-radius: 50%; box-shadow: 0 0 0 3px rgba(255,255,255,.9), 0 0 26px rgba(240,217,168,.9), 0 4px 18px rgba(0,0,0,.4); background: #fff; }
.story-comet-pulse { position: absolute; inset: -10px; border-radius: 50%; border: 2px solid rgba(240,217,168,.8); animation: cometPulse 1.6s ease-out infinite; }
@keyframes cometPulse { 0% { opacity: .9; transform: scale(.7); } 100% { opacity: 0; transform: scale(1.7); } }
.story-inner { position: absolute; left: 0; right: 0; top: 12vh; text-align: center; padding: 0 24px; pointer-events: none; }
.story-kicker { font-size: 13px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--gold); margin-bottom: 14px; text-shadow: 0 0 16px rgba(201,168,76,.4); }
.story-big { font-family: var(--serif); font-weight: 700; font-size: clamp(54px, 8.5vw, 132px); line-height: 1; color: #fff; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; text-shadow: 0 6px 40px rgba(0,0,0,.45); }
.story-cap { font-family: var(--serif); font-style: italic; font-size: clamp(19px, 2.4vw, 27px); color: var(--mint-lt); margin-top: 16px; animation: storyCapIn .5s ease both; }
@keyframes storyCapIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.story-legend { display: flex; gap: 26px; justify-content: center; flex-wrap: wrap; margin-top: 22px; font-size: 13.5px; font-weight: 700; color: rgba(224,243,240,.8); }
.story-legend b { color: #fff; }
.story-legend .dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 8px; vertical-align: middle; }
.story-legend .dot.gold { background: var(--gold); box-shadow: 0 0 10px var(--gold); }
.story-legend .dot.grey { background: #9fb3c8; }
.story-end { opacity: 0; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease; margin-top: 28px; pointer-events: none; }
.story-end.show { opacity: 1; transform: none; pointer-events: auto; }
.story-end-line { font-family: var(--serif); font-size: clamp(22px, 2.8vw, 32px); color: #fff; margin-bottom: 18px; }
.story-end-line em { color: var(--gold); font-style: italic; }
.story-hint { position: absolute; bottom: 26px; left: 0; right: 0; text-align: center; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: rgba(224,243,240,.55); font-weight: 800; }
@media (prefers-reduced-motion: no-preference) {
  .story-tip-pulse { animation: tipPulse 1.6s ease-out infinite; transform-origin: center; transform-box: fill-box; }
}
@keyframes tipPulse { 0% { opacity: .9; scale: .6; } 100% { opacity: 0; scale: 2.4; } }

/* ═══ MARQUEE strips (rebuilt) ═══ */
.marquee { overflow: hidden; padding: 18px 0; position: relative; }
.marquee-track { display: flex; gap: 0; white-space: nowrap; will-change: transform; width: max-content; }
.mq-row { display: inline-flex; align-items: center; gap: 28px; padding-right: 28px; }
.mq-i { font-weight: 800; font-size: 22px; letter-spacing: .02em; }
.mq-serif { font-family: var(--serif); font-style: italic; font-weight: 600; font-size: 26px; }
.mq-caps { text-transform: uppercase; letter-spacing: .14em; font-size: 18px; }
.mq-sep { opacity: .5; font-size: 18px; }
.mq-cream { background: var(--mint-lt); color: var(--navy); border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
.mq-cream .c1 { color: var(--teal-dk); }
.mq-cream .c2 { color: var(--gold); }
.mq-navy { background: var(--navy); color: var(--mint-lt); }
.mq-navy .c1 { color: var(--gold); }
.mq-navy .c2 { color: #7be2b8; }

/* ═══ GALLERY — drifting photo rows (big cut-out shapes, hover-pause, click-expand) ═══ */
.gal { background: linear-gradient(180deg, var(--navy), #0c1e30); padding: 96px 0 110px; overflow: hidden; }
.gal-row { padding: 18px 0; }
.gal-card {
  display: inline-block; margin: 0 14px; vertical-align: middle;
  width: 420px; height: 340px; overflow: hidden; cursor: zoom-in;
  box-shadow: 0 16px 40px rgba(0,0,0,.4);
  transition: transform .25s ease, box-shadow .25s ease;
  background: #0c1e30;
}
.gal-card:hover { transform: scale(1.03); box-shadow: 0 22px 54px rgba(0,0,0,.55); z-index: 2; position: relative; }
.gal-card img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* cut-out shape variety */
.gal-card.shape0 { border-radius: 210px 210px 18px 18px; }              /* arch */
.gal-card.shape1 { border-radius: 24px; }                               /* rounded */
.gal-card.shape2 { border-radius: 50%; width: 340px; height: 340px; }   /* circle */
.gal-card.shape3 { border-radius: 170px; }                              /* pill */

/* lightbox */
.gal-lightbox {
  position: fixed; inset: 0; z-index: 300; cursor: zoom-out;
  background: rgba(8,19,28,.92); backdrop-filter: blur(8px);
  display: grid; place-items: center; padding: 4vh 4vw;
  animation: galFade .25s ease;
}
@keyframes galFade { from { opacity: 0; } to { opacity: 1; } }
.gal-lightbox img {
  max-width: 100%; max-height: 100%; border-radius: 16px;
  box-shadow: 0 30px 90px rgba(0,0,0,.6);
  animation: galPop .3s cubic-bezier(.2,.9,.3,1.1);
}
@keyframes galPop { from { transform: scale(.92); opacity: 0; } to { transform: none; opacity: 1; } }
.gal-close {
  position: absolute; top: 22px; right: 26px; width: 46px; height: 46px;
  border-radius: 50%; background: rgba(255,255,255,.12); color: #fff;
  font-size: 26px; display: grid; place-items: center;
  border: 1px solid rgba(255,255,255,.25);
}
.gal-close:hover { background: rgba(255,255,255,.22); }

/* ═══ PROGRAM cards (rebuilt) ═══ */
.prog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 40px; }
.prog-card { background: var(--white); border: 1px solid var(--line-soft); border-radius: 14px; padding: 26px; box-shadow: var(--shadow); }
.prog-code { display: inline-grid; place-items: center; color: #fff; font-weight: 900; font-size: 13px; letter-spacing: .06em; border-radius: 10px; padding: 7px 12px; margin-bottom: 14px; }
.prog-card h3 { font-size: 21px; font-weight: 700; color: var(--navy); margin: 0 0 8px; }
.prog-card p { font-size: 14.5px; color: var(--muted); margin: 0 0 12px; }
.prog-fmt { font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--teal-dk); }

/* ═══ TESTIMONIALS (rebuilt) ═══ */
.tst-feature { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 40px; align-items: stretch; }
.tst-videos { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 12px; }
.tst-video { position: relative; border-radius: 14px; overflow: hidden; background: var(--sand); min-height: 150px; }
.tst-video .play { position: absolute; inset: 0; display: grid; place-items: center; z-index: 3; pointer-events: none; }
.tst-video .play span { width: 54px; height: 54px; border-radius: 50%; background: rgba(255,255,255,.94); color: var(--teal-dk); display: grid; place-items: center; font-size: 20px; box-shadow: var(--shadow); padding-left: 4px; }
.tst-video .vlabel { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; padding: 14px 16px; color: #fff; font-size: 13.5px; font-weight: 700; background: linear-gradient(transparent, rgba(26,58,92,.6)); pointer-events: none; }
.tst-video.tall { grid-row: span 2; }
.tst-written { background: var(--white); border: 1px solid var(--line-soft); border-radius: 14px; padding: 44px; display: flex; flex-direction: column; justify-content: space-between; box-shadow: var(--shadow); }
.tst-stars { color: var(--gold); font-size: 18px; letter-spacing: 3px; }
.tst-quote { font-family: var(--serif); font-weight: 600; font-size: 26px; line-height: 1.4; margin: 20px 0 0; color: var(--navy); }
.tst-person { display: flex; align-items: center; gap: 14px; margin-top: 28px; }
.tst-person .av { width: 52px; height: 52px; border-radius: 50%; overflow: hidden; background: var(--sand); flex-shrink: 0; }
.tst-person .nm { font-family: var(--serif); font-weight: 700; font-size: 19px; color: var(--navy); }
.tst-person .rl { font-size: 13px; color: var(--ink-mute); }
.tst-nav { display: flex; gap: 8px; margin-top: 28px; align-items: center; justify-content: space-between; }
.tst-dots { display: flex; gap: 7px; }
.tst-dot { width: 26px; height: 3px; border-radius: 3px; background: var(--mint); cursor: pointer; transition: background .18s; }
.tst-dot.on { background: var(--teal); }
.tst-arrows { display: flex; gap: 8px; }
.tst-arrow { width: 42px; height: 42px; border-radius: 12px; border: 2px solid var(--mint); background: var(--white); color: var(--muted); display: grid; place-items: center; font-size: 18px; transition: all .18s; }
.tst-arrow:hover { border-color: var(--teal); color: var(--navy); }

/* ═══ CORPORATE (rebuilt) ═══ */
.corp { display: grid; grid-template-columns: 1fr 1.15fr; gap: 64px; align-items: center; }
.corp h2 { font-size: clamp(36px,4vw,54px); margin: 14px 0 18px; color: var(--navy); }
.corp h2 em { font-style: italic; color: var(--teal); }
.corp p { color: var(--muted); font-size: 18px; line-height: 1.6; margin: 0 0 26px; }
.corp-logos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.corp-logo { background: var(--white); border: 1px solid var(--line-soft); border-radius: 14px; padding: 24px; display: flex; flex-direction: column; gap: 8px; box-shadow: var(--shadow); transition: transform .18s, box-shadow .18s; }
.corp-logo:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(26,58,92,.15); }
.corp-logo .badge { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; font-family: var(--serif); font-weight: 700; font-size: 20px; color: #fff; }
.corp-logo .cn { font-family: var(--serif); font-weight: 700; font-size: 21px; margin-top: 4px; color: var(--navy); }
.corp-logo .cd { font-size: 13.5px; color: var(--ink-mute); }
.corp-logo.more { align-items: center; justify-content: center; text-align: center; border: 2px dashed var(--mint); background: transparent; box-shadow: none; color: var(--muted); font-family: var(--serif); font-style: italic; font-size: 19px; }

/* ═══ BOOK (rebuilt) ═══ */
.book { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 72px; align-items: center; }
.book-cover-wrap { display: grid; place-items: center; perspective: 1400px; }
.book-cover {
  width: 300px; height: 420px; border-radius: 4px 10px 10px 4px; position: relative;
  background: var(--grad-primary);
  box-shadow: -14px 20px 40px rgba(26,58,92,.4); transform: rotateY(-18deg) rotateX(3deg);
  color: var(--mint-lt); padding: 40px 34px; overflow: hidden;
  transition: transform .4s ease;
}
.book-cover:hover { transform: rotateY(-8deg) rotateX(1deg); }
.book-cover::before { content:''; position:absolute; left:0; top:0; bottom:0; width: 14px; background: rgba(0,0,0,.22); }
.book-cover .spine-shine { position:absolute; left:14px; top:0; bottom:0; width: 20px; background: linear-gradient(90deg, rgba(255,255,255,.16), transparent); }
.book-cover .bk-kicker { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); font-weight: 800; }
.book-cover .bk-title { font-family: var(--serif); font-weight: 700; font-size: 36px; line-height: 1.05; margin-top: 14px; color: #fff; }
.book-cover .bk-author { position: absolute; bottom: 36px; left: 34px; font-family: var(--serif); font-style: italic; font-size: 22px; color: var(--mint-lt); }
.book-cover .bk-logo { position: absolute; bottom: 30px; right: 30px; width: auto; height: 58px; filter: drop-shadow(0 0 1px rgba(255,255,255,.95)) drop-shadow(0 0 1.5px rgba(255,255,255,.9)) drop-shadow(0 0 8px rgba(255,255,255,.3)); }
.book-badge { position: absolute; top: 26px; right: -6px; background: var(--gold); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .08em; padding: 7px 16px; border-radius: 6px; transform: rotate(3deg); box-shadow: var(--shadow); text-transform: uppercase; }
.book h2 { font-size: clamp(36px,4vw,54px); margin: 14px 0 18px; color: var(--navy); }
.book h2 em { font-style: italic; color: var(--teal); }
.book p { color: var(--muted); font-size: 18px; line-height: 1.62; margin: 0 0 20px; }
.book-form { display: flex; gap: 10px; max-width: 460px; margin-top: 8px; }
.book-form input { flex: 1; padding: 14px 18px; border-radius: 12px; border: 2px solid var(--mint); background: var(--white); font: inherit; color: var(--navy); outline: none; }
.book-form input::placeholder { color: var(--ink-mute); }
.book-form input:focus { border-color: var(--teal); }
.book-meta { display: flex; gap: 28px; margin-top: 26px; }
.book-meta .m .v { font-family: var(--serif); font-weight: 600; font-size: 28px; color: var(--navy); line-height: 1.1; }
.book-meta .m .l { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-mute); font-weight: 800; }
.hand { font-family: var(--serif); font-style: italic; color: var(--teal-dk); }

/* ═══ CTA BAND (rebuilt) ═══ */
.cta-band { border-radius: 16px; padding: 66px 56px; background: var(--grad-primary); color: #fff; display: grid; grid-template-columns: auto 1.1fr 1fr; gap: 40px; align-items: center; position: relative; overflow: hidden; }
.cta-band::before { content:''; position:absolute; width: 360px; height: 360px; border-radius: 50%; background: rgba(255,255,255,.08); top: -120px; right: -80px; }
.cta-band > * { position: relative; z-index: 1; }
.cta-band h2 { font-size: clamp(34px,3.8vw,50px); color: #fff; margin: 0; line-height: 1.05; }
.cta-band h2 em { font-style: italic; color: var(--gold); }
.cta-band p { color: rgba(255,255,255,.9); font-size: 17px; margin: 0 0 24px; }
.cta-logo-tile { width: 150px; }
.cta-logo-tile video { width: 150px; height: 150px; border-radius: 20px; object-fit: cover; display: block; box-shadow: 0 10px 30px rgba(0,0,0,.3); }
@media (max-width: 900px) { .cta-band { grid-template-columns: 1fr; } .cta-logo-tile { margin: 0 auto; } }

/* ═══ FOOTER (rebuilt) ═══ */
.footer { background: var(--navy); color: color-mix(in oklab, var(--mint-lt) 78%, transparent); padding: 76px 0 34px; }
.footer-top { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 44px; margin-bottom: 56px; }
.footer .fbrand { display: flex; align-items: center; gap: 12px; }
.footer .fbrand img { width: auto; height: 54px; filter: drop-shadow(0 0 1px rgba(255,255,255,.95)) drop-shadow(0 0 1.5px rgba(255,255,255,.9)) drop-shadow(0 0 8px rgba(255,255,255,.3)); }
.footer .fbrand b { font-family: var(--serif); font-weight: 700; font-size: 22px; color: #fff; }
.footer .ftag { font-family: var(--serif); font-style: italic; font-size: 20px; line-height: 1.4; color: var(--mint-lt); margin: 18px 0 22px; max-width: 320px; }
.footer h4 { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); margin: 0 0 18px; font-family: var(--sans); font-weight: 800; }
.footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 11px; }
.footer a { color: color-mix(in oklab, var(--mint-lt) 78%, transparent); font-size: 14.5px; }
.footer a:hover { color: #fff; }
.footer .social { display: flex; gap: 12px; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.12); padding-top: 26px; display: flex; justify-content: space-between; font-size: 13px; color: color-mix(in oklab, var(--mint-lt) 60%, transparent); flex-wrap: wrap; gap: 12px; }

/* ═══ REVEAL system (rebuilt) ═══ */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }
.reveal[data-rv="left"] { transform: translateX(-30px); }
.reveal[data-rv="right"] { transform: translateX(30px); }
.reveal[data-rv="pop"] { transform: translateY(16px) scale(.96); }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } }

/* ═══ RESPONSIVE (rebuilt) ═══ */
@media (max-width: 980px) {
  section { padding: 72px 0; }
  .hero-grid, .founder, .corp, .book, .tst-feature, .shead { grid-template-columns: 1fr; gap: 40px; }
  .games-grid, .how-grid, .stats, .learn-list, .corp-logos, .footer-top, .tst-videos, .prog-grid { grid-template-columns: 1fr 1fr; }
  .stat { border-bottom: 1px solid var(--line-soft); }
  .hero-collage { height: 420px; }
  .nav-links { display: none; }
  .book-cover { width: 240px; height: 336px; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }
  .wrap { padding: 0 20px; }
  .games-grid, .how-grid, .stats, .learn-list, .corp-logos, .footer-top, .prog-grid { grid-template-columns: 1fr; }
  .cta-band { padding: 44px 28px; }
  .story-big { font-size: clamp(44px, 12vw, 72px); }
  .gal-card { width: 300px; height: 250px; }
  .gal-card.shape2 { width: 250px; height: 250px; }
}

/* ═══ PLAYGROUND — Swayamvar drag deck (real-game biodata look) ═══ */
.cr {
  /* parchment plaid, like the actual Swayamvar screens */
  background:
    repeating-linear-gradient(0deg, transparent 0 34px, rgba(92,26,26,.05) 34px 35px),
    repeating-linear-gradient(90deg, transparent 0 34px, rgba(92,26,26,.05) 34px 35px),
    #faf3dc;
  padding: 0 0 96px; overflow: hidden;
  position: relative;
}
/* festive bunting strips top + bottom */
.cr::before, .cr::after {
  content: ''; display: block; height: 14px;
  background: repeating-linear-gradient(90deg,
    #5c1414 0 10px, #f2c14e 10px 16px, #b3255c 16px 26px, #e8862c 26px 32px);
}
.cr::before { margin-bottom: 82px; }
.cr::after { position: absolute; bottom: 0; left: 0; right: 0; }
.cr .shead h2 { color: #5c1414 !important; }
.cr .shead h2 em { color: #b3255c !important; }
.cr .shead p { color: #7a5a44 !important; }
.cr .eyebrow.on-teal { color: #b3255c; }
.cr .eyebrow.on-teal::before { background: #b3255c; }

.swy2 { max-width: 560px; margin: 0 auto; }

/* live meter — maroon header bar, like the game's name plate */
.swy2-meter {
  background: linear-gradient(160deg, #5c1414, #431010);
  border: 1.5px solid #f2c14e;
  border-radius: 12px; padding: 14px 20px; margin-bottom: 26px;
  display: flex; flex-direction: column; gap: 6px;
  box-shadow: 0 8px 22px rgba(92,20,20,.25);
  transition: box-shadow .3s ease, transform .3s ease;
}
.swy2-meter.pulse-up   { box-shadow: 0 0 0 4px rgba(242,193,78,.4), 0 8px 22px rgba(92,20,20,.25); }
.swy2-meter.pulse-mid  { box-shadow: 0 0 0 4px rgba(108,154,138,.4), 0 8px 22px rgba(92,20,20,.25); }
.swy2-meter.pulse-down { box-shadow: 0 0 0 4px rgba(179,37,92,.45), 0 8px 22px rgba(92,20,20,.25); }
.swy2-meter-row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; min-height: 26px; }
.swy2-meter-row.tally { justify-content: space-around; }
.swy2-tally { font-size: 13px; font-weight: 800; color: #fff3d6; letter-spacing: .04em; display: inline-flex; align-items: center; gap: 7px; }
.swy2-tally b { font-size: 17px; }
.swy2-tally i { font-style: normal; font-family: var(--serif); font-size: 19px; color: #f2c14e; min-width: 16px; text-align: center; }
.swy2-meter-lab { font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #f2c14e; white-space: nowrap; }
.swy2-meter-count { font-size: 17px; letter-spacing: 2px; white-space: nowrap; line-height: 1.3; }
.swy2-meter-val { font-family: var(--serif); font-weight: 700; font-size: 30px; color: #fff3d6; line-height: 1; }
.swy2-meter-val.bad { color: #f0a0b8; }

/* deck — biodata folder cards */
.swy2-deck { position: relative; height: 470px; }
.swy2-card {
  position: absolute; inset: 0; z-index: 5;
  background: #fffbee;
  border: 2px solid #2e7d4f;
  outline: 1px solid rgba(92,20,20,.15);
  border-radius: 10px; padding: 46px 28px 24px;
  color: #3a2116; text-align: center;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px;
  box-shadow: 0 18px 44px rgba(92,20,20,.3);
  cursor: grab; touch-action: none; user-select: none;
}
.swy2-card:active { cursor: grabbing; }
.swy2-card.back {
  background: #f3ead0; border-color: #c9bfa4;
  box-shadow: 0 10px 26px rgba(92,20,20,.18); pointer-events: none;
}
/* maroon name plate strip across card top */
.swy2-card:not(.back)::before {
  content: '★ THE BIODATA FOLDER ★';
  position: absolute; top: 0; left: 0; right: 0;
  background: linear-gradient(160deg, #5c1414, #431010); color: #f2c14e;
  font-size: 10px; font-weight: 800; letter-spacing: .22em;
  padding: 8px 0; border-radius: 7px 7px 0 0;
}
.swy2-card.fly-yes { transition: transform .38s ease, opacity .38s ease; transform: translateX(130%) rotate(18deg) !important; opacity: 0; }
.swy2-card.fly-no  { transition: transform .38s ease, opacity .38s ease; transform: translateX(-130%) rotate(-18deg) !important; opacity: 0; }
.swy2-photo {
  position: relative; width: 210px; border-radius: 8px; overflow: hidden;
  border: 2px solid #2e7d4f; box-shadow: 0 8px 20px rgba(92,20,20,.3);
  margin-bottom: 4px; flex: none;
}
.swy2-photo img { width: 100%; height: 140px; object-fit: cover; display: block; pointer-events: none; }
.swy2-photo-badge {
  position: absolute; bottom: 6px; right: 6px; width: 34px; height: 34px;
  border-radius: 50%; background: #fffbee; border: 1.5px solid #d8b968;
  display: grid; place-items: center; font-size: 17px;
  box-shadow: 0 2px 8px rgba(92,20,20,.3);
}
.swy2-emoji { font-size: 60px; line-height: 1; filter: drop-shadow(0 6px 10px rgba(92,20,20,.25)); }
.swy2-name { font-family: var(--serif); font-weight: 700; font-size: 28px; letter-spacing: -.01em; color: #5c1414; }
.swy2-tag { font-family: var(--serif); font-style: italic; font-size: 16.5px; color: #b3255c; }
.swy2-bio { font-size: 14.5px; font-weight: 600; color: #7a5a44; max-width: 330px; line-height: 1.5; }
.swy2-ask {
  margin-top: 8px; font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
  color: #8a6a3a; border: 1.5px dashed #d8b968; background: #fdf6e0; border-radius: 100px; padding: 6px 16px;
}
/* stamps — green/red flag colors from the game */
.swy2-stamp {
  position: absolute; top: 40px; font-family: var(--sans); font-weight: 900; font-size: 20px;
  letter-spacing: .06em; padding: 6px 14px; border-radius: 8px; border: 3px solid;
  opacity: 0; transform: rotate(-12deg) scale(.8); transition: opacity .12s ease, transform .12s ease;
  pointer-events: none; z-index: 2;
}
.swy2-stamp.show { opacity: 1; transform: rotate(-12deg) scale(1); }
.st-yes { left: 18px; color: #2e7d4f; border-color: #2e7d4f; background: #eaf3ea; }
.st-no  { right: 18px; color: #b3255c; border-color: #b3255c; background: #fbecf1; transform: rotate(12deg) scale(.8); }
.st-no.show { transform: rotate(12deg) scale(1); }

/* controls — pink CTA like "Next Suitor" button */
.swy2-controls { display: flex; align-items: center; justify-content: center; gap: 26px; margin-top: 24px; }
.swy2-controls.three { gap: 20px; }
.swy2-btn {
  width: 72px; height: 72px; border-radius: 50%; font-size: 22px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
  box-shadow: 0 8px 20px rgba(92,20,20,.25);
  transition: transform .15s ease; border: 2px solid transparent;
}
.swy2-btn small { font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.swy2-btn:hover { transform: scale(1.1); }
.swy2-btn.no  { background: #fffbee; border-color: #d8b968; color: #8a6a3a; }
.swy2-btn.mid { background: #fffbee; border-color: #2e7d4f; color: #2e7d4f; }
.swy2-btn.yes { background: linear-gradient(160deg, #d12d6e, #b3255c); color: #fff; }
.swy2-hintline { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #b39a6a; }
.swy2-hintline.center { text-align: center; margin-top: 14px; }

/* progress dots */
.swy2-progress { display: flex; justify-content: center; gap: 8px; margin-top: 20px; }
.swy2-progress span { width: 26px; height: 4px; border-radius: 4px; background: rgba(92,20,20,.15); transition: background .2s; }
.swy2-progress .p-cur { background: #8a6a3a; }
.swy2-progress .p-yes { background: #2e7d4f; }
.swy2-progress .p-no  { background: #b3255c; }

/* verdict — room reveal list */
.swy2-verdict { text-align: center; padding: 12px 0 4px; }
.swy2-final-lab { font-size: 15px; font-weight: 700; color: #7a5a44; margin-bottom: 18px; }
.swy2-reveal-list { display: flex; flex-direction: column; gap: 10px; text-align: left; }
.swy2-reveal {
  display: flex; gap: 14px; align-items: flex-start;
  background: #fffbee; border: 1.5px solid #d8cbae; border-radius: 12px; padding: 14px 16px;
}
.swy2-reveal.match { border-color: #2e7d4f; background: #f4f9f2; }
.swy2-reveal-img { width: 62px; height: 62px; object-fit: cover; border-radius: 8px; border: 1.5px solid #d8b968; flex: none; }
.swy2-reveal-body { min-width: 0; }
.swy2-reveal-top { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.swy2-reveal-top b { font-family: var(--serif); font-size: 17px; color: #5c1414; }
.swy2-reveal-picks { font-size: 12px; font-weight: 800; color: #8a6a3a; white-space: nowrap; }
.swy2-reveal.match .swy2-reveal-picks { color: #2e7d4f; }
.swy2-reveal-body p { margin: 5px 0 0; font-size: 13.5px; font-weight: 600; color: #7a5a44; line-height: 1.5; }
.swy2-score {
  margin-top: 18px; font-family: var(--serif); font-weight: 700; font-size: 21px; color: #5c1414;
}
.swy2-score span { display: block; font-family: var(--sans); font-weight: 600; font-style: italic; font-size: 14px; color: #8a6a3a; margin-top: 6px; }
.swy2-verdict-foot { margin-top: 22px; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.swy2-verdict-foot .btn-gold { background: linear-gradient(160deg, #d12d6e, #b3255c); color: #fff; }
.swy2-verdict-foot .btn-gold:hover { background: linear-gradient(160deg, #b3255c, #9c1f50); }
.swy2-plug { font-size: 13px; font-style: italic; color: #8a6a3a; }

@media (max-width: 640px) { .swy2-deck { height: 500px; } }

/* gallery: show the full photo at its own shape */
.gal-card,.gal-card.shape0,.gal-card.shape1,.gal-card.shape2,.gal-card.shape3{width:auto;height:340px;border-radius:20px;background:#0c1e30}
.gal-card img{width:auto;height:100%;object-fit:contain}
.gal-lightbox img{max-width:min(92vw,1400px);max-height:88vh;width:auto;height:auto;object-fit:contain}
@media (max-width:640px){.gal-card,.gal-card.shape0,.gal-card.shape1,.gal-card.shape2,.gal-card.shape3{width:auto;height:240px}}

/* gallery arrows */
.gal-nav{position:absolute;top:50%;transform:translateY(-50%);width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.3);font-size:22px;font-weight:800;cursor:pointer;display:grid;place-items:center;transition:background .15s}
.gal-nav:hover{background:rgba(255,255,255,.28)}
.gal-nav.prev{left:24px}.gal-nav.next{right:24px}
.gal-count{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.8);font-size:14px;font-weight:800;letter-spacing:.08em}
.gal-lightbox img{cursor:default}
@media (max-width:640px){.gal-nav{width:44px;height:44px;font-size:18px;top:auto;bottom:14px;transform:none}.gal-nav.prev{left:16px}.gal-nav.next{right:16px}.gal-count{bottom:26px}}
/* testimonial video thumbs + player */
button.tst-video{display:block;width:100%;padding:0;border:0;cursor:pointer;text-align:left;font:inherit}
.tst-video .tst-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.tst-video:hover .tst-thumb{transform:scale(1.04)}
.tst-video:hover .play span{transform:scale(1.08)}
.tst-person .av img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.vid-modal{position:fixed;inset:0;z-index:300;background:rgba(8,19,28,.92);backdrop-filter:blur(8px);display:grid;place-items:center;padding:28px;animation:galFade .2s ease}
.vid-box{width:min(960px,100%);background:#000;border-radius:16px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.6)}
.vid-box iframe{display:block;width:100%;aspect-ratio:16/9;border:0;background:#000}
.vid-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;background:#0e2237;color:#fff;font-size:14px}
.vid-bar a{color:var(--mint);font-weight:800}
@media (max-width:640px){.vid-box iframe{aspect-ratio:9/12}}
/* CTA logo, no tile */
.cta-logo-tile{margin-bottom:22px}
.cta-logo-tile img{width:150px;height:auto;display:block;filter:drop-shadow(0 0 1px rgba(255,255,255,.95)) drop-shadow(0 0 1.5px rgba(255,255,255,.9)) drop-shadow(0 0 10px rgba(255,255,255,.35))}

/* ═══ MOBILE PASS — Oct 2026 ═══ */
html,body{overflow-x:clip}
img,video,iframe{max-width:100%}
@media (max-width:980px){
  .founder{gap:44px}
  .founder-photo{max-width:440px;margin:0 auto;width:100%}
}
@media (max-width:640px){
  section{padding:56px 0}
  h2{text-wrap:balance}
  .shead{gap:14px;margin-bottom:28px}
  .shead h2{font-size:clamp(30px,8.4vw,40px);line-height:1.08}
  .shead p{font-size:16px;line-height:1.6}
  .eyebrow{font-size:11.5px;letter-spacing:.14em}
  .btn-lg{padding:15px 22px;font-size:16px}

  /* founder */
  .founder{gap:36px}
  .founder-photo{max-width:none}
  .founder-photo .frame{aspect-ratio:4/4.4;border-radius:14px}
  .founder-photo .sig-badge{left:14px;bottom:-16px;padding:12px 16px;border-radius:12px}
  .founder-photo .sig-badge .n{font-size:22px}
  .founder-photo .sig-badge small{font-size:10px}
  .founder h2{font-size:clamp(28px,8vw,36px);line-height:1.1;margin:12px 0 16px}
  .founder p{font-size:16px;line-height:1.65;margin:0 0 14px}
  .founder .pull{font-size:19px;line-height:1.4;margin:18px 0;padding-left:14px;border-left:3px solid var(--mint)}

  /* nav */
  .nav-in{padding:10px 16px;gap:12px}
  .nav-brand img{height:40px}
  .nav-brand b{font-size:17px}
  .nav-in > .btn{padding:10px 14px;font-size:14px;white-space:nowrap}

  /* testimonials */
  .tst-feature{gap:20px}
  .tst-videos{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:8px}
  .tst-video{min-height:130px}
  .tst-video.tall{grid-row:auto;grid-column:1 / -1;min-height:200px}
  .tst-video .vlabel{font-size:12.5px;padding:10px 12px}
  .tst-video .play span{width:44px;height:44px;font-size:16px}
  .tst-written{padding:26px 22px}
  .tst-quote{font-size:20px !important;line-height:1.4 !important}

  /* box office */
  .bo-marquee{padding:12px 14px}
  .bo-title{font-size:11px}
  .film-poster{padding:24px 22px 20px}
  .film-title{font-size:28px}
  .film-tagline{font-size:16px}
  .film-stub{padding:14px 16px;gap:10px}
  .stub-book{font-size:12px;padding:8px 12px}
  .prog-card{padding:22px}

  /* corporate + book + cta */
  .corp-logos{gap:10px}
  .book{gap:30px;text-align:left}
  .book-cover{width:210px;height:294px;margin:0 auto}
  .book-cover .bk-title{font-size:28px}
  .book h2{font-size:clamp(28px,8vw,36px)}
  .cta-band{padding:34px 22px;gap:22px;border-radius:18px}
  .cta-band h2{font-size:clamp(28px,8vw,36px);line-height:1.1}
  .cta-band p{font-size:16px}
  .cta-band .btn{width:100%;justify-content:center}
  .cta-logo-tile{margin:0 0 18px}
  .cta-logo-tile img{width:110px}

  /* gallery header */
  .gal{padding:60px 0 70px}

  /* footer */
  .footer{padding:52px 0 36px}
  .footer-top{gap:28px;margin-bottom:32px}
  .footer .ftag{font-size:17px}
}
@media (max-width:380px){
  .wrap{padding:0 16px}
  .nav-brand b{display:none}
  .shead h2,.founder h2,.cta-band h2,.book h2{font-size:28px}
}

/* scroll story on phones: sticky needs a real viewport height, and the graph sits below the numbers */
.story-stick{height:100vh;height:100svh}
@media (max-width:640px){
  .story{height:180svh}
  .story-inner{top:9svh;padding:0 18px}
  .story-kicker{font-size:11px;letter-spacing:.16em;margin-bottom:10px}
  .story-big{font-size:clamp(44px,13vw,64px)}
  .story-cap{font-size:17px;margin-top:10px;min-height:2.8em}
  .story-legend{gap:6px 14px;margin-top:12px;font-size:12px}
  .story-curve,.story-comet-layer{top:auto;bottom:7svh;height:46svh}
  .story-comet{width:36px;height:36px}
  .story-end{margin-top:14px}
  .story-end-line{font-size:19px;margin-bottom:12px}
  .story-hint{bottom:12px;font-size:11px}
}

/* scroll story: JS-driven pin (works on iPhone) */
.story-stick{position:absolute;left:0;right:0;top:0}
.story-stick.pin-fixed{position:fixed;top:0;z-index:1}
.story-stick.pin-bottom{top:auto;bottom:0}
.story-comet img{background:transparent;box-shadow:none;border-radius:0;filter:drop-shadow(0 0 1px rgba(255,255,255,.95)) drop-shadow(0 0 10px rgba(240,217,168,.8))}

.founder-photo .frame img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block;transform:scale(1.45);transform-origin:47% 36%}

.tst-video.is-photo{cursor:default}
.vid-box video{display:block;width:100%;max-height:80vh;background:#000}

/* testimonial video rail */
.tv-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 14px}
.tv-head span{font-size:12.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-dk)}
.tv-arrows{display:flex;gap:10px}
.tv-rail{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 18px;margin-bottom:28px;scrollbar-width:thin}
.tv-tile{position:relative;flex:0 0 220px;aspect-ratio:9/16;border:0;padding:0;border-radius:16px;overflow:hidden;background:var(--navy);cursor:pointer;scroll-snap-align:start;box-shadow:var(--shadow)}
.tv-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.tv-tile:hover img{transform:scale(1.04)}
.tv-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(14,34,55,.7))}
.tv-play{position:absolute;inset:0;display:grid;place-items:center;z-index:2}
.tv-play > span{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.94);color:var(--teal-dk);display:grid;place-items:center;font-size:20px;padding-left:4px;box-shadow:0 8px 22px rgba(0,0,0,.3);transition:transform .2s}
.tv-tile:hover .tv-play > span{transform:scale(1.08)}
.tv-name{position:absolute;left:14px;bottom:12px;z-index:2;color:#fff;font-family:var(--serif);font-weight:600;font-size:18px}
.tst-written-wide{max-width:none}
.vid-box-tall{width:min(420px,100%)}
.vid-box-tall iframe{aspect-ratio:9/16;max-height:78vh}
.vid-bar span{color:rgba(224,243,240,.7);font-weight:800;font-size:13px}
@media (max-width:640px){
  .tv-rail{gap:10px;margin:0 -20px 22px;padding:4px 20px 14px;scrollbar-width:none}
  .tv-rail::-webkit-scrollbar{display:none}
  .tv-tile{flex-basis:46%}
  .tv-play > span{width:46px;height:46px;font-size:16px}
  .tv-arrows{display:none}
  .vid-box-tall{width:min(360px,92vw)}
  .vid-box-tall iframe{max-height:70vh}
}

/* corporate workshops */
.cw-head{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:end;margin-bottom:38px}
.cw-head h2{font-size:clamp(32px,3.6vw,50px);line-height:1.08;margin:14px 0 0;color:var(--navy)}
.cw-head h2 em{font-style:italic;color:var(--teal)}
.cw-head p{font-size:17px;line-height:1.6;color:var(--muted);margin:0 0 22px;max-width:46ch}
.cw-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.cw-card{position:relative;margin:0;border-radius:18px;overflow:hidden;aspect-ratio:3/4;background:var(--navy);box-shadow:var(--shadow)}
.cw-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.cw-card:hover img{transform:scale(1.04)}
.cw-card figcaption{position:absolute;left:0;right:0;bottom:0;padding:44px 18px 16px;background:linear-gradient(transparent,rgba(14,34,55,.88));color:#fff}
.cw-card b{display:block;font-family:var(--serif);font-weight:600;font-size:20px;line-height:1.15}
.cw-card span{display:block;font-size:13.5px;color:#d6e8e4;margin-top:4px}
.cw-more{margin:24px 0 0;font-size:16px;color:var(--muted)}
.cw-more b{color:var(--navy);font-weight:800}
@media (max-width:980px){.cw-head{grid-template-columns:1fr;gap:18px}.cw-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .cw-head h2{font-size:clamp(28px,8vw,36px)}
  .cw-head p{font-size:16px}
  .cw-head .btn{width:100%;justify-content:center}
  .cw-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;margin:0 -20px;padding:0 20px 6px;scrollbar-width:none}
  .cw-grid::-webkit-scrollbar{display:none}
  .cw-card{flex:0 0 74%;scroll-snap-align:start}
  .cw-card b{font-size:18px}
}

/* swayamvar results */
.swr{padding:6px 0 2px}
.swr-top{display:flex;align-items:center;gap:26px;justify-content:center;margin-bottom:26px;text-align:left}
.swr-ring{flex:none;width:132px;height:132px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#d12d6e var(--pct),rgba(209,45,110,.14) 0);position:relative}
.swr-ring::before{content:"";position:absolute;inset:11px;border-radius:50%;background:#fffaf3}
.swr-ring>div{position:relative;display:flex;align-items:baseline;gap:3px}
.swr-ring b{font-family:var(--serif);font-size:54px;line-height:1;color:#5b1a33}
.swr-ring span{font-size:17px;font-weight:800;color:#a0788a}
.swr-kick{font-size:12px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:#d12d6e}
.swr-head h3{font-family:var(--serif);font-weight:700;font-size:clamp(28px,3.2vw,40px);line-height:1.05;color:#3d1424;margin:6px 0 6px}
.swr-head p{margin:0;font-size:16px;font-weight:700;color:#7a5a44}
.swr-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.swr-col{background:#fff;border-radius:20px;padding:16px 14px 18px;border:2px solid #f1dfe4;box-shadow:0 6px 0 #f1dfe4}
.swr-col.c-marry{border-color:#f3c3d5;box-shadow:0 6px 0 #f3c3d5}
.swr-col.c-date{border-color:#f0dcb0;box-shadow:0 6px 0 #f0dcb0}
.swr-col.c-call{border-color:#cfe0ea;box-shadow:0 6px 0 #cfe0ea}
.swr-col-h{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:#3d1424;margin-bottom:14px}
.swr-col-h span{font-size:30px;line-height:1}
.swr-col-h i{margin-left:auto;font-style:normal;font-family:var(--serif);font-size:22px;color:#d12d6e}
.swr-faces{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}
.swr-face{text-align:center}
.swr-pic{position:relative;width:88px;height:88px;margin:0 auto 8px}
.swr-pic img{width:100%;height:100%;border-radius:50%;object-fit:cover;background:#fbeef2;border:3px solid #fff;box-shadow:0 4px 14px rgba(61,20,36,.18)}
.swr-face.miss .swr-pic img{filter:saturate(.7)}
.swr-mark{position:absolute;right:-4px;bottom:-2px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:16px;font-weight:900;border:3px solid #fff}
.swr-face.ok .swr-mark{background:#2a9d8f;color:#fff}
.swr-face.miss .swr-mark{background:#fff3d6;font-size:15px}
.swr-face b{display:block;font-size:13.5px;font-weight:800;color:#3d1424;line-height:1.2}
.swr-face small{display:block;font-size:11.5px;font-weight:700;color:#a0788a;margin-top:2px}
.swr-empty{grid-column:1/-1;padding:26px 0;font-size:14px;font-weight:700;color:#c4a9b3;font-style:italic}
.swr-foot{margin-top:24px;text-align:center}
.swr-foot p{font-family:var(--serif);font-style:italic;font-size:19px;color:#7a5a44;margin:0 0 14px}
.swr-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.swr-again{background:#fff;color:#b3255c;border:2px solid #f3c3d5}
.swr-again:hover{background:#fbeef2}
.swr-join{background:linear-gradient(160deg,#d12d6e,#b3255c);color:#fff}
.swr-join:hover{background:linear-gradient(160deg,#b3255c,#9c1f50);color:#fff}
@media (max-width:760px){
  .swr-top{gap:16px}
  .swr-ring{width:104px;height:104px}
  .swr-ring::before{inset:9px}
  .swr-ring b{font-size:42px}
  .swr-cols{grid-template-columns:1fr;gap:12px}
  .swr-faces{grid-template-columns:repeat(3,minmax(0,1fr))}
  .swr-pic{width:76px;height:76px}
  .swr-btns .btn{flex:1 1 100%;justify-content:center}
}

/* remove decorative half-circles */
#book::before,#founder::before,#corporate::after{display:none}

/* swayamvar results v2: six suitor cards */
.swr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.swr-card{background:#fff;border-radius:20px;padding:12px 12px 14px;border:2px solid #f1dfe4;box-shadow:0 5px 0 #f1dfe4;text-align:center;min-width:0}
.swr-card.ok{border-color:#bfe5df;box-shadow:0 5px 0 #bfe5df}
.swr-card-pic{position:relative;aspect-ratio:1;border-radius:14px;overflow:hidden;background:#fbeef2;margin-bottom:10px}
.swr-card-pic img{width:100%;height:100%;object-fit:cover;display:block}
.swr-card.miss .swr-card-pic img{filter:saturate(.75)}
.swr-flag{position:absolute;top:8px;left:8px;font-size:11.5px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;padding:5px 9px;border-radius:100px;color:#fff;background:#2a9d8f;white-space:nowrap}
.swr-card.miss .swr-flag{background:#b3255c}
.swr-card-name{display:block;font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.2;color:#3d1424;margin-bottom:10px;min-height:2.4em;display:flex;align-items:center;justify-content:center}
.swr-picks{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.swr-picks>div{display:flex;flex-direction:column;align-items:center;gap:2px;background:#fbf4ee;border-radius:12px;padding:8px 4px 7px}
.swr-picks>div.same{background:#e6f5f2}
.swr-picks small{font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:#a0788a}
.swr-picks span{font-size:26px;line-height:1.1}
.swr-picks em{font-style:normal;font-size:12px;font-weight:800;color:#3d1424;white-space:nowrap}
@media (max-width:640px){
  .swr-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .swr-card{padding:9px 9px 11px;border-radius:16px}
  .swr-card-name{font-size:15px}
  .swr-picks span{font-size:22px}
  .swr-picks em{font-size:11px}
  .swr-top{flex-direction:column;text-align:center}
}

.swr-picks{grid-template-columns:repeat(2,minmax(0,1fr))}
.swr-picks>div{min-width:0}
.swr-picks em{white-space:normal;line-height:1.15;text-align:center;overflow-wrap:anywhere}
@media (max-width:1000px){.swr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.swr-picks em{font-size:10.5px}.swr-picks span{font-size:20px}.swr-picks small{font-size:9px}}

/* story on phones: lighter ground, bigger caption, chart inset so the logo stays on screen */
@media (max-width:640px){
  .story{height:300svh;background:linear-gradient(180deg,#123a52 0%,#1f6f72 55%,#2a9d8f 100%)}
  .story-inner{top:7svh}
  .story-cap{font-size:23px;line-height:1.3;margin-top:12px;min-height:3.9em;color:#fff;font-weight:600}
  .story-legend{font-size:12.5px;color:#e6f5f2}
  .story-curve,.story-comet-layer{left:30px;right:34px;width:auto;top:auto;bottom:6svh;height:50svh}
  .story-comet{width:40px;height:40px}
  .story-end{margin-top:10px}
}

/* chart box inset at all widths so the logo never leaves the screen */
.story-curve,.story-comet-layer{inset:auto;left:4%;right:5%;top:90px;bottom:44px;width:auto;height:auto}
@media (max-width:640px){.story-curve,.story-comet-layer{left:30px;right:34px;top:auto;bottom:6svh;height:50svh}}

/* svg is a replaced element: give it explicit size so it matches the comet layer box */
svg.story-curve{width:91%;height:calc(100% - 134px)}
@media (max-width:640px){svg.story-curve{width:calc(100% - 64px);height:50svh}}

.hx-proof-line{font-size:19px;line-height:1.35;color:var(--ink,#1a3a5c)}
.hx-proof-line strong{color:var(--navy);font-weight:800;font-size:21px}
@media (max-width:640px){.hx-proof-line{font-size:17px}.hx-proof-line strong{font-size:19px}}
@media (max-width:640px){.hx-proof-line{font-size:18px;line-height:1.4}.hx-proof-line strong{font-size:21px;display:inline-block}}

/* course facts, right under the hero (reuses .stats styling) */
.hx-facts-wrap{margin-top:40px;position:relative;z-index:2}
@media (max-width:640px){.hx-facts-wrap{margin-top:28px}.hx-facts-wrap .stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* hero photos on phones: chips out of the headline, a fanned trio beneath it */
.hx-fan{display:none}
@media (max-width:640px){
  .hx-line .hx-chip{display:none !important}
  .hx-fan{display:block;position:relative;height:190px;margin:22px auto 6px;max-width:360px}
  .hx-fan img{position:absolute;top:0;width:58%;aspect-ratio:4/3;object-fit:cover;border-radius:18px;border:4px solid #fff;box-shadow:0 12px 28px rgba(26,58,92,.22)}
  .hx-fan .f1{left:0;top:26px;transform:rotate(-7deg);z-index:1}
  .hx-fan .f3{right:0;top:30px;transform:rotate(6deg);z-index:1}
  .hx-fan .f2{left:21%;top:0;width:58%;z-index:2;transform:rotate(-1deg)}
}

/* hero sub: wider, larger, reads in long lines; trust line beneath */
.hx-sub-row{flex-direction:column;align-items:flex-start;gap:22px}
.hx-sub{font-size:23px;line-height:1.5;max-width:820px;color:var(--navy)}
.hx-facts-cta{display:flex;justify-content:center;margin-top:28px}
@media (max-width:640px){
  .hx-sub{font-size:19.5px;line-height:1.5}
  .hx-sub-row{gap:16px}
  .hx-facts-cta{margin-top:20px}
  .hx-facts-cta .btn{width:100%;justify-content:center}
}

/* word strips: fade the edges so words slide in and out instead of looking cut */
.marquee{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%)}
@media (max-width:640px){
  .marquee{padding:14px 0;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 84%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 84%,transparent 100%)}
  .mq-caps,.mq-sep{font-size:14px}
  .mq-row{gap:18px;padding-right:18px}
}
/* keep the curve's end clear of the fixed nav on laptop */
@media (min-width:641px){.story-curve,.story-comet-layer{top:130px}svg.story-curve{height:calc(100% - 174px)}}

@media (max-width:640px){.hx-fan{display:none !important}}

/* ===== story graph — final layout (overrides earlier attempts) ===== */
.story-curve,.story-comet-layer{position:absolute;inset:auto;left:5%;right:5%;top:130px;bottom:70px;width:auto;height:auto}
svg.story-curve{width:90%;height:calc(100% - 200px)}
.story-big{color:#f0d9a8;text-shadow:0 0 30px rgba(201,168,76,.35)}
.story-comet{width:56px;height:56px}
.story-comet img{display:none}
.story-rupee{position:absolute;inset:0;display:grid;place-items:center;border-radius:50%;background:#c9a84c;color:#1a3a5c;font-family:var(--serif);font-weight:800;font-size:32px;line-height:1;border:3px solid #fff;box-shadow:0 0 0 4px rgba(201,168,76,.35),0 6px 18px rgba(0,0,0,.4)}
.story-axis{pointer-events:none}
.story-yr{position:absolute;top:calc(100% - 4px);transform:translateX(-50%);font-size:14px;font-weight:800;letter-spacing:.04em;color:rgba(224,243,240,.45);white-space:nowrap}
.story-yr.on{color:#f0d9a8}
.story-yr.last{transform:translateX(-100%)}
@media (max-width:640px){
  .story{background:linear-gradient(180deg,#0c1e30,var(--navy) 30%,#0c1e30)}
  .story-cap{color:var(--mint-lt)}
  .story-curve,.story-comet-layer{left:22px;right:26px;top:auto;bottom:9svh;height:44svh}
  svg.story-curve{width:calc(100% - 48px);height:44svh}
  .story-comet{width:42px;height:42px}
  .story-rupee{font-size:24px;border-width:2px}
  .story-yr{font-size:11.5px;top:calc(100% + 6px)}
}

/* axis: big numbers, one "Years" label; larger legend */
.story-yr{font-family:var(--serif);font-size:26px;font-weight:700;letter-spacing:0}
.story-axis-lab{position:absolute;left:50%;top:calc(100% + 30px);transform:translateX(-50%);font-size:13px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:rgba(224,243,240,.55)}
.story-legend{font-size:17px;gap:14px 30px}
.story-legend .dot{width:12px;height:12px}
@media (max-width:640px){
  .story-yr{font-size:19px;top:calc(100% + 4px)}
  .story-axis-lab{top:calc(100% + 28px);font-size:11px}
  .story-legend{font-size:14.5px;gap:8px 18px}
}

.story-axis-lab{top:calc(100% + 44px)}
.story-hint{bottom:auto;top:96px}
@media (max-width:640px){.story-axis-lab{top:calc(100% + 34px)}.story-hint{top:auto;bottom:calc(9svh + 44svh + 8px)}}

/* proof line as a credibility badge */
.hero-trust{display:flex}
.hx-proof-box{display:inline-flex;align-items:baseline;gap:8px;flex-wrap:wrap;background:#fff;border:1.5px solid var(--mint);border-radius:14px;padding:14px 22px;box-shadow:0 4px 0 var(--mint),0 10px 24px rgba(26,58,92,.06)}
.hx-proof-box strong{color:var(--teal-dk)}
@media (max-width:640px){.hx-proof-box{padding:12px 16px;gap:5px;width:100%;justify-content:center;text-align:center}}

.story-hint{top:auto;bottom:14px}
@media (max-width:640px){.story-hint{top:auto;bottom:10px}}

/* proof badge: deliberate two-line layout */
.hx-proof-box{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;padding:16px 26px}
.hx-proof-box strong{display:block;font-family:var(--serif);font-size:30px;line-height:1.1;font-weight:700}
@media (max-width:640px){.hx-proof-box{align-items:center;padding:14px 18px}.hx-proof-box strong{font-size:27px}}

/* graph: invested band + growth band, tag at invested tip */
.story-legend .dot.grey{background:#c3d3e2;border-radius:3px}
.story-inv-tag{position:absolute;transform:translate(-100%,10px);margin-left:-10px;white-space:nowrap;font-size:13px;font-weight:800;color:#0c1e30;background:#c3d3e2;border-radius:100px;padding:5px 11px;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.story-inv-tag b{font-weight:900}
.story-yr{top:calc(100% + 8px)}
@media (max-width:640px){
  .story-curve,.story-comet-layer{bottom:12svh;height:40svh}
  svg.story-curve{height:40svh}
  .story-yr{font-size:17px;top:calc(100% + 6px)}
  .story-axis-lab{top:calc(100% + 30px)}
  .story-inv-tag{font-size:11px;padding:4px 9px;margin-left:-6px}
}
/* games: collapsible shelf */
.ar-more{display:flex;align-items:center;gap:16px;width:100%;margin:34px 0 0;padding:18px 22px;background:#fff;border:2px solid var(--mint);border-radius:18px;box-shadow:0 5px 0 var(--mint);text-align:left;cursor:pointer;font:inherit;color:var(--navy);transition:transform .15s,box-shadow .15s}
.ar-more:hover{transform:translateY(-2px);box-shadow:0 7px 0 var(--mint)}
.ar-more:active{transform:translateY(3px);box-shadow:0 2px 0 var(--mint)}
.ar-more-e{flex:none;width:52px;height:52px;display:grid;place-items:center;border-radius:14px;background:var(--mint-lt);font-size:28px}
.ar-more-t{flex:1;min-width:0}
.ar-more-t b{display:block;font-family:var(--serif);font-size:22px;font-weight:700}
.ar-more-t small{display:block;margin-top:3px;font-size:14px;font-weight:700;color:var(--muted)}
.ar-more-c{flex:none;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:var(--navy);color:#fff;font-size:18px;transition:transform .25s}
.ar-more.open .ar-more-c{transform:rotate(180deg)}
.ar-more-body{animation:arMoreIn .35s ease both}
@keyframes arMoreIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media (max-width:640px){.ar-more{padding:14px 16px;gap:12px}.ar-more-e{width:44px;height:44px;font-size:24px}.ar-more-t b{font-size:18px}.ar-more-t small{font-size:12.5px}}

.story-inv-tag{transform:translate(-100%,calc(-100% - 8px))}

.cta-logo-tile video{width:170px;height:170px;border-radius:22px;object-fit:cover;display:block;box-shadow:0 10px 30px rgba(0,0,0,.3)}
@media (max-width:640px){.cta-logo-tile video{width:130px;height:130px;border-radius:18px}}

.cta-logo-tile{width:auto}
.cta-logo-tile video{aspect-ratio:1;object-fit:contain}

/* CTA: breathing room from the striped border above */
.cta-band{margin-top:64px}
@media (max-width:640px){.cta-band{margin-top:40px}}
/* gold logo: round medallion instead of a white tile */
.cta-logo-tile video{width:170px;height:170px;border-radius:50%;object-fit:cover;transform:scale(1);background:#fff;border:3px solid #c9a84c;box-shadow:0 0 0 6px rgba(201,168,76,.18),0 0 34px rgba(240,217,168,.35),0 14px 30px rgba(0,0,0,.28)}
@media (max-width:640px){.cta-logo-tile video{width:128px;height:128px;border-width:2px;box-shadow:0 0 0 5px rgba(201,168,76,.18),0 0 26px rgba(240,217,168,.3),0 10px 22px rgba(0,0,0,.25)}}

.footer .social{position:relative;z-index:5}
.footer .social a{display:inline-block;padding:8px 2px;pointer-events:auto}

@media (max-width:640px){.marquee.mq-cream{display:none}}
.story{height:160vh}
@media (max-width:640px){.story{height:190svh}}

/* gallery + strips: swipeable */
[data-mq]{touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
[data-mq]:active{cursor:grabbing}
[data-mq] img{-webkit-user-drag:none;pointer-events:none}
.gal-card{cursor:pointer}
/* testimonial play button: small, bottom-left, off the faces */
.tv-play{inset:auto;left:12px;bottom:12px;display:block}
.tv-play > span{width:44px;height:44px;font-size:15px;box-shadow:0 4px 14px rgba(0,0,0,.35)}
@media (max-width:640px){.tv-play{left:10px;bottom:10px}.tv-play > span{width:38px;height:38px;font-size:13px}}

/* gallery shapes restored: arch · landscape rounded · circle · tall rounded square */
.gal-card,.gal-card.shape0,.gal-card.shape1,.gal-card.shape2,.gal-card.shape3{background:linear-gradient(135deg,#17344f,#214a6e);overflow:hidden}
.gal-card img{width:100%;height:100%;object-fit:cover;object-position:center 40%}
.gal-card.shape0{width:290px;height:370px;border-radius:150px 150px 20px 20px}
.gal-card.shape1{width:420px;height:310px;border-radius:24px}
.gal-card.shape2{width:330px;height:330px;border-radius:50%}
.gal-card.shape3{width:280px;height:350px;border-radius:44px}
.gal-row .mq-row{align-items:center}
@media (max-width:640px){
  .gal-card.shape0{width:190px;height:245px;border-radius:100px 100px 16px 16px}
  .gal-card.shape1{width:270px;height:200px;border-radius:18px}
  .gal-card.shape2{width:210px;height:210px}
  .gal-card.shape3{width:180px;height:230px;border-radius:30px}
  .gal-row .mq-row{gap:14px;padding-right:14px}
}

.gal-vid{cursor:default}
.gal-vid-in,.gal-vid-in video{width:100%;height:100%;display:block}
.gal-vid-in video{object-fit:cover}

/* games: gap between the shelf toggle and the navy live-games panel */
.ar-more{margin-bottom:22px}
@media (max-width:640px){.ar-more{margin-bottom:16px}}
/* testimonial play: same circle, bigger glyph */
.tv-play > span{font-size:24px;padding-left:5px}
@media (max-width:640px){.tv-play > span{font-size:20px;padding-left:4px}}
/* group photos: wide rectangle, anchored low so heads fill the frame */
.gal-card.shape-wide{width:500px;height:310px;border-radius:24px;background:#0c1e30;overflow:hidden}
.gal-card.shape-wide img{object-position:center 78%}
@media (max-width:640px){.gal-card.shape-wide{width:320px;height:200px;border-radius:18px}}

/* testimonial play button — drawn, not a text glyph (glyph + padding made it lopsided) */
.tv-play > span{box-sizing:border-box;width:46px;height:46px;padding:0;font-size:0;color:transparent;border-radius:50%;background:rgba(255,255,255,.96);border:none;box-shadow:0 0 0 5px rgba(255,255,255,.22),0 6px 16px rgba(10,30,48,.35);display:grid;place-items:center;transition:transform .2s ease,box-shadow .2s ease}
.tv-play > span::before{content:"";width:16px;height:18px;margin-left:3px;background:var(--teal-dk);clip-path:polygon(0 0,100% 50%,0 100%);border-radius:2px}
.tv-tile:hover .tv-play > span{transform:scale(1.06);box-shadow:0 0 0 7px rgba(255,255,255,.28),0 8px 20px rgba(10,30,48,.4)}
@media (max-width:640px){.tv-play > span{width:40px;height:40px;box-shadow:0 0 0 4px rgba(255,255,255,.22),0 4px 12px rgba(10,30,48,.35)}.tv-play > span::before{width:14px;height:16px;margin-left:3px}}

/* ===== feedback additions ===== */
.hx-recommend{text-align:center;margin:26px auto 0;max-width:34ch;font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.45;color:var(--navy);text-wrap:balance}
.hx-recommend + .hx-facts-cta{margin-top:16px}
.fbq-row{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:14px;margin:0 0 40px}
.fbq{margin:0;background:#fff;border:1px solid var(--line,#dfe9e6);border-radius:18px;padding:22px 22px 18px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow)}
.fbq.lead{background:var(--navy);border-color:var(--navy);color:#fff}
.fbq-tag{align-self:flex-start;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--teal-dk);background:var(--mint-lt);padding:4px 10px;border-radius:100px}
.fbq.lead .fbq-tag{background:rgba(255,255,255,.12);color:var(--mint)}
.fbq blockquote{margin:0;font-family:var(--serif);font-weight:600;font-size:18.5px;line-height:1.45;color:inherit;text-wrap:pretty;flex:1}
.fbq.lead blockquote{font-size:21px}
.fbq figcaption{font-size:13.5px;color:var(--muted)}
.fbq figcaption b{color:var(--navy);font-weight:800}
.fbq.lead figcaption{color:var(--mint)}
.fbq.lead figcaption b{color:#fff}
.faq-sec{background:var(--mint-lt);padding:88px 0}
.faq-wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}
.faq-h{font-size:clamp(34px,4.2vw,52px);margin:14px 0 0;color:var(--navy);line-height:1.1}
.faq-h em{font-style:italic;color:var(--teal)}
.faq-list{display:flex;flex-direction:column;gap:12px}
.faq-item{background:#fff;border-radius:16px;box-shadow:var(--shadow);overflow:hidden}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;text-align:left;background:none;border:0;padding:20px 22px;font-family:var(--sans);font-size:18px;font-weight:800;color:var(--navy);cursor:pointer;min-height:56px}
.faq-q i{position:relative;flex:none;width:30px;height:30px;border-radius:50%;background:var(--mint-lt)}
.faq-q i::before,.faq-q i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--teal-dk);border-radius:2px;transition:transform .25s ease}
.faq-q i::after{transform:rotate(90deg)}
.faq-item.open .faq-q i::after{transform:rotate(0)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
.faq-item.open .faq-a{grid-template-rows:1fr}
.faq-a p{overflow:hidden;margin:0;padding:0 22px;font-size:16.5px;line-height:1.6;color:#34536a}
.faq-item.open .faq-a p{padding-bottom:20px}
@media (max-width:900px){.fbq-row{grid-template-columns:1fr 1fr}.fbq.lead{grid-column:1/-1}.faq-wrap{grid-template-columns:1fr;gap:24px}}
@media (max-width:640px){
  .hx-recommend{font-size:17px;margin-top:22px}
  .fbq-row{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -20px 30px;padding:4px 20px 8px;scrollbar-width:none}
  .fbq-row::-webkit-scrollbar{display:none}
  .fbq{flex:0 0 82%;scroll-snap-align:start;padding:20px 18px 16px}
  .fbq blockquote{font-size:17px}
  .fbq.lead blockquote{font-size:18px}
  .faq-sec{padding:60px 0}
  .faq-h{font-size:30px}
  .faq-q{font-size:16.5px;padding:18px}
  .faq-a p{font-size:15.5px;padding:0 18px}
  .faq-item.open .faq-a p{padding-bottom:18px}
}

/* ===== testimonials: focus ===== */
.fs-sec{background:var(--cream)}
.fs-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);grid-template-areas:"copy stage" "strip stage";column-gap:64px;row-gap:28px;align-items:start}
.fs-copy{grid-area:copy;align-self:end}
.fs-copy h2{margin:14px 0 14px}
.fs-copy h2 em{font-style:italic;color:var(--teal)}
.fs-copy p{font-size:18px;color:var(--muted);max-width:36ch;margin:0 0 26px}
.fs-ctrl{display:flex;align-items:center;gap:16px}
.fs-arrow{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--navy);background:none;color:var(--navy);font-size:18px;font-weight:800;cursor:pointer;transition:background .2s,color .2s}
.fs-arrow:hover{background:var(--navy);color:#fff}
.fs-count{font-size:14px;font-weight:700;color:var(--muted);letter-spacing:.06em;font-variant-numeric:tabular-nums}
.fs-count b{font-family:var(--serif);font-size:24px;color:var(--navy)}
.fs-stage{grid-area:stage}
.fs-card{margin:0;position:relative;aspect-ratio:4/5;border-radius:24px;overflow:hidden;box-shadow:0 24px 60px rgba(26,58,92,.18);animation:fsIn .45s cubic-bezier(.2,.8,.3,1) both}
@keyframes fsIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
.fs-video{background:#0c1e30}
.fs-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.fs-poster{position:absolute;inset:0;width:100%;padding:0;border:0;background:none;cursor:pointer;display:block;text-align:left}
.fs-poster img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.fs-poster:hover img{transform:scale(1.03)}
.fs-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,30,48,0) 45%,rgba(12,30,48,.88))}
.fs-play{position:absolute;right:22px;bottom:22px;width:64px;height:64px;border-radius:50%;background:var(--gold);color:var(--navy);display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.fs-play svg{margin-left:3px}
.fs-vcap{position:absolute;left:24px;right:100px;bottom:24px;display:flex;flex-direction:column;gap:6px;color:#fff}
.fs-vcap b{font-family:var(--serif);font-size:26px;line-height:1.15}
.fs-vcap small{font-size:13px;font-weight:700;color:var(--mint)}
.fs-tag{align-self:flex-start;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:5px 11px;border-radius:100px;background:rgba(255,255,255,.14);color:var(--mint)}
.fs-quote{background:var(--navy);color:#fff;padding:34px 32px 30px;display:flex;flex-direction:column}
.fs-mark{font-family:var(--serif);font-size:120px;line-height:.7;color:var(--gold);margin:22px 0 4px;height:56px}
.fs-quote blockquote{margin:0;flex:1;font-family:var(--serif);font-weight:600;font-size:clamp(22px,2.3vw,28px);line-height:1.35;text-wrap:pretty}
.fs-quote figcaption{display:flex;align-items:center;gap:12px;margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14)}
.fs-quote figcaption span:last-child{display:flex;flex-direction:column;font-size:13.5px;color:var(--mint)}
.fs-quote figcaption b{font-size:16px;color:#fff;font-weight:800}
.fs-ini{width:44px;height:44px;border-radius:50%;background:var(--teal);display:grid;place-items:center;font-weight:800;font-size:15px;color:#fff;flex:none}
.fs-strip-wrap{grid-area:strip;min-width:0;align-self:start}
.fs-strip{display:flex;gap:12px;overflow-x:auto;padding:8px 4px 10px;scrollbar-width:none;scroll-snap-type:x proximity}
.fs-strip::-webkit-scrollbar{display:none}
.fs-face{position:relative;flex:none;width:62px;height:62px;border-radius:50%;padding:0;border:0;background:var(--mint-lt);cursor:pointer;scroll-snap-align:center;box-shadow:0 0 0 2px var(--cream),0 0 0 3px transparent;transition:transform .2s,box-shadow .2s,opacity .2s;opacity:.62}
.fs-face img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.fs-face-ini{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:var(--navy);color:#fff;font-weight:800;font-size:17px}
.fs-face.is-vid i{position:absolute;right:-2px;bottom:-2px;width:22px;height:22px;border-radius:50%;background:var(--gold);border:2px solid var(--cream)}
.fs-face.is-vid i::after{content:"";position:absolute;left:8px;top:6px;border-left:7px solid var(--navy);border-top:4.5px solid transparent;border-bottom:4.5px solid transparent}
.fs-face:hover{opacity:.9}
.fs-face.on{opacity:1;transform:scale(1.08);box-shadow:0 0 0 3px var(--cream),0 0 0 5px var(--teal)}
@media (max-width:900px){
  .fs-wrap{grid-template-columns:1fr;grid-template-areas:"copy" "stage" "strip";row-gap:20px}
  .fs-stage{max-width:440px;width:100%;margin:0 auto}
}
@media (max-width:640px){
  .fs-copy p{font-size:16px;margin-bottom:0}
  .fs-ctrl{display:none}
  .fs-card{aspect-ratio:4/5;border-radius:20px}
  .fs-quote{padding:24px 22px 22px}
  .fs-mark{font-size:96px;margin:14px 0 0;height:44px}
  .fs-quote blockquote{font-size:21px}
  .fs-vcap{left:18px;right:86px;bottom:18px}
  .fs-vcap b{font-size:22px}
  .fs-play{width:56px;height:56px;right:18px;bottom:18px}
  .fs-strip{margin:0 -20px;padding:8px 20px 10px}
  .fs-face{width:54px;height:54px}
}

/* ===== testimonials: reel wall (videos + quotes in one rail) ===== */
.rw-sec{background:var(--cream);overflow:hidden}
.rw-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:34px}
.rw-head h2{margin:14px 0 0}
.rw-head h2 em{font-style:italic;color:var(--teal)}
.rw-head-r{display:flex;align-items:center;gap:24px}
.rw-head-r p{margin:0;font-size:17px;color:var(--muted);max-width:28ch}
.rw-arrows{display:flex;gap:10px}
.rw-arrow{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--navy);background:none;color:var(--navy);font-size:18px;font-weight:800;cursor:pointer;transition:background .2s,color .2s}
.rw-arrow:hover{background:var(--navy);color:#fff}
.rw-rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px max(20px,calc((100vw - 1200px)/2 + 20px)) 24px;scroll-padding-left:max(20px,calc((100vw - 1200px)/2 + 20px));scrollbar-width:none;align-items:stretch}
.rw-rail::-webkit-scrollbar{display:none}
.rw-card{flex:none;width:280px;height:440px;border-radius:22px;scroll-snap-align:start;margin:0;position:relative;overflow:hidden}
.rw-vid{padding:0;border:0;cursor:pointer;background:#0c1e30;box-shadow:0 14px 34px rgba(26,58,92,.18)}
.rw-vid img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.rw-vid:hover img{transform:scale(1.04)}
.rw-vshade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,30,48,0) 55%,rgba(12,30,48,.8))}
.rw-vbtn{position:absolute;left:18px;bottom:18px;width:48px;height:48px;border-radius:50%;background:#fff;color:var(--navy);display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.3);transition:transform .2s}
.rw-vbtn svg{margin-left:2px}
.rw-vid:hover .rw-vbtn{transform:scale(1.08)}
.rw-vlab{position:absolute;left:78px;right:16px;bottom:30px;color:#fff;font-weight:800;font-size:14.5px;text-align:left;line-height:1.25}
.rw-quote{width:300px;padding:28px 26px 24px;display:flex;flex-direction:column}
.rw-quote.t-mint{background:var(--mint-lt)}
.rw-quote.t-gold{background:#f6ecd6}
.rw-quote.t-sand{background:#fff;border:1px solid var(--line-soft,#e3ece9)}
.rw-mark{font-family:var(--serif);font-size:84px;line-height:.6;height:36px;color:var(--teal)}
.rw-quote.t-gold .rw-mark{color:var(--gold)}
.rw-quote blockquote{margin:0;flex:1;font-family:var(--serif);font-weight:600;font-size:20px;line-height:1.42;color:var(--navy);text-wrap:pretty;overflow:hidden}
.rw-quote figcaption{display:flex;flex-direction:column;gap:2px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(26,58,92,.12)}
.rw-quote figcaption b{font-size:15.5px;color:var(--navy)}
.rw-quote figcaption span{font-size:13px;color:var(--muted)}
@media (max-width:640px){
  .rw-head{margin-bottom:22px;gap:12px}
  .rw-head-r p{font-size:15.5px}
  .rw-arrows{display:none}
  .rw-rail{gap:12px;padding:4px 20px 18px;scroll-padding-left:20px}
  .rw-card{width:66vw;max-width:260px;height:400px;border-radius:20px}
  .rw-quote{width:74vw;max-width:290px;padding:22px 20px 20px}
  .rw-quote blockquote{font-size:18px}
  .rw-mark{font-size:72px;height:30px}
}

/* ===== testimonials: previous layout, polished ===== */
.tp-sec .fbq-row{margin-bottom:28px}
.tp-sec .fbq{box-shadow:0 10px 28px rgba(26,58,92,.08)}
.tp-videos{background:var(--navy);border-radius:24px;padding:26px 0 8px 26px;margin-bottom:28px}
.tp-videos .tv-head{padding-right:26px;margin-bottom:16px}
.tp-vh{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;color:#fff}
.tp-vh b{font-family:var(--serif);font-size:24px;font-weight:600}
.tp-vh span:last-child{font-size:13.5px;font-weight:700;color:var(--mint)}
.tp-vh-dot{width:9px;height:9px;border-radius:50%;background:var(--gold);align-self:center}
.tp-videos .tst-arrow{border-color:rgba(255,255,255,.4);color:#fff;background:transparent}
.tp-videos .tst-arrow:hover{background:#fff;color:var(--navy)}
.tp-videos .tv-rail{margin-bottom:0;padding-right:26px}
.tp-videos .tv-tile{border-radius:16px;box-shadow:none}
.tp-videos .tv-tile img{transition:transform .5s ease}
.tp-videos .tv-tile:hover img{transform:scale(1.05)}
.tp-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,30,48,0) 60%,rgba(12,30,48,.6));pointer-events:none}
.tv-tile .tv-play{display:none}
.tp-play{position:absolute;left:12px;bottom:12px;width:40px;height:40px;border-radius:50%;background:var(--gold);color:var(--navy);display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.3);transition:transform .2s}
.tp-play svg{margin-left:2px}
.tv-tile:hover .tp-play{transform:scale(1.1)}
.tp-sec .tst-written-wide{background:#fff;border:1px solid var(--line-soft,#e3ece9);box-shadow:none}
@media (max-width:640px){
  .tp-videos{border-radius:20px;padding:20px 0 4px 18px;margin:0 -4px 22px}
  .tp-videos .tv-head{padding-right:18px}
  .tp-videos .tv-arrows{display:none}
  .tp-vh b{font-size:21px}
  .tp-videos .tv-rail{padding-right:18px}
  .tp-play{width:36px;height:36px;left:10px;bottom:10px}
}

/* quotes: one swipeable rail of all written stories */
.tq-head{display:flex;justify-content:space-between;align-items:center;margin:0 0 14px}
.tq-head>span{font-size:12.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.fbq-row.tq-rail{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 18px;margin:0 0 18px;scrollbar-width:none;align-items:stretch}
.tq-rail::-webkit-scrollbar{display:none}
.tq-rail .fbq{flex:0 0 calc((100% - 28px)/3.15);scroll-snap-align:start}
.tq-rail .fbq.lead{flex-basis:calc((100% - 28px)/2.3)}
/* classier play: frosted pill, thin ring */
.tp-videos .tv-tile .tp-shade{z-index:1}
.tp-play{z-index:2;left:14px;bottom:14px;width:auto;height:auto;border-radius:100px;background:rgba(255,255,255,.16);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.45);color:#fff;display:flex;align-items:center;gap:9px;padding:5px 15px 5px 5px;box-shadow:0 6px 20px rgba(0,0,0,.22);transition:background .25s,color .25s,border-color .25s}
.tp-play-ring{width:32px;height:32px;border-radius:50%;background:#fff;color:var(--navy);display:grid;place-items:center}
.tp-play-ring svg{margin-left:2px}
.tp-play-lab{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.tv-tile:hover .tp-play{transform:none;background:#fff;color:var(--navy);border-color:#fff}
.tv-tile:hover .tp-play-ring{background:var(--gold);color:#fff}
@media (max-width:900px){.tq-rail .fbq,.tq-rail .fbq.lead{flex-basis:calc((100% - 14px)/1.6)}}
@media (max-width:640px){
  .tq-head .tv-arrows{display:none}
  .fbq-row.tq-rail{margin:0 -20px 14px;padding:4px 20px 14px;scroll-padding-left:20px}
  .tq-rail .fbq,.tq-rail .fbq.lead{flex-basis:80%}
  .tp-play{left:10px;bottom:10px;padding:4px 12px 4px 4px;gap:7px}
  .tp-play-ring{width:28px;height:28px}
  .tp-play-lab{font-size:11px}
}

/* ===== batches: one flagship + two coming soon ===== */
.bt-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:20px;align-items:stretch}
.bt-main{position:relative;background:var(--navy);color:#fff;border-radius:24px;padding:36px 38px 34px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 60px rgba(26,58,92,.22)}
.bt-main::after{content:"";position:absolute;right:-90px;top:-90px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(201,168,76,.22),transparent 70%);pointer-events:none}
.bt-main-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}
.bt-kicker{font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.bt-status{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:6px 12px;border-radius:100px;background:var(--mint-lt);color:var(--teal-dk)}
.bt-status i{width:7px;height:7px;border-radius:50%;background:currentColor}
.bt-status.open{background:rgba(42,157,143,.22);color:var(--mint)}
.bt-status.open i{background:#5fd3c4;box-shadow:0 0 0 4px rgba(95,211,196,.2);animation:btPulse 2s ease-in-out infinite}
@keyframes btPulse{50%{box-shadow:0 0 0 7px rgba(95,211,196,0)}}
.bt-main h3{font-family:var(--serif);font-size:clamp(32px,3.4vw,44px);line-height:1.08;margin:0 0 14px;color:#fff}
.bt-who{font-size:17px;line-height:1.6;color:rgba(224,243,240,.85);max-width:46ch;margin:0 0 28px}
.bt-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0 0 30px;border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14)}
.bt-facts div{padding:16px 14px 16px 0}
.bt-facts div+div{padding-left:16px;border-left:1px solid rgba(255,255,255,.14)}
.bt-facts dt{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--mint);opacity:.8;margin-bottom:6px}
.bt-facts dd{margin:0;font-family:var(--serif);font-size:19px;font-weight:600;color:#fff}
.bt-buy{margin-top:6px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.bt-price b{display:block;font-family:var(--serif);font-size:38px;line-height:1;color:var(--gold)}
.bt-price>span{display:block;font-size:13.5px;color:rgba(224,243,240,.75);margin-top:6px}
.bt-side{display:grid;grid-template-rows:1fr 1fr;gap:20px}
.bt-soon{background:#fff;border:1px solid var(--line-soft,#e3ece9);border-radius:22px;padding:26px 26px 22px;display:flex;flex-direction:column;align-items:flex-start;box-shadow:0 10px 28px rgba(26,58,92,.06)}
.bt-soon h3{font-family:var(--serif);font-size:24px;color:var(--navy);margin:16px 0 8px}
.bt-soon p{font-size:15.5px;line-height:1.55;color:var(--muted);margin:0 0 16px}
.bt-chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px;padding:0}
.bt-chips li{font-size:13px;font-weight:700;color:var(--navy);background:var(--cream);border:1px solid var(--line-soft,#e3ece9);padding:5px 11px;border-radius:100px}
.bt-link{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:15px;color:var(--teal-dk);text-decoration:none;border-bottom:2px solid var(--mint);padding-bottom:3px;transition:gap .2s,border-color .2s}
.bt-link:hover{gap:12px;border-color:var(--teal);color:var(--teal-dk)}
@media (max-width:900px){.bt-grid{grid-template-columns:1fr}.bt-side{grid-template-rows:none;grid-template-columns:1fr 1fr}}
@media (max-width:640px){
  .bt-main{padding:26px 22px 24px;border-radius:20px}
  .bt-main-top{margin-bottom:18px}
  .bt-main h3{font-size:30px}
  .bt-who{font-size:15.5px;margin-bottom:22px}
  .bt-facts{grid-template-columns:1fr 1fr;margin-bottom:24px}
  .bt-facts div,.bt-facts div+div{padding:13px 0;border-left:0}
  .bt-facts div:nth-child(even){padding-left:16px;border-left:1px solid rgba(255,255,255,.14)}
  .bt-facts div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.14)}
  .bt-facts dd{font-size:17px}
  .bt-buy{flex-direction:column;align-items:stretch}
  .bt-buy .btn{justify-content:center}
  .bt-price b{font-size:32px}
  .bt-side{grid-template-columns:1fr;gap:14px}
  .bt-soon{padding:22px 20px 20px;border-radius:18px}
  .bt-soon h3{font-size:22px}
}

/* footer logo: sit it on a light disc so it reads on navy */
.fbrand img{width:64px;height:64px;border-radius:50%;background:#fff;padding:5px;box-shadow:0 0 0 2px rgba(201,168,76,.55),0 6px 18px rgba(0,0,0,.25);object-fit:contain}
@media (max-width:640px){.fbrand img{width:56px;height:56px;padding:4px}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.cta-logo-still{width:100%;height:100%;object-fit:contain;display:block}

.mfx picture{display:contents}
.kbc-video video,.game-feature-video video{width:100%;height:auto;display:block}

/* ===== games: one block, three tiles, one door ===== */
.ar-lite{padding:88px 0}
.ar-lite-head{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:end;margin-bottom:34px}
.ar-lite-head h2{font-size:clamp(32px,4vw,50px);line-height:1.08;margin:12px 0 0}
.ar-lite-head p{margin:0;font-size:17.5px;line-height:1.55;color:var(--muted)}
.ar-start{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ar-big{position:relative;display:flex;flex-direction:column;min-height:300px;border-radius:22px;overflow:hidden;padding:22px;color:var(--navy);background:var(--mint-lt);box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s}
.ar-big:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(26,58,92,.18);color:var(--navy)}
.ar-big.tone-navy{background:linear-gradient(160deg,#2c5a8a,var(--navy));color:#fff}.ar-big.tone-navy:hover{color:#fff}
.ar-big.tone-gold{background:linear-gradient(160deg,#f7e9b8,#e8c96a)}
.ar-big.tone-teal{background:linear-gradient(160deg,#c9ebe5,#8fd3c8)}
.ar-big-e{position:absolute;right:-14px;top:-10px;font-size:150px;line-height:1;transform:rotate(-8deg);filter:saturate(1.25) drop-shadow(0 12px 20px rgba(15,39,64,.3));transition:transform .3s}
.ar-big:hover .ar-big-e{transform:rotate(-3deg) scale(1.05)}
.ar-big-body{margin-top:auto;position:relative;display:flex;flex-direction:column;gap:6px;max-width:80%}
.ar-big-body b{font-family:var(--serif);font-weight:600;font-size:26px;line-height:1.15}
.ar-big-body span{font-size:15px;line-height:1.45;opacity:.85}
.ar-big-body em{font-style:normal;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin-top:8px}
.ar-lite-cta{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:30px;flex-wrap:wrap}
.ar-lite-cta span{font-size:14px;color:var(--muted)}
/* classroom games inside the gallery */
.gal-games{margin-top:48px}
.gal-games-head{max-width:60ch;margin-bottom:22px}
.gal-games-head h3{font-family:var(--serif);font-weight:600;font-size:clamp(26px,3vw,38px);color:#fff;line-height:1.12;margin:10px 0 10px}
.gal-games-head h3 em{font-style:italic;color:var(--gold)}
.gal-games-head p{margin:0;font-size:16.5px;line-height:1.5;color:rgba(224,243,240,.8)}
.gal-games-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.gal-game{margin:0;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.gal-game img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.gal-game figcaption{padding:12px 14px 14px}
.gal-game b{font-family:var(--serif);font-weight:600;font-size:17px;color:#fff;display:block}
.gal-game span{font-size:13px;color:var(--mint);display:block;margin-top:3px;line-height:1.4}
@media (max-width:900px){.ar-lite-head{grid-template-columns:1fr;gap:12px}.gal-games-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){
  .ar-lite{padding:56px 0}
  .ar-start{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -20px;padding:4px 20px 10px;scrollbar-width:none}
  .ar-start::-webkit-scrollbar{display:none}
  .ar-big{flex:0 0 78%;min-height:250px;scroll-snap-align:start;padding:18px}
  .ar-big-e{font-size:120px}
  .ar-big-body b{font-size:22px}
  .ar-lite-cta .btn{width:100%;justify-content:center}
  .gal-games{margin-top:34px}
  .gal-games-grid{display:flex;gap:12px;overflow-x:auto;margin:0 -20px;padding:0 20px 8px;scrollbar-width:none}
  .gal-games-grid::-webkit-scrollbar{display:none}
  .gal-game{flex:0 0 74%}
}

.founder p.founder-cred{font-size:14px;line-height:1.4;font-weight:700;letter-spacing:.02em;color:var(--teal-dk);margin:-6px 0 14px}
.founder p.founder-cred em{font-style:italic;color:var(--navy)}
.cw-cta{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.cw-cta span{font-size:14.5px;color:var(--muted)}
.cw-cta span a{font-weight:800}

h1.hx-lines{margin:0;font-weight:inherit;font-size:inherit;line-height:inherit;display:block}
@media (min-width:900px){.eyebrow,.hx-proof-line,.bt-facts dt,.tile-meta,.fbq figcaption,.tp-vh span,.ar-big-body em{color:#3f6472}.eyebrow{color:var(--teal-dk)}}
.footer-disclaimer{margin:14px 0 0;font-size:12.5px;line-height:1.5;color:rgba(224,243,240,.7)}
.cw-lead{font-family:var(--serif);font-weight:600;font-size:20px;line-height:1.35;color:var(--navy);margin:0 0 10px}
@media (max-width:640px){.gal-game img,.cw-card img,.frame img,.tv-tile img,.ar-big img{object-fit:cover}img{max-width:100%;height:auto}.gal-card img,.gal-game img,.cw-card img,.tv-tile img,.frame img{height:100%}}

/* ── Audit fixes, 21 Oct 2026 ── */
/* W9: "₹10,000 / month" ran off the right edge on phones (463px of text in a 354px column) */
@media (max-width:480px){.story-big{font-size:9vw}}
/* W13: the flex nav squeezed the logo to 29×40; keep its 180:198 shape */
.nav-brand picture{flex:none;display:block;line-height:0}
.nav-brand img{width:auto;max-width:none;object-fit:contain}
/* W1: an open batch on a light "soon" card — .bt-status.open is styled for the dark flagship card */
.bt-soon .bt-status.open{background:#d9f2ee;color:#155e55}
.bt-soon .bt-status.open i{background:#1f9e8f}
/* CLS fix, 21 Oct 2026: the JS pin swapped .story-stick between absolute and fixed while
   scrolling, and each swap counted as a whole-screen layout shift (PostHog CLS 0.75, measured 1.0).
   position:sticky gives the same pinned effect with no layout shift. The pin-* classes stay
   harmless. */
.story-stick,.story-stick.pin-fixed,.story-stick.pin-bottom{position:sticky;top:0;bottom:auto}
/* LCP fix, 21 Oct 2026: the hero lines started at opacity:0, and browsers don't count an
   invisible element as painted — so "largest content" waited for the whole fade (~1.2 s).
   Starting faintly visible keeps the same slide-up entrance but counts from the first frame. */
@keyframes hxInVisible{from{opacity:.15;transform:translateY(60px)}to{opacity:1;transform:none}}
.hx-line{opacity:.15;animation-name:hxInVisible}
@media (prefers-reduced-motion:reduce){.hx-line{opacity:1;transform:none;animation:none}}