/* ═══════════════════════════════════════════════════════════════
   SENIOR MEAL LIFESTYLE · The Complete Kidney Guide for Seniors
   "The Day & Night of Your Kidneys" — scroll-driven landing page
   ═══════════════════════════════════════════════════════════════ */

:root{
  /* palette */
  --ink:        #22382E;   /* deep forest */
  --ink-soft:   #4C5F52;
  --gold:       #C6973F;
  --gold-bright:#E8BE66;
  --gold-deep:  #A87C2C;
  --cream:      #FBF5E9;
  --paper:      rgba(255,252,244,.86);
  --blush:      #E9A98F;
  --night-ink:  #F4ECDB;
  --night-soft: rgba(244,236,219,.72);
  --night-card: rgba(24,29,66,.55);
  --night-line: rgba(232,190,102,.25);

  /* type */
  --serif: "Fraunces", Georgia, serif;
  --sans:  "Atkinson Hyperlegible", "Segoe UI", Arial, sans-serif;

  --radius: 22px;
  --shadow: 0 18px 50px -18px rgba(46,58,40,.28);
  --maxw: 1200px;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--sans);
  font-size:19px;               /* 60+ audience: never below 18px */
  line-height:1.68;
  color:var(--ink);
  background:#F7E7CB;           /* fallback behind the sky */
  overflow-x:hidden;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }
.visually-hidden{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ── typography ─────────────────────────────────────────────── */
h1,h2,h3{ font-family:var(--serif); font-weight:500; line-height:1.14; letter-spacing:-.01em; }
h1{ font-size:clamp(2.7rem, 4.8vw, 4.5rem); }
h1 em{ font-style:italic; color:var(--gold-deep); }
h2{ font-size:clamp(2rem, 3.4vw, 3.1rem); }
h3{ font-size:clamp(1.3rem, 1.8vw, 1.55rem); line-height:1.28; }
.eyebrow{
  font-size:.82rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-deep); margin-bottom:1.1rem;
}
.section-head{ text-align:center; max-width:820px; margin:0 auto 3.5rem; }
.section-head.left{ text-align:left; margin:0 0 1.6rem; }
.section-intro{ margin-top:1.2rem; font-size:1.1rem; color:var(--ink-soft); }
.section-head.night h2{ color:var(--night-ink); }
.section-head.night .section-intro{ color:var(--night-soft); }
.section-head.night .eyebrow{ color:var(--gold-bright); }

/* ── layout ─────────────────────────────────────────────────── */
.section{ position:relative; padding:clamp(5rem, 10vh, 8.5rem) clamp(1.2rem, 4vw, 3rem); }
.container{ max-width:var(--maxw); margin:0 auto; position:relative; }
.container.narrow{ max-width:780px; }

/* ═══ THE SKY — fixed, scroll-crossfaded day-to-night gradient ═══ */
#sky{ position:fixed; inset:0; z-index:-2; }
.sky-layer{ position:absolute; inset:0; opacity:0; will-change:opacity; }
#sky-dawn{
  opacity:1;
  background:
    radial-gradient(ellipse 90% 55% at 72% 78%, rgba(255,214,150,.75), transparent 60%),
    linear-gradient(180deg, #FDEFD8 0%, #F8DDB2 46%, #F2C795 100%);
}
#sky-day{
  background:
    radial-gradient(ellipse 80% 50% at 30% 8%, rgba(255,251,235,.8), transparent 60%),
    linear-gradient(180deg, #EEF6EE 0%, #DFEFE5 52%, #CFE6D8 100%);
}
#sky-dusk{
  background:
    radial-gradient(ellipse 85% 55% at 78% 88%, rgba(255,178,120,.55), transparent 62%),
    linear-gradient(180deg, #F9E4C2 0%, #F3C9A0 48%, #E4A583 100%);
}
#sky-night{
  background:
    radial-gradient(ellipse 100% 60% at 50% 115%, rgba(72,64,138,.5), transparent 65%),
    linear-gradient(180deg, #1C2254 0%, #141945 42%, #0B0F2C 100%);
}
/* starfields (fade in with night) */
#stars,#stars2{ position:absolute; inset:0; opacity:0; background-repeat:repeat; will-change:opacity; }
#stars{
  background-image:radial-gradient(1.4px 1.4px at 12% 22%, #FFF9E8 60%, transparent 61%),
    radial-gradient(1px 1px at 34% 64%, #FDF3D6 60%, transparent 61%),
    radial-gradient(1.7px 1.7px at 57% 14%, #FFFDF4 60%, transparent 61%),
    radial-gradient(1px 1px at 71% 47%, #F7ECCB 60%, transparent 61%),
    radial-gradient(1.3px 1.3px at 88% 25%, #FFF9E8 60%, transparent 61%),
    radial-gradient(1px 1px at 22% 84%, #FDF3D6 60%, transparent 61%),
    radial-gradient(1.5px 1.5px at 66% 82%, #FFFDF4 60%, transparent 61%),
    radial-gradient(1px 1px at 92% 68%, #F7ECCB 60%, transparent 61%);
  background-size:520px 520px;
}
#stars2{
  background-image:radial-gradient(1px 1px at 8% 48%, #EFE4C2 60%, transparent 61%),
    radial-gradient(1.2px 1.2px at 43% 34%, #FFF6DE 60%, transparent 61%),
    radial-gradient(1px 1px at 78% 12%, #EFE4C2 60%, transparent 61%),
    radial-gradient(1.2px 1.2px at 55% 74%, #FFF6DE 60%, transparent 61%);
  background-size:340px 340px;
  animation:twinkle 5.5s ease-in-out infinite alternate;
}
@keyframes twinkle{ from{ filter:brightness(.85);} to{ filter:brightness(1.25);} }

/* the sun / moon orb travelling with the scroll */
#orb{ position:fixed; top:12vh; left:80vw; width:88px; height:88px; z-index:-1; will-change:transform; pointer-events:none; }
#orb .sun,#orb .moon{ position:absolute; inset:0; border-radius:50%; transition:opacity .4s linear; }
#orb .sun{
  background:radial-gradient(circle at 42% 38%, #FFF3CF, #F5C860 62%, rgba(245,200,96,0) 74%);
  box-shadow:0 0 70px 28px rgba(248,205,120,.55);
}
#orb .moon{
  opacity:0;
  background:radial-gradient(circle at 62% 40%, #FBF6E7, #D9D4C4 70%);
  box-shadow:0 0 55px 18px rgba(233,226,203,.35);
  -webkit-mask:radial-gradient(circle at 32% 42%, transparent 34%, #000 36%);
          mask:radial-gradient(circle at 32% 42%, transparent 34%, #000 36%);
}

/* ambient drifting light particles */
#particles{ position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
#particles i{
  position:absolute; bottom:-4vh; border-radius:50%;
  background:radial-gradient(circle, rgba(255,236,190,.9), rgba(255,236,190,0) 70%);
  animation:drift linear infinite;
  opacity:0;
}
@keyframes drift{
  0%{ transform:translate3d(0,0,0); opacity:0; }
  12%{ opacity:var(--po,.35); }
  88%{ opacity:var(--po,.35); }
  100%{ transform:translate3d(var(--px,3vw), -108vh, 0); opacity:0; }
}

/* ═══ HEADER ═══ */
#site-header{
  position:fixed; top:0; left:0; right:0; z-index:60;
  transition:background .45s ease, box-shadow .45s ease, backdrop-filter .45s ease;
}
#site-header.scrolled{
  background:rgba(251,245,233,.78);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 8px 30px -18px rgba(46,58,40,.35);
}
body.night-mode #site-header.scrolled{
  background:rgba(14,18,44,.7);
  box-shadow:0 8px 30px -14px rgba(0,0,0,.55);
}
.header-inner{
  max-width:1320px; margin:0 auto; padding:.85rem clamp(1rem,3vw,2rem);
  display:flex; align-items:center; gap:1.6rem;
}
.brand{ display:flex; align-items:baseline; gap:.5rem; text-decoration:none; font-family:var(--serif); }
.brand-mark{ align-self:center; width:12px; height:12px; border-radius:50% 50% 50% 4px; background:linear-gradient(140deg,var(--gold-bright),var(--gold-deep)); box-shadow:0 0 10px rgba(230,185,95,.7); }
.brand-text{ font-size:1.18rem; font-weight:600; color:var(--ink); }
.brand-sub{ font-size:.95rem; color:var(--ink-soft); font-style:italic; }
body.night-mode .brand-text{ color:var(--night-ink); }
body.night-mode .brand-sub{ color:var(--night-soft); }
.header-nav{ margin-left:auto; display:flex; gap:1.5rem; }
.header-nav a{
  text-decoration:none; font-size:.98rem; font-weight:700; color:var(--ink-soft);
  border-bottom:2px solid transparent; padding-bottom:2px; transition:color .3s, border-color .3s;
}
.header-nav a:hover{ color:var(--gold-deep); border-color:var(--gold); }
body.night-mode .header-nav a{ color:var(--night-soft); }
body.night-mode .header-nav a:hover{ color:var(--gold-bright); }

/* ═══ BUTTONS ═══ */
.btn{
  display:inline-block; text-decoration:none; text-align:center;
  font-family:var(--sans); font-weight:700; color:#2C2410;
  background:linear-gradient(160deg, var(--gold-bright) 0%, var(--gold) 55%, var(--gold-deep) 130%);
  border:none; border-radius:999px; cursor:pointer;
  padding:.95rem 2rem; font-size:1.05rem;
  box-shadow:0 10px 28px -10px rgba(168,124,44,.55), inset 0 1px 0 rgba(255,255,255,.5);
  transition:transform .35s ease, box-shadow .35s ease, filter .35s ease;
}
.btn:hover{
  transform:translateY(-2px);
  filter:brightness(1.06);
  box-shadow:0 0 0 6px rgba(232,190,102,.18), 0 16px 40px -10px rgba(198,151,63,.7), inset 0 1px 0 rgba(255,255,255,.5);
}
.btn:focus-visible{ outline:3px solid var(--ink); outline-offset:3px; }
body.night-mode .btn:focus-visible{ outline-color:var(--gold-bright); }
.btn-big{ padding:1.15rem 2.5rem; font-size:1.15rem; }
.btn-small{ padding:.65rem 1.4rem; font-size:.98rem; }
.btn-block{ display:block; width:100%; }
.btn-ghost{
  background:transparent; color:var(--ink);
  box-shadow:inset 0 0 0 2px rgba(34,56,46,.35);
}
.btn-ghost:hover{ box-shadow:inset 0 0 0 2px var(--gold-deep), 0 0 0 6px rgba(232,190,102,.14); color:var(--gold-deep); filter:none; }

/* ═══ REVEAL-ON-SCROLL ═══ */
.reveal{ opacity:0; transform:translateY(30px); transition:opacity .95s ease, transform .95s cubic-bezier(.22,.7,.3,1); }
.reveal.in{ opacity:1; transform:none; }
.d1{ transition-delay:.14s; } .d2{ transition-delay:.28s; } .d3{ transition-delay:.42s; } .d4{ transition-delay:.56s; }

/* ═══ 1 · HERO ═══ */
.hero{
  position:relative; min-height:100vh;
  display:flex; align-items:center;
  padding:7rem clamp(1.2rem,4vw,3rem) 6rem;
  overflow:hidden;
}
.hero-glow{
  position:absolute; right:-8vw; top:8vh; width:56vw; height:80vh;
  background:radial-gradient(closest-side, rgba(255,219,150,.55), transparent 70%);
  filter:blur(10px);
}
.hero-text{ position:relative; z-index:5; max-width:660px; margin-left:clamp(0px, 26vw, 380px); }
.subhead{ margin-top:1.4rem; font-size:1.18rem; color:var(--ink-soft); max-width:56ch; }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2.2rem; }
.trust-line{ margin-top:1.6rem; font-size:1rem; color:var(--ink-soft); }
.trust-line .stars{ color:var(--gold-deep); letter-spacing:.15em; margin-right:.4rem; }

.hero-kidney{
  position:absolute; z-index:1; right:4vw; top:50%;
  width:clamp(280px, 30vw, 470px);
  transform:translateY(-52%);
  filter:drop-shadow(0 0 55px rgba(255,200,110,.75)) drop-shadow(0 24px 40px rgba(120,70,30,.25));
  will-change:transform;
}
.hero-clark{
  position:absolute; z-index:3; left:clamp(.5rem, 3vw, 3.5rem); bottom:0;
  width:clamp(230px, 22vw, 330px); will-change:transform;
}
.hero-clark img{ filter:drop-shadow(0 18px 30px rgba(90,55,20,.35)); }
.hero-clark::after{ /* soft grounding shadow */
  content:""; position:absolute; left:8%; right:8%; bottom:-8px; height:26px;
  background:radial-gradient(ellipse, rgba(70,45,15,.35), transparent 70%); filter:blur(4px);
}
.clark-tag{
  position:absolute; right:-1rem; bottom:2.4rem;
  background:var(--paper); backdrop-filter:blur(6px);
  border-radius:14px; padding:.5rem .9rem; box-shadow:var(--shadow);
  font-family:var(--serif); font-size:1.02rem; color:var(--ink); line-height:1.25;
}
.clark-tag span{ display:block; font-family:var(--sans); font-size:.78rem; color:var(--ink-soft); }

.food{ position:absolute; z-index:2; will-change:transform; filter:drop-shadow(0 14px 22px rgba(120,70,30,.28)); }
.food-blueberries{ width:clamp(70px,7vw,110px); left:34vw; top:14vh; }
.food-cabbage{     width:clamp(85px,8.5vw,135px); right:30vw; bottom:16vh; }
.food-garlic{      width:clamp(64px,6vw,96px);  right:38vw; top:9vh; }
.food-salmon{      width:clamp(90px,8.5vw,130px); left:23vw; bottom:4vh; }
.food-cherries{    width:clamp(70px,7vw,108px);  right:22vw; top:26vh; }

.scroll-hint{
  position:absolute; left:50%; bottom:1.6rem; transform:translateX(-50%);
  width:30px; height:50px; border:2px solid rgba(34,56,46,.4); border-radius:999px; z-index:5;
}
.scroll-hint span{
  position:absolute; left:50%; top:9px; width:5px; height:10px; margin-left:-2.5px;
  border-radius:3px; background:var(--gold-deep);
  animation:hint 2.4s ease-in-out infinite;
}
@keyframes hint{ 0%,100%{ transform:translateY(0); opacity:1;} 60%{ transform:translateY(16px); opacity:0;} }

/* ═══ 2 · THE WONDER ═══ */
.wonder-grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(2rem,5vw,4.5rem); align-items:center;
}
.kidney-svg-wrap{ position:relative; max-width:460px; margin:0 auto; aspect-ratio:440/500; width:100%; }
#kidney-filter{ width:100%; height:100%; }
.k-outline{ stroke:var(--ink); stroke-width:2.4; stroke-opacity:.55; }
.k-branches path{ stroke:var(--ink); stroke-opacity:.3; stroke-width:1.6; fill:none; stroke-linecap:round; }
.k-vessel{ fill:none; stroke-width:7; stroke-linecap:round; }
.k-artery{ stroke:rgba(192,112,79,.4); }
.k-vein{ stroke:rgba(122,160,140,.45); }
.k-ureter{ stroke:rgba(198,151,63,.4); stroke-width:5; }
.k-label{ font-family:var(--sans); font-size:14px; fill:var(--ink-soft); letter-spacing:.04em; }

.flow-dots{ position:absolute; top:0; left:0; width:440px; height:500px; transform-origin:0 0; pointer-events:none; }
.flow-dots i{ position:absolute; top:0; left:0; width:9px; height:9px; border-radius:50%; opacity:0; }
.dot-in{
  background:#B65F41; box-shadow:0 0 8px rgba(182,95,65,.8);
  offset-path:path('M28 150 C86 158 130 176 176 208'); offset-rotate:0deg;
  animation:flow 3.8s linear infinite;
}
.dot-out{
  background:var(--gold-bright); box-shadow:0 0 10px rgba(232,190,102,.95);
  offset-path:path('M176 248 C126 268 74 276 20 272'); offset-rotate:0deg;
  animation:flow 3.8s linear infinite;
}
.dot-down{
  width:6px; height:6px; background:var(--gold-deep); box-shadow:0 0 7px rgba(168,124,44,.8);
  offset-path:path('M186 330 C186 372 196 428 208 492'); offset-rotate:0deg;
  animation:flow 5.2s linear infinite;
}
.i2{ animation-delay:.95s; } .i3{ animation-delay:1.9s; } .i4{ animation-delay:2.85s; }
.o1{ animation-delay:.5s; } .o2{ animation-delay:1.45s; } .o3{ animation-delay:2.4s; } .o4{ animation-delay:3.35s; }
.u1{ animation-delay:.3s; } .u2{ animation-delay:2.9s; }
@keyframes flow{
  0%{ offset-distance:0%; opacity:0; }
  12%{ opacity:1; }
  82%{ opacity:1; }
  100%{ offset-distance:100%; opacity:0; }
}

.stats{ display:flex; flex-direction:column; gap:2.4rem; }
.stat{ border-left:3px solid var(--gold); padding-left:1.6rem; }
.stat-number{ font-family:var(--serif); font-weight:600; font-size:clamp(2.7rem,4.6vw,4.2rem); line-height:1; color:var(--gold-deep); }
.stat-unit{ font-size:.5em; color:var(--ink); font-weight:500; }
.stat-copy{ margin-top:.5rem; color:var(--ink-soft); max-width:38ch; }
.wonder-closing{
  margin:4rem auto 0; max-width:720px; text-align:center;
  font-family:var(--serif); font-size:clamp(1.25rem,2vw,1.55rem); line-height:1.5;
}

/* ═══ CARDS (shared) ═══ */
.card{
  background:var(--paper);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  transition:transform .5s ease, box-shadow .5s ease;
}

/* ═══ 3 · THE PROBLEM ═══ */
.problem-cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.6rem; }
.p-card{ padding:2.2rem 1.9rem; }
.p-card:hover{ transform:translateY(-6px); box-shadow:0 26px 60px -20px rgba(46,58,40,.4), 0 0 0 1px rgba(198,151,63,.25); }
.p-icon{
  width:56px; height:56px; border-radius:50%;
  display:grid; place-items:center; margin-bottom:1.3rem;
  font-size:1.5rem; color:var(--gold-deep);
  background:radial-gradient(circle at 35% 30%, #FDF3DA, #F3DCA9);
  box-shadow:inset 0 0 0 1px rgba(168,124,44,.3);
}
.p-card h3{ margin-bottom:.7rem; }
.p-card p{ color:var(--ink-soft); }
.problem-closing{
  margin:3.4rem auto 0; text-align:center; max-width:640px;
  font-family:var(--serif); font-size:clamp(1.25rem,2vw,1.5rem);
}

/* ═══ 4 · WHAT'S INSIDE ═══ */
.inside-grid{
  display:grid; gap:1.6rem;
  grid-template-columns:repeat(6,minmax(0,1fr));
}
.i-card{ grid-column:span 2; padding:2.1rem 1.9rem; overflow:hidden; position:relative; }
.i-card:hover{ transform:translateY(-6px); box-shadow:0 26px 60px -20px rgba(46,58,40,.42), 0 0 24px rgba(232,190,102,.35); }
.i-card:nth-child(4){ grid-column:span 3; }  /* tonic — photo card */
.i-card:nth-child(5){ grid-column:span 3; }
.i-chapter{
  display:inline-block; font-size:.76rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold-deep); background:rgba(232,190,102,.18);
  border:1px solid rgba(168,124,44,.3); border-radius:999px;
  padding:.28rem .8rem; margin-bottom:1.1rem;
}
.i-card h3{ margin-bottom:.65rem; }
.i-card p{ color:var(--ink-soft); }
.i-foods{ display:flex; gap:.6rem; margin-top:1.4rem; }
.i-foods img{ width:52px; height:52px; object-fit:contain; filter:drop-shadow(0 6px 8px rgba(90,55,20,.25)); }
.i-dishes{ display:flex; gap:.6rem; margin-top:1.4rem; }
.i-dishes img{ width:33%; aspect-ratio:1/1.1; object-fit:cover; border-radius:12px; }
.i-card-photo{ display:grid; grid-template-columns:42% 1fr; padding:0; align-items:stretch; }
.i-photo{ width:100%; height:100%; object-fit:cover; }
.i-photo-copy{ padding:2.1rem 1.9rem; }
.sourcing-badge{
  margin:3.2rem auto 0; max-width:840px; text-align:center;
  font-size:1.05rem; color:var(--ink);
  background:rgba(255,252,244,.6); border:1px solid rgba(168,124,44,.3);
  border-radius:999px; padding:1rem 2rem;
}
.badge-seal{
  display:inline-grid; place-items:center; width:26px; height:26px; margin-right:.5rem;
  border-radius:50%; background:var(--gold); color:#fff; font-size:.9rem; vertical-align:-4px;
}

/* ═══ 5 · MEET DR. CLARK ═══ */
.clark-grid{
  display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(2rem,5vw,4.5rem); align-items:center;
}
.clark-portrait{ position:relative; }
.clark-portrait img{
  border-radius:26px; width:100%;
  box-shadow:0 30px 70px -24px rgba(70,40,15,.5), 0 0 0 6px rgba(255,252,244,.55), 0 0 60px rgba(255,190,120,.35);
}
.bio-copy p{ margin-bottom:1.15rem; color:var(--ink); }
.bio-copy em{ color:var(--gold-deep); }
.pull-quote{
  margin:1.8rem 0; padding:1.4rem 1.8rem;
  font-family:var(--serif); font-style:italic; font-size:clamp(1.2rem,1.8vw,1.4rem); line-height:1.5;
  color:var(--ink); border-left:3px solid var(--gold);
  background:linear-gradient(90deg, rgba(232,190,102,.16), transparent 80%);
  border-radius:0 var(--radius) var(--radius) 0;
}
.yt-link{
  font-weight:700; color:var(--gold-deep); text-decoration:none;
  border-bottom:2px solid rgba(168,124,44,.4); padding-bottom:2px; transition:border-color .3s, color .3s;
}
.yt-link:hover{ color:var(--ink); border-color:var(--ink); }

/* ═══ 6 · TESTIMONIALS ═══ */
.t-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.6rem; }
.t-card{ padding:2rem 1.8rem; display:flex; flex-direction:column; gap:1.1rem; }
.t-card:nth-child(4),.t-card:nth-child(5){ grid-column:span 1; }
.t-grid .t-card:nth-child(4){ grid-column:1 / span 1; }
.t-card blockquote{ font-size:1.02rem; color:var(--ink); }
.t-card blockquote em{ color:var(--gold-deep); font-style:italic; }
.t-card figcaption{ margin-top:auto; font-weight:700; color:var(--ink-soft); font-size:.98rem; }

/* ═══ 7 · THE OFFER — NIGHT ═══ */
.offer{ overflow:hidden; }
.offer-video{
  position:absolute; inset:-2%; width:104%; height:104%; object-fit:cover;
  opacity:.16; mix-blend-mode:screen; filter:hue-rotate(20deg) saturate(.8);
  pointer-events:none;
}
.offer-veil{
  position:absolute; inset:0;
  background:radial-gradient(ellipse 70% 55% at 50% 45%, rgba(20,25,69,0), rgba(11,15,44,.55) 90%);
  pointer-events:none;
}
.offer .container{ z-index:2; }
.offer-grid{
  display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(2.5rem,6vw,5.5rem); align-items:center;
}
.book-stage{ position:relative; display:grid; place-items:center; perspective:1100px; }
.book-glow{
  position:absolute; width:78%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, rgba(236,196,110,.4), rgba(236,196,110,0) 68%);
  filter:blur(14px);
  animation:breathe 6s ease-in-out infinite;
}
@keyframes breathe{ 0%,100%{ transform:scale(1); opacity:.85;} 50%{ transform:scale(1.08); opacity:1;} }
.book-tilt{
  width:min(340px, 76%); will-change:transform;
  transform-style:preserve-3d;
  animation:bookfloat 7s ease-in-out infinite;
}
@keyframes bookfloat{ 0%,100%{ translate:0 0; } 50%{ translate:0 -16px; } }
.book-tilt img{
  border-radius:12px;
  box-shadow:0 40px 90px -25px rgba(0,0,0,.75), 0 0 45px rgba(232,190,102,.3), 0 0 0 1px rgba(232,190,102,.25);
}
.offer-card{
  background:var(--night-card);
  border:1px solid var(--night-line);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.7);
  padding:clamp(1.8rem,3vw,2.8rem);
  color:var(--night-ink);
}
.offer-heading{ color:var(--night-ink); font-size:clamp(1.5rem,2.4vw,2rem); margin-bottom:1.4rem; }
.offer-list{ list-style:none; display:flex; flex-direction:column; gap:.85rem; margin-bottom:1.8rem; }
.offer-list li{ position:relative; padding-left:2rem; color:var(--night-soft); font-size:1.02rem; }
.offer-list li::before{
  content:"✦"; position:absolute; left:0; top:.1rem; color:var(--gold-bright); font-size:1.05rem;
}
.price-block{ display:flex; align-items:baseline; gap:1rem; margin-bottom:.6rem; }
.price-was{
  font-family:var(--serif); font-size:clamp(1.6rem,2.6vw,2.1rem); color:var(--night-soft);
  text-decoration:line-through; text-decoration-color:rgba(232,190,102,.75); text-decoration-thickness:3px;
}
.launch-note{
  margin-bottom:1.4rem; font-size:1.02rem; color:var(--night-soft);
}
.launch-note strong{
  color:var(--gold-bright);
  background:rgba(232,190,102,.14); border:1px solid rgba(232,190,102,.4);
  border-radius:999px; padding:.1rem .6rem;
}
.price{
  font-family:var(--serif); font-weight:600; font-size:clamp(3rem,5vw,4rem); line-height:1;
  color:var(--gold-bright); text-shadow:0 0 30px rgba(232,190,102,.4);
}
.price-note{ font-size:1.05rem; color:var(--night-soft); }
.reassure{ margin-top:1.1rem; text-align:center; font-size:.95rem; color:var(--night-soft); }

/* ═══ 8 · FAQ ═══ */
.faq-list{ display:flex; flex-direction:column; gap:1rem; }
.faq-item{
  background:var(--night-card); border:1px solid var(--night-line);
  border-radius:16px; color:var(--night-ink);
  transition:border-color .3s ease;
}
.faq-item[open]{ border-color:rgba(232,190,102,.55); }
.faq-item summary{
  cursor:pointer; list-style:none; padding:1.15rem 3.2rem 1.15rem 1.4rem;
  font-weight:700; font-size:1.08rem; position:relative;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{
  content:"+"; position:absolute; right:1.3rem; top:50%; transform:translateY(-50%);
  font-family:var(--serif); font-size:1.6rem; color:var(--gold-bright); transition:transform .3s ease;
}
.faq-item[open] summary::after{ transform:translateY(-50%) rotate(45deg); }
.faq-item p{ padding:0 1.4rem 1.3rem; color:var(--night-soft); }

/* ═══ FOOTER ═══ */
#site-footer{
  position:relative; padding:5rem clamp(1.2rem,4vw,3rem) 2.5rem;
  color:var(--night-ink);
  background:linear-gradient(180deg, rgba(9,12,36,0), rgba(6,8,26,.75) 30%, #05071B 100%);
}
.newsletter{
  display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
  gap:2rem; align-items:center;
  background:var(--night-card); border:1px solid var(--night-line);
  border-radius:var(--radius); padding:clamp(1.8rem,3vw,2.6rem);
  margin-bottom:3rem;
}
.newsletter h2{ font-size:clamp(1.5rem,2.4vw,2rem); color:var(--night-ink); margin-bottom:.6rem; }
.newsletter p{ color:var(--night-soft); font-size:1.02rem; }
.newsletter-form{ display:flex; gap:.8rem; flex-wrap:wrap; }
.newsletter-form input{
  flex:1 1 240px; min-width:0;
  font:inherit; color:var(--night-ink);
  background:rgba(255,252,244,.08); border:1px solid var(--night-line);
  border-radius:999px; padding:.95rem 1.4rem;
}
.newsletter-form input::placeholder{ color:rgba(244,236,219,.5); }
.newsletter-form input:focus-visible{ outline:2px solid var(--gold-bright); outline-offset:2px; }
.footer-links{ display:flex; flex-wrap:wrap; gap:2rem; justify-content:center; margin-bottom:2.4rem; }
.footer-links a{ color:var(--night-soft); text-decoration:none; font-weight:700; transition:color .3s; }
.footer-links a:hover{ color:var(--gold-bright); }
.disclaimer{
  max-width:900px; margin:0 auto 1.8rem; text-align:center;
  font-size:.95rem; line-height:1.7; color:rgba(244,236,219,.62);
  border-top:1px solid rgba(232,190,102,.18); padding-top:1.8rem;
}
.copyright{ text-align:center; font-size:.9rem; color:rgba(244,236,219,.45); }

/* ═══ RESPONSIVE (desktop-first; mobile pass to follow) ═══ */
@media (max-width:1080px){
  .hero-text{ margin-left:clamp(0px, 20vw, 260px); }
  .inside-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .i-card, .i-card:nth-child(4), .i-card:nth-child(5){ grid-column:span 1; }
  .i-card-photo{ grid-template-columns:1fr; }
  .i-photo{ max-height:240px; }
  .t-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:880px){
  .header-nav{ display:none; }
  .hero{ align-items:flex-start; padding-top:8.5rem; }
  .hero-text{ margin-left:0; max-width:560px; }
  .hero-kidney{ opacity:.4; right:-8vw; }
  .hero-clark{ width:clamp(170px, 30vw, 230px); }
  .wonder-grid, .clark-grid, .offer-grid{ grid-template-columns:1fr; }
  .clark-portrait{ max-width:380px; margin:0 auto; }
  .problem-cards{ grid-template-columns:1fr; }
  .t-grid{ grid-template-columns:1fr; }
  .newsletter{ grid-template-columns:1fr; }
  .book-stage{ margin-bottom:1rem; }
  #orb{ display:none; }
}

/* ═══ REDUCED MOTION ═══ */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
  .flow-dots, #particles, .scroll-hint span{ display:none; }
  .book-tilt, .book-glow, #stars2{ animation:none; }
  *{ transition-duration:.01ms !important; }
}