:root{--navy:#0b1a28;--navy2:#12293d;--navy3:#1d3a52;--paper:#f7f1e3;--paper2:#efe6d2;--card:#fbf7ec;--ink:#1a2430;--muted:#4f5862;--brass:#b8893a;--brass-d:#7a520e;--brass2:#d6ad5c;--max:70rem;
--serif:"Fraunces",Georgia,"Iowan Old Style","Times New Roman",serif;--sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:1.0625rem/1.7 var(--sans);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
[hidden]{display:none!important}
.wrap{max-width:var(--max);margin:0 auto;padding:0 1.5rem}
.narrow{max-width:46rem}
section{padding:5rem 0}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.12;letter-spacing:-.01em;margin:0}
h2{font-size:clamp(2rem,5vw,3.1rem);margin-bottom:1.25rem}
h3{font-size:1.35rem}
p{margin:0 0 1.1rem}
a{color:#1d5a85}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:#fff;color:var(--ink);padding:.5rem;z-index:99}
.kicker{font:600 .75rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--brass-d);margin:0 0 1rem}
.kicker.light{color:var(--brass2)}
.big{font:300 italic clamp(1.25rem,2.6vw,1.6rem)/1.45 var(--serif)}
.center{text-align:center;margin-top:3rem}
.section-head{margin-bottom:3rem}
.section-head .intro{max-width:44rem;color:var(--muted)}

/* buttons */
.btn{display:inline-block;padding:1rem 1.7rem;border-radius:999px;font:600 .95rem/1 var(--sans);letter-spacing:.01em;text-decoration:none;transition:transform .25s,background .25s,box-shadow .25s}
.btn.lg{padding:1.2rem 2.1rem;font-size:1.05rem}
.btn-sm{padding:.7rem 1.1rem;font-size:.85rem}
.btn.primary{background:linear-gradient(180deg,var(--brass2),var(--brass));color:#1b1205;box-shadow:0 8px 24px -8px rgba(184,137,58,.7)}
.btn.primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px -8px rgba(184,137,58,.9)}
.btn.ghost{border:1px solid rgba(247,241,227,.45);color:var(--paper)}
.btn.ghost:hover{background:rgba(247,241,227,.08)}
.btn.ghost-dark{border:1px solid var(--navy);color:var(--navy)}
:focus-visible{outline:3px solid #1d5a85;outline-offset:3px}
.hero :focus-visible,.learn :focus-visible,.author :focus-visible,.final :focus-visible,.buybar :focus-visible,.skip:focus-visible{outline-color:#7fc4ff}

/* hero */
.hero{position:relative;overflow:hidden;color:var(--paper);padding-bottom:7rem;background:radial-gradient(80rem 40rem at 75% 20%,#1d3a52 0%,transparent 60%),linear-gradient(180deg,#07121c,var(--navy) 55%,var(--navy2))}
.topbar{display:flex;justify-content:space-between;align-items:center;padding-top:1.5rem;padding-bottom:1.5rem}
.brand{font:400 1.2rem var(--serif);color:var(--paper);text-decoration:none;letter-spacing:.02em}
.hero-grid{display:grid;gap:3rem;align-items:center;padding-top:2rem}
.eyebrow{font:600 .75rem/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--brass2);margin:0 0 1.5rem}
h1{font-size:clamp(3rem,10vw,5.6rem);font-weight:300;line-height:1}
.h1-sub{display:block;margin-top:1.1rem;font:italic 300 clamp(1.15rem,2.6vw,1.5rem)/1.35 var(--serif);color:var(--brass2);letter-spacing:0}
.lead{font-size:1.2rem;max-width:34rem;margin:1.75rem 0 0;color:rgba(247,241,227,.88)}
.ctas{display:flex;flex-wrap:wrap;gap:.9rem;margin:2rem 0 1.25rem}
.small{font-size:.85rem;line-height:1.5;opacity:.75;max-width:34rem}

/* 3D book */
.book-stage{--w:min(62vw,320px);--t:30px;perspective:1600px;display:flex;flex-direction:column;align-items:center;padding:1rem 0 2rem}
.book{position:relative;width:var(--w);aspect-ratio:360/576;transform-style:preserve-3d;transform:rotateY(-24deg) rotateX(4deg);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.book-stage:hover .book{transform:rotateY(-12deg) rotateX(2deg)}
.book-front{position:absolute;inset:0;transform:translateZ(calc(var(--t)/2));border-radius:2px 4px 4px 2px;overflow:hidden;box-shadow:inset 3px 0 6px rgba(0,0,0,.25)}
.book-front img{width:100%;height:100%}
.book-front:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.35),rgba(255,255,255,.12) 2.5%,transparent 6%,transparent 90%,rgba(0,0,0,.18));pointer-events:none}
.book-spine{position:absolute;top:0;left:0;width:var(--t);height:100%;transform:translateX(calc(var(--t)/-2)) rotateY(-90deg);background:linear-gradient(90deg,#0a1520,#17324a 50%,#0a1520)}
.book-pages{position:absolute;top:3px;bottom:3px;left:calc(100% - var(--t)/2);width:calc(var(--t) - 4px);transform:rotateY(90deg);background:repeating-linear-gradient(90deg,#f1ead9 0 2px,#d9cfb8 2px 3px);box-shadow:inset 0 0 8px rgba(0,0,0,.25)}
.book-back{position:absolute;inset:0;transform:translateZ(calc(var(--t)/-2));background:#0a1520;border-radius:2px}
.book-shadow{width:var(--w);height:26px;margin-top:-4px;background:radial-gradient(ellipse at center,rgba(0,0,0,.6),transparent 70%);filter:blur(8px);transform:translateX(8%)}
@media (prefers-reduced-motion:no-preference){.book-stage .book{animation:bob 7s ease-in-out infinite}.book-stage:hover .book{animation-play-state:paused}}
@keyframes bob{50%{transform:rotateY(-20deg) rotateX(5deg) translateY(-8px)}}

/* hero background video */
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;pointer-events:none}
.hero-veil{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(7,18,28,.78) 0%,rgba(11,26,40,.55) 55%,rgba(11,26,40,.35) 100%),linear-gradient(180deg,rgba(7,18,28,.35),rgba(11,26,40,.15) 60%,rgba(11,26,40,.65))}
.hero>.wrap{position:relative;z-index:1}

/* paper cards with ink art */
.paper-card{margin:0;background:var(--card);border:1px solid #e3d8be;border-radius:6px;padding:.9rem;box-shadow:0 1px 0 #fff inset,0 24px 40px -28px rgba(11,26,40,.5)}
.paper-card img{width:100%;mix-blend-mode:multiply;border-radius:2px}
.paper-card video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;mix-blend-mode:multiply;border-radius:2px;background:#f4efe3}
.paper-card blockquote{margin:1.1rem .4rem .2rem;font:italic 300 1.15rem/1.5 var(--serif);color:var(--navy)}
.paper-card figcaption{margin:.4rem .4rem .3rem;font-size:.8rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}

/* problem */
.problem-grid{display:grid;gap:3rem;align-items:center}
.problem-grid>*{min-width:0}
.for-h{font-size:1.5rem;margin:5rem 0 1.5rem}
.checks{padding:0;margin:0;list-style:none;display:grid;gap:1rem}
.checks li{padding:1.25rem 1.25rem 1.25rem 3.25rem;position:relative;background:var(--card);border:1px solid #e3d8be;border-radius:6px}
.checks li:before{content:"";position:absolute;left:1.25rem;top:1.65rem;width:.8rem;height:.8rem;border-radius:50%;background:var(--brass)}

/* journey / timeline */
.journey{background:var(--paper2)}
.timeline{list-style:none;margin:0;padding:0 0 0 1.75rem;position:relative;display:grid;gap:3rem}
.timeline:before{content:"";position:absolute;left:0;top:.5rem;bottom:.5rem;width:1px;background:linear-gradient(var(--brass),rgba(184,137,58,.15))}
.timeline li{position:relative;display:grid;gap:1.25rem;align-items:center}
.timeline li:before{content:"";position:absolute;left:-1.75rem;top:.6rem;width:11px;height:11px;margin-left:-5px;border-radius:50%;background:var(--paper2);border:2px solid var(--brass)}
.num{font:300 italic 2.4rem/1 var(--serif);color:var(--brass-d);display:block;margin-bottom:.5rem}
.tl-text h3{font-size:1.7rem;margin-bottom:.6rem}
.tl-text p{color:#3b4650;margin:0}

/* learn */
.learn{background:linear-gradient(180deg,var(--navy),var(--navy2));color:var(--paper)}
.benefits{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:rgba(214,173,92,.25);border:1px solid rgba(214,173,92,.25)}
.benefits li{background:var(--navy);padding:2rem 1.75rem}
.benefits h3{color:var(--brass2);margin-bottom:.7rem}
.benefits p{margin:0;color:rgba(247,241,227,.82)}

/* excerpt */
.excerpt{margin:0}
.excerpt blockquote{margin:0;padding:3rem 2rem 2rem;background:var(--card);border:1px solid #e3d8be;border-radius:4px;font:300 1.2rem/1.75 var(--serif);box-shadow:0 30px 50px -35px rgba(11,26,40,.55)}
.excerpt blockquote p:first-child:first-letter{float:left;font:400 4.2rem/.8 var(--serif);color:var(--brass-d);padding:.35rem .6rem 0 0}
.excerpt figcaption{margin-top:1rem;color:var(--muted);font-size:.9rem;text-align:center}

/* author */
.author{background:var(--navy);color:var(--paper)}
.author-grid{display:grid;gap:3rem;align-items:center}
.author cite{font-style:italic}
.author p{color:rgba(247,241,227,.85)}

/* formats */
.formats{background:var(--paper2)}
.format-grid{display:grid;gap:1.5rem;max-width:52rem}
.format{background:var(--card);border:1px solid #e3d8be;border-radius:8px;padding:2.25rem}
.tag{font:600 .7rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--brass-d);margin-bottom:1rem}
.muted-tag{color:var(--muted)}
.price{font:300 3rem/1 var(--serif);margin:.6rem 0 1.25rem;color:var(--navy)}
.price.soft{font-size:1.8rem;font-style:italic;color:var(--muted)}
.format ul{padding-left:1.1rem;margin:0 0 1.75rem;color:#3b4650}
.format li{margin:.4rem 0}

/* faq */
details{border-bottom:1px solid #d9cdb0;padding:1.2rem 0}
summary{cursor:pointer;font:400 1.25rem/1.35 var(--serif);list-style:none;display:flex;justify-content:space-between;gap:1rem}
summary::-webkit-details-marker{display:none}
summary:after{content:"+";color:var(--brass-d);font-size:1.6rem;line-height:1;transition:transform .3s}
details[open] summary:after{transform:rotate(45deg)}
details p{margin:.9rem 0 0;color:#3b4650}

/* final */
.final{text-align:center;background:radial-gradient(60rem 24rem at 50% 0,#1d3a52,transparent 70%),var(--navy);color:var(--paper);padding:7rem 0}
.final h2{font-weight:300}
.final .big{color:var(--brass2);margin-bottom:2.5rem}
.final .small{margin:1.75rem auto 0}
.foot{background:#060f17;color:#a3adb7;font-size:.85rem;padding:1.75rem 0}

/* sticky mobile buy bar */
.buybar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem calc(.75rem + env(safe-area-inset-bottom));background:rgba(11,26,40,.96);color:var(--paper);border-top:1px solid rgba(214,173,92,.4);transform:translateY(110%);visibility:hidden;transition:transform .35s,visibility .35s}
.buybar.show{transform:none;visibility:visible}
.buybar strong{display:block;font:400 1rem/1.2 var(--serif)}
.buybar span{font-size:.8rem;opacity:.75}
@media (max-width:799px){.foot{padding-bottom:calc(6rem + env(safe-area-inset-bottom))}}
@media (min-width:800px){.buybar{display:none}}

/* scroll reveal (only when JS has run) */
.js .reveal{transform:translateY(22px);transition:transform .8s ease var(--d,0s)}
.js .reveal.in{opacity:1;transform:none}

/* mobile hero: compact book beside the title, CTA above the fold */
@media (max-width:899px){
  .topbar{padding-top:1rem;padding-bottom:.5rem}
  .hero{padding-bottom:5rem}
  .hero-grid{gap:0;grid-template-columns:minmax(0,1fr) 160px;grid-template-areas:"eyebrow book" "title book" "lead lead" "ctas ctas" "small small";column-gap:1rem;padding-top:.5rem;align-items:start}
  .hero-text{display:contents}
  .eyebrow{grid-area:eyebrow;font-size:.65rem;letter-spacing:.14em;margin:0 0 .6rem}
  h1{grid-area:title;font-size:clamp(2rem,9.5vw,2.6rem)}
  .h1-sub{font-size:.95rem;margin-top:.6rem}
  .book-stage{grid-area:book;--w:150px;--t:18px;padding:.25rem 0 .75rem;align-self:start}
  .book-shadow{height:16px}
  .lead{grid-area:lead;font-size:1.05rem;margin-top:.75rem}
  .ctas{grid-area:ctas;margin:1.25rem 0 1rem}
  .ctas .primary{flex:1 1 100%;text-align:center}
  .hero .small{grid-area:small}
}
@media (min-width:700px){
  .checks,.benefits{grid-template-columns:repeat(2,1fr)}
  .format-grid{grid-template-columns:1fr 1fr}
}
@media (min-width:900px){
  .hero-grid{grid-template-columns:1.25fr 1fr}
  .problem-grid,.author-grid{grid-template-columns:1.2fr 1fr}
  .benefits{grid-template-columns:repeat(3,1fr)}
  .checks{grid-template-columns:repeat(4,1fr)}
  .book-stage{--w:320px}
  .timeline{padding-left:0}
  .timeline:before{left:50%}
  .timeline li{grid-template-columns:1fr 1fr;gap:5rem}
  .timeline li:before{left:50%;top:50%}
  .timeline li:nth-child(even) .tl-text{order:2}
  .timeline li:nth-child(odd) .tl-text{text-align:right}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation:none!important;transition:none!important}
  .js .reveal{opacity:1;transform:none}
}
/* intro video (from Marlo) */

.intro-grid{display:grid;gap:3rem;align-items:center}
.intro-grid>*{min-width:0}
.intro-player{border-radius:2px;background:#0b1a28}
.signature{font:italic 400 1.6rem/1 var(--serif);color:var(--navy);margin:1.5rem 0 1.75rem}
.transcript{margin-top:1rem;font-size:.95rem;color:var(--muted)}
.transcript summary{cursor:pointer;font:600 .85rem/1.4 var(--sans);letter-spacing:.04em;color:var(--navy)}
.transcript p{margin:.75rem 0 0;line-height:1.7}
@media (min-width:900px){.intro-grid{grid-template-columns:1.15fr 1fr}}
/* closing buy card (reuses .format) */
.final .buy-card{max-width:30rem;margin:0 auto;text-align:left;color:var(--ink)}
.final .buy-card .btn{display:block;text-align:center}