*{margin:0;padding:0;box-sizing:border-box}
:root{--red:#CF3B30;--red-hot:#E14A3E;--gold:#D6A14A;--dark:#0C0C0C;--surface:#151313;--surface-warm:#1d1713;--text:#f4efe6;--text-soft:#d8cabb;--text-muted:#c0b19f;--green:#138a3d;--border:rgba(244,239,230,0.18)}
html{scroll-behavior:smooth}
body{background:var(--dark);color:var(--text);font-family:'Atkinson Hyperlegible','Merriweather',Georgia,serif;overflow-x:hidden}
nav{position:fixed;top:0;left:0;right:0;z-index:999;display:flex;align-items:center;
  justify-content:space-between;padding:0 3rem;height:64px;
  background:rgba(0,0,0,0.82);backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,0.05)}
.logo{display:flex;flex-direction:row;align-items:center;gap:0.6rem;text-decoration:none}
.logo-text{display:flex;flex-direction:column;justify-content:center;gap:0.1rem}
.logo-mark{height:40px;width:40px;border-radius:5px;display:block;flex-shrink:0}
.logo-big{font-family:'Bebas Neue',sans-serif;font-size:1.25rem;letter-spacing:0.1em;color:#fff;line-height:1}
.logo-small{font-family:'Oswald',sans-serif;font-size:0.52rem;font-weight:300;
  letter-spacing:0.28em;text-transform:uppercase;color:rgba(255,255,255,0.32);line-height:1}
.nav-right{display:flex;align-items:center;gap:1.75rem}
.nav-link{font-family:'Oswald',sans-serif;font-size:0.75rem;font-weight:400;
  letter-spacing:0.12em;text-transform:uppercase;color:rgba(255,240,218,0.78);
  text-decoration:none;transition:color .2s;cursor:pointer;
  background:none;border:none;padding:0;line-height:inherit}
.nav-link:hover{color:#FFF5E6}
.nav-cta{font-family:'Oswald',sans-serif;font-size:0.75rem;font-weight:600;
  letter-spacing:0.1em;text-transform:uppercase;color:#fff;background:var(--red);
  padding:0.5rem 1.25rem;text-decoration:none;transition:background .2s}
.nav-cta:hover{background:var(--red-hot)}
.page{display:none}.page.active{display:block}
.hero{position:relative;height:100vh;min-height:640px;
  display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
.hero-img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center 30%;
  animation:slowzoom 24s ease-in-out infinite alternate}
@keyframes slowzoom{from{transform:scale(1)}to{transform:scale(1.06)}}
.snow-layer{position:absolute;inset:0;pointer-events:none;z-index:2}
.flake{position:absolute;top:-12px;animation:fall linear infinite;user-select:none;color:rgba(255,255,255,0.6)}
@keyframes fall{0%{transform:translateY(-12px) rotate(0deg);opacity:0}10%{opacity:1}85%{opacity:0.5}100%{transform:translateY(110vh) rotate(400deg);opacity:0}}
.h-grad-bot{position:absolute;bottom:0;left:0;right:0;height:72%;
  background:linear-gradient(to top,rgba(0,0,0,0.96) 0%,rgba(0,0,0,0.55) 50%,transparent 100%);z-index:3}
.h-grad-top{position:absolute;top:0;left:0;right:0;height:100px;
  background:linear-gradient(to bottom,rgba(0,0,0,0.6) 0%,transparent 100%);z-index:3}
.h-grad-left{position:absolute;left:0;top:0;bottom:0;width:50%;
  background:linear-gradient(to right,rgba(0,0,0,0.5) 0%,transparent 100%);z-index:3}
.hero-inner{position:relative;z-index:10;width:100%;
  display:grid;grid-template-columns:1fr auto;align-items:flex-end;padding:0 4rem 5rem;gap:2.5rem}
.hero-tag{display:inline-flex;align-items:center;gap:0.75rem;margin-bottom:1rem}
.tag-line{width:30px;height:2px;background:var(--red)}
.tag-text{font-family:'Oswald',sans-serif;font-size:0.7rem;font-weight:500;
  letter-spacing:0.3em;text-transform:uppercase;color:#E74C3C}
.h-series{font-family:'Oswald',sans-serif;font-size:0.72rem;font-weight:300;
  letter-spacing:0.22em;text-transform:uppercase;color:rgba(255,255,255,0.35);margin-bottom:0.15rem;display:block}
h1.h-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(4rem,10vw,7.5rem);
  line-height:0.88;letter-spacing:0.04em;color:#fff;margin-bottom:0.2rem;
  text-shadow:0 4px 50px rgba(0,0,0,0.9);animation:fadeUp 0.9s cubic-bezier(0.16,1,0.3,1) both}
.h-book-sub{font-family:'Bebas Neue',sans-serif;font-size:clamp(1.5rem,3.2vw,2.6rem);
  letter-spacing:0.06em;color:var(--gold);margin-bottom:0.5rem;display:block;
  text-shadow:0 2px 20px rgba(0,0,0,0.8);animation:fadeUp 0.9s 0.08s cubic-bezier(0.16,1,0.3,1) both}
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.h-tagline{font-family:'Oswald',sans-serif;font-size:clamp(0.72rem,1.4vw,0.92rem);
  font-weight:700;letter-spacing:0.18em;text-transform:uppercase;
  color:#fff;margin-bottom:1.5rem;
  animation:fadeUp 0.9s 0.16s cubic-bezier(0.16,1,0.3,1) both}
.h-hooks{display:flex;flex-direction:column;gap:0.42rem;margin-bottom:2rem;
  animation:fadeUp 0.9s 0.22s cubic-bezier(0.16,1,0.3,1) both}
.hook{font-family:'Merriweather',serif;font-size:0.8rem;font-weight:300;
  font-style:italic;color:rgba(255,255,255,0.72);display:flex;align-items:center;gap:0.55rem}
.hook::before{content:'';width:4px;height:4px;background:var(--gold);border-radius:50%;flex-shrink:0}
.h-actions{display:flex;gap:0.9rem;align-items:center;flex-wrap:wrap;
  animation:fadeUp 0.9s 0.3s cubic-bezier(0.16,1,0.3,1) both}
.hero-cover-wrap{animation:fadeUp 0.9s 0.18s cubic-bezier(0.16,1,0.3,1) both;
  align-self:flex-end;padding-bottom:0.25rem}
.book3d{position:relative;display:inline-block;cursor:pointer;
  transition:transform .38s ease;filter:drop-shadow(0 20px 40px rgba(0,0,0,0.8))}
.book3d:hover{transform:translateY(-10px) rotate(-1.5deg)}
.book-spine{position:absolute;left:0;top:4px;bottom:-4px;width:26px;
  background:linear-gradient(180deg,#7a1515,#3d0808);border-radius:2px 0 0 2px;z-index:1;
  box-shadow:-4px 4px 18px rgba(0,0,0,0.75)}
.book-cover{display:block;width:210px;height:auto;border-radius:0 4px 4px 0;
  box-shadow:8px 10px 30px rgba(0,0,0,0.85),18px 18px 55px rgba(0,0,0,0.5);
  position:relative;z-index:2;margin-left:18px}
.book-glow{position:absolute;inset:-15px;
  background:radial-gradient(ellipse,rgba(192,57,43,0.18) 0%,transparent 68%);
  pointer-events:none;z-index:0}
.btn-red{font-family:'Oswald',sans-serif;font-size:0.88rem;font-weight:700;
  letter-spacing:0.12em;text-transform:uppercase;color:#fff;background:var(--red);
  border:none;padding:0.95rem 2.2rem;text-decoration:none;display:inline-block;
  cursor:pointer;transition:background .2s,transform .15s}
.btn-red:hover{background:var(--red-hot);transform:translateY(-2px)}
.btn-ghost{font-family:'Oswald',sans-serif;font-size:0.88rem;font-weight:500;
  letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,255,255,0.75);
  background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.18);
  padding:0.95rem 1.7rem;text-decoration:none;display:inline-flex;align-items:center;
  gap:0.55rem;cursor:pointer;transition:background .2s,border-color .2s}
.btn-ghost:hover{background:rgba(255,255,255,0.13);border-color:rgba(255,255,255,0.38)}
.btn-spotify{font-family:'Oswald',sans-serif;font-size:0.88rem;font-weight:600;
  letter-spacing:0.1em;text-transform:uppercase;color:#fff;background:#1DB954;
  border:none;padding:0.95rem 1.7rem;text-decoration:none;display:inline-flex;align-items:center;
  gap:0.55rem;cursor:pointer;transition:background .2s,transform .15s}
.btn-spotify:hover{background:#1ed760;transform:translateY(-2px)}
.play-tri{width:0;height:0;border-style:solid;border-width:5px 0 5px 9px;
  border-color:transparent transparent transparent rgba(255,255,255,0.8);flex-shrink:0}
.hero-trust-row{font-family:'Oswald',sans-serif;font-size:0.7rem;font-weight:300;
  letter-spacing:0.15em;color:rgba(255,255,255,0.62);margin-top:0.8rem;
  text-transform:uppercase}
.scroll-hint{position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);
  z-index:10;display:flex;flex-direction:column;align-items:center;gap:0.35rem;
  animation:bob 2.2s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(7px)}}
.scroll-hint span{font-family:'Oswald',sans-serif;font-size:0.56rem;letter-spacing:0.25em;
  text-transform:uppercase;color:rgba(255,255,255,0.22)}
.sc-arrow{width:17px;height:17px;border-right:1.5px solid rgba(255,255,255,0.2);
  border-bottom:1.5px solid rgba(255,255,255,0.2);transform:rotate(45deg)}
.stats-band{background:#111010;border-top:1px solid rgba(255,255,255,0.06);border-bottom:1px solid rgba(255,255,255,0.06);padding:1.2rem 4rem;
  display:flex;justify-content:center;gap:3.5rem;align-items:center;overflow-x:auto}
.stat{text-align:center;white-space:nowrap}
.stat-n{font-family:'Bebas Neue',sans-serif;font-size:2rem;color:var(--gold);line-height:1;display:block}
.stat-l{font-family:'Oswald',sans-serif;font-size:0.56rem;font-weight:400;
  letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.62)}
.stat-div{width:1px;height:34px;background:rgba(255,255,255,0.22);flex-shrink:0}
.showcase{padding:7rem 4rem;max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:auto 1fr;gap:5rem;align-items:center}
.sc-book3d{position:relative;display:inline-block;cursor:pointer;
  transition:transform .4s ease;filter:drop-shadow(0 24px 50px rgba(0,0,0,0.8))}
.sc-book3d:hover{transform:translateY(-12px) rotate(1.5deg)}
.sc-spine{position:absolute;left:0;top:5px;bottom:-5px;width:32px;
  background:linear-gradient(180deg,#7a1515,#3d0808);border-radius:3px 0 0 3px;z-index:1;
  box-shadow:-5px 5px 22px rgba(0,0,0,0.8)}
.sc-cover{display:block;width:300px;height:auto;border-radius:0 5px 5px 0;
  box-shadow:10px 12px 40px rgba(0,0,0,0.85),24px 24px 70px rgba(0,0,0,0.5);
  position:relative;z-index:2;margin-left:22px}
.sc-glow{position:absolute;bottom:-28px;left:10px;right:0;height:55px;
  background:radial-gradient(ellipse at 50% 0%,rgba(192,57,43,0.28) 0%,transparent 70%);pointer-events:none}
.sec-label{font-family:'Oswald',sans-serif;font-size:0.66rem;font-weight:500;
  letter-spacing:0.3em;text-transform:uppercase;color:#E74C3C;margin-bottom:1rem}
.showcase h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(2rem,4vw,3.4rem);
  letter-spacing:0.04em;color:#fff;line-height:0.94;margin-bottom:0.2rem}
.sc-book-sub{font-family:'Bebas Neue',sans-serif;font-size:clamp(1.1rem,2.2vw,1.8rem);
  letter-spacing:0.06em;color:var(--gold);margin-bottom:1.2rem;display:block}
.showcase p{font-family:'Merriweather',serif;font-size:0.95rem;font-weight:300;
  line-height:1.85;color:rgba(255,255,255,0.78);margin-bottom:1.1rem}
.showcase p strong{color:rgba(255,255,255,0.85);font-weight:400}
.feat-list{list-style:none;display:flex;flex-direction:column;gap:0.6rem;margin:1.5rem 0 2rem}
.feat-list li{display:flex;align-items:flex-start;gap:0.7rem;
  font-family:'Oswald',sans-serif;font-size:0.8rem;font-weight:300;
  letter-spacing:0.04em;color:rgba(255,255,255,0.75);line-height:1.4}
.feat-list li::before{content:'';width:5px;height:5px;background:var(--red);
  border-radius:50%;flex-shrink:0;margin-top:0.38em}
.sc-ctas{display:flex;gap:0.9rem;flex-wrap:wrap}
.series-section{padding:5rem 4rem;border-top:1px solid rgba(255,255,255,0.05)}
.series-header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:2.5rem}
.series-header h2{font-family:'Bebas Neue',sans-serif;font-size:2.5rem;letter-spacing:0.05em;color:#fff}
.series-header p{font-family:'Oswald',sans-serif;font-size:0.68rem;font-weight:300;
  letter-spacing:0.15em;text-transform:uppercase;color:rgba(255,255,255,0.28)}
.books-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1.2rem}
.book-card{position:relative;cursor:pointer;display:block;transition:transform .32s ease}
.book-card:hover{transform:translateY(-8px)}
.book-card-inner{position:relative;display:flex}
.bc-spine{width:18px;flex-shrink:0;border-radius:3px 0 0 3px;
  background:linear-gradient(180deg,#5a1010,#2a0606);
  box-shadow:-3px 3px 12px rgba(0,0,0,0.7);position:relative;z-index:1;margin-top:3px;margin-bottom:-3px}
.bc-img{display:block;width:100%;height:auto;border-radius:0 4px 4px 0;position:relative;z-index:2;
  box-shadow:5px 7px 22px rgba(0,0,0,0.8),12px 12px 35px rgba(0,0,0,0.5)}
.book-card.coming-soon .bc-img{filter:grayscale(0.25) brightness(0.78)}
.book-card-label{margin-top:0.85rem;padding-left:20px}
.bc-num{font-family:'Oswald',sans-serif;font-size:0.52rem;font-weight:300;
  letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,255,255,0.22);display:block;margin-bottom:0.2rem}
.bc-name{font-family:'Bebas Neue',sans-serif;font-size:1rem;letter-spacing:0.05em;color:#fff;display:block;margin-bottom:0.3rem}
.bc-status{font-family:'Oswald',sans-serif;font-size:0.48rem;font-weight:500;
  letter-spacing:0.15em;text-transform:uppercase;display:inline-block;padding:0.18rem 0.45rem}
.status-live{background:var(--red);color:#fff}
.status-soon{background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.3);border:1px solid rgba(255,255,255,0.1)}
.extract-section{padding:6rem 4rem;max-width:860px;margin:0 auto}
.big-quote{font-family:'Merriweather',serif;font-size:clamp(1.2rem,2.6vw,1.72rem);
  font-weight:300;line-height:1.78;color:rgba(255,255,255,0.8)}
.big-quote strong{font-weight:400;color:#fff}
.big-quote em{font-style:italic;color:rgba(255,255,255,0.45)}
.extract-ctas{margin-top:2.5rem;display:flex;gap:1rem;flex-wrap:wrap}
.player-section{background:#0e0e0e;border-top:1px solid rgba(255,255,255,0.05);padding:5rem 4rem}
.player-head{display:flex;align-items:flex-end;justify-content:space-between;
  margin-bottom:2rem;flex-wrap:wrap;gap:1.5rem}
.player-head h2{font-family:'Bebas Neue',sans-serif;font-size:2.4rem;letter-spacing:0.05em;color:#fff;margin-bottom:0.2rem}
.player-head p{font-family:'Oswald',sans-serif;font-size:0.68rem;font-weight:300;
  letter-spacing:0.15em;text-transform:uppercase;color:rgba(255,255,255,0.55)}
.free-badge-strip{display:flex;align-items:center;gap:1rem;margin-bottom:2rem;
  padding:1rem 1.5rem;background:rgba(192,57,43,0.1);
  border:1px solid rgba(192,57,43,0.22);border-left:3px solid var(--red)}
.free-badge{font-family:'Bebas Neue',sans-serif;font-size:1.1rem;letter-spacing:0.08em;color:var(--red);flex-shrink:0}
.free-text{font-family:'Oswald',sans-serif;font-size:0.78rem;font-weight:300;
  color:rgba(255,255,255,0.78);line-height:1.4}
.free-text strong{color:rgba(255,255,255,0.85);font-weight:500}
.player-body{display:grid;grid-template-columns:1fr 285px;gap:2.5rem;align-items:start}
.np-lbl{font-family:'Oswald',sans-serif;font-size:0.6rem;font-weight:500;
  letter-spacing:0.25em;text-transform:uppercase;color:var(--red);margin-bottom:0.4rem}
.np-ttl{font-family:'Oswald',sans-serif;font-size:1.2rem;font-weight:400;
  color:#fff;margin-bottom:0.3rem;line-height:1.3}
.np-meta{font-family:'Oswald',sans-serif;font-size:0.65rem;font-weight:300;
  color:rgba(255,255,255,0.3);letter-spacing:0.08em;margin-bottom:1.5rem}
.waveform-wrap{position:relative;height:64px;margin-bottom:0.9rem;
  background:rgba(255,255,255,0.03);border-radius:3px;overflow:hidden;cursor:pointer}
#waveCanvas{display:block;width:100%;height:64px}
.scrub-wrap{position:relative;height:4px;background:rgba(255,255,255,0.08);
  margin-bottom:0.8rem;cursor:pointer;border-radius:4px}
.scrub-fill{height:100%;background:var(--red);border-radius:4px;width:0%;position:relative;transition:none}
.scrub-fill::after{content:'';position:absolute;right:-6px;top:50%;
  transform:translateY(-50%);width:12px;height:12px;border-radius:50%;
  background:#fff;box-shadow:0 0 8px rgba(0,0,0,0.6)}
.t-row{display:flex;justify-content:space-between;margin-bottom:1.4rem}
.t-lbl{font-family:'Oswald',sans-serif;font-size:0.72rem;font-weight:300;
  color:rgba(255,255,255,0.3);letter-spacing:0.05em}
.ctrls{display:flex;align-items:center;gap:0.7rem;flex-wrap:wrap}
.ctrl{font-family:'Oswald',sans-serif;font-size:0.66rem;font-weight:500;
  letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,255,255,0.42);
  background:rgba(255,255,255,0.06);border:none;padding:0.48rem 0.85rem;
  cursor:pointer;transition:background .15s,color .15s;border-radius:2px}
.ctrl:hover{background:rgba(255,255,255,0.12);color:#fff}
.ctrl-play{width:56px;height:56px;border-radius:50%;background:var(--red);
  border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .2s,transform .15s;flex-shrink:0}
.ctrl-play:hover{background:var(--red-hot);transform:scale(1.06)}
.p-tri{width:0;height:0;border-style:solid;border-width:9px 0 9px 16px;
  border-color:transparent transparent transparent #fff;margin-left:3px}
.p-pause{display:flex;gap:4px}.p-bar{width:4px;height:17px;background:#fff;border-radius:2px}
.vol-row{display:flex;align-items:center;gap:0.7rem;margin-top:1.2rem}
.vol-icon{font-size:0.85rem;color:rgba(255,255,255,0.3)}
input[type=range].vol-slider{flex:1;height:3px;-webkit-appearance:none;
  background:rgba(255,255,255,0.12);border-radius:3px;outline:none;cursor:pointer}
input[type=range].vol-slider::-webkit-slider-thumb{-webkit-appearance:none;
  width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,0.6);cursor:pointer}
.ch-lbl{font-family:'Oswald',sans-serif;font-size:0.6rem;font-weight:500;
  letter-spacing:0.25em;text-transform:uppercase;color:rgba(255,255,255,0.2);margin-bottom:0.7rem}
.ch-scroll{max-height:420px;overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.07) transparent}
.ch-item{display:flex;align-items:center;gap:0.7rem;padding:0.65rem 0.7rem;
  cursor:pointer;border-radius:3px;transition:background .14s;
  border-bottom:1px solid rgba(255,255,255,0.03)}
.ch-item:hover{background:rgba(255,255,255,0.05)}
.ch-item.active{background:rgba(192,57,43,0.14);border-left:2px solid var(--red);padding-left:calc(0.7rem - 2px)}
.ch-item.active .ch-name{color:#fff}
.ch-item.locked:hover{background:transparent;cursor:default}
.ch-n{font-family:'Bebas Neue',sans-serif;font-size:0.88rem;
  color:rgba(255,255,255,0.17);width:24px;flex-shrink:0;text-align:right}
.ch-item.active .ch-n{color:var(--red)}
.ch-name{font-family:'Oswald',sans-serif;font-size:0.75rem;font-weight:300;
  color:rgba(255,255,255,0.68);flex:1;line-height:1.32}
.ch-dur{font-family:'Oswald',sans-serif;font-size:0.58rem;font-weight:300;
  color:rgba(255,255,255,0.18);flex-shrink:0}
.ch-lock{font-size:0.65rem;color:rgba(255,255,255,0.2);flex-shrink:0;margin-left:auto}
.ch-free-badge{font-family:'Oswald',sans-serif;font-size:0.42rem;font-weight:600;
  letter-spacing:0.1em;text-transform:uppercase;background:rgba(192,57,43,0.3);
  color:var(--red);padding:0.15rem 0.4rem;flex-shrink:0;border:1px solid rgba(192,57,43,0.4)}
.gate-overlay{position:fixed;inset:0;z-index:9000;
  background:rgba(0,0,0,0.88);backdrop-filter:blur(8px);
  display:none;align-items:center;justify-content:center}
.gate-overlay.show{display:flex}
.gate-box{background:#181818;border:1px solid rgba(255,255,255,0.1);
  padding:3rem;max-width:480px;width:90%;text-align:center;position:relative}
.gate-box::before{content:'';position:absolute;top:0;left:0;right:0;
  height:3px;background:linear-gradient(90deg,transparent,var(--red),transparent)}
.gate-icon{font-size:2.5rem;margin-bottom:1rem}
.gate-box h3{font-family:'Bebas Neue',sans-serif;font-size:2rem;letter-spacing:0.05em;
  color:#fff;margin-bottom:0.5rem}
.gate-box p{font-family:'Oswald',sans-serif;font-size:0.85rem;font-weight:300;
  color:rgba(255,255,255,0.55);line-height:1.6;margin-bottom:2rem}
.gate-box p strong{color:rgba(255,255,255,0.85);font-weight:500}
.gate-input{width:100%;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);
  padding:0.85rem 1rem;font-family:'Oswald',sans-serif;font-size:0.9rem;font-weight:300;
  color:#fff;margin-bottom:0.75rem;outline:none;letter-spacing:0.03em}
.gate-input:focus{border-color:var(--red)}
.gate-input::placeholder{color:rgba(255,255,255,0.25)}
.gate-submit{width:100%;font-family:'Oswald',sans-serif;font-size:0.9rem;font-weight:700;
  letter-spacing:0.15em;text-transform:uppercase;color:#fff;background:var(--red);
  border:none;padding:1rem;cursor:pointer;transition:background .2s;margin-bottom:1rem}
.gate-submit:hover{background:var(--red-hot)}
.gate-close-btn{font-family:'Oswald',sans-serif;font-size:1.1rem;font-weight:500;
  letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.55);
  background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.15);
  padding:0.85rem 2rem;cursor:pointer;display:block;width:100%;margin-top:0.75rem;
  transition:background .2s,color .2s}
.gate-close-btn:hover{background:rgba(255,255,255,0.12);color:#fff}
.gate-what{font-family:'Merriweather',serif;font-size:0.72rem;font-style:italic;
  color:rgba(255,255,255,0.25);margin-top:1.25rem;line-height:1.5}
.gate-divider{display:flex;align-items:center;gap:0.75rem;margin:0.75rem 0;color:rgba(255,255,255,0.18);font-family:'Oswald',sans-serif;font-size:0.65rem;letter-spacing:0.12em;text-transform:uppercase}
.gate-divider::before,.gate-divider::after{content:'';flex:1;height:1px;background:rgba(255,255,255,0.1)}
.gate-spotify-direct{display:flex;align-items:center;justify-content:center;gap:0.55rem;width:100%;font-family:'Oswald',sans-serif;font-size:0.82rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;color:#1DB954;background:rgba(29,185,84,0.08);border:1px solid rgba(29,185,84,0.25);padding:0.85rem 1rem;text-decoration:none;margin-bottom:0.75rem;transition:background .2s,border-color .2s}
.gate-spotify-direct:hover{background:rgba(29,185,84,0.16);border-color:rgba(29,185,84,0.5)}
.also-section{border-top:1px solid rgba(255,255,255,0.05);
  padding:3.5rem 4rem;background:rgba(192,57,43,0.04)}
.also-lbl{font-family:'Oswald',sans-serif;font-size:0.66rem;font-weight:500;
  letter-spacing:0.3em;text-transform:uppercase;color:rgba(255,255,255,0.24);
  margin-bottom:1.75rem;text-align:center}
.also-row{display:flex;gap:0.9rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.5rem}
.also-book{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);
  padding:0.9rem 1.1rem;text-align:center;min-width:100px;
  transition:border-color .2s,background .2s;cursor:pointer}
.also-book:hover{border-color:rgba(255,255,255,0.2);background:rgba(255,255,255,0.06)}
.also-book.here{border-color:var(--red);background:rgba(192,57,43,0.1)}
.also-num{font-family:'Oswald',sans-serif;font-size:0.5rem;font-weight:300;
  letter-spacing:0.15em;text-transform:uppercase;color:rgba(255,255,255,0.2);display:block;margin-bottom:0.28rem}
.also-name{font-family:'Bebas Neue',sans-serif;font-size:1.2rem;letter-spacing:0.04em;color:#fff;display:block;margin-bottom:0.32rem}
.also-status{font-family:'Oswald',sans-serif;font-size:0.48rem;font-weight:400;
  letter-spacing:0.12em;text-transform:uppercase;color:rgba(255,255,255,0.22);display:block}
.also-status.live{color:var(--red)}
.also-ctas{display:flex;gap:1rem;justify-content:center}
footer{padding:2.5rem 4rem;border-top:1px solid rgba(255,255,255,0.04);
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
footer p{font-family:'Oswald',sans-serif;font-size:0.62rem;font-weight:300;
  letter-spacing:0.1em;color:rgba(255,255,255,0.18);text-transform:uppercase}
.detail-hero{position:relative;min-height:70vh;display:flex;align-items:flex-end;overflow:hidden}
.detail-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%}
.detail-grad{position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,0.96) 0%,rgba(0,0,0,0.88) 45%,rgba(0,0,0,0.62) 72%,rgba(0,0,0,0.32) 100%);z-index:1}
.detail-inner{position:relative;z-index:2;width:100%;
  display:grid;grid-template-columns:auto 1fr;gap:4rem;align-items:flex-end;padding:4rem}
.detail-book3d{position:relative;display:inline-block;filter:drop-shadow(0 20px 45px rgba(0,0,0,0.9))}
.db-spine{position:absolute;left:0;top:4px;bottom:-4px;width:28px;
  background:linear-gradient(180deg,#7a1515,#3d0808);border-radius:3px 0 0 3px;z-index:1;
  box-shadow:-4px 4px 16px rgba(0,0,0,0.8)}
.db-cover{display:block;width:260px;height:auto;border-radius:0 5px 5px 0;
  box-shadow:9px 11px 36px rgba(0,0,0,0.9);position:relative;z-index:2;margin-left:20px}
.detail-text h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.8rem,6vw,5rem);
  line-height:0.9;color:#fff;margin-bottom:0.2rem}
.detail-text .d-sub{font-family:'Bebas Neue',sans-serif;font-size:clamp(1.1rem,2.2vw,1.8rem);
  letter-spacing:0.06em;color:var(--gold);margin-bottom:0.6rem;display:block}
.detail-text .d-tagline{font-family:'Oswald',sans-serif;font-size:0.75rem;font-weight:400;
  letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,255,255,0.4);margin-bottom:0.5rem}
.detail-text .d-meta{font-family:'Oswald',sans-serif;font-size:0.66rem;font-weight:300;
  letter-spacing:0.15em;text-transform:uppercase;color:rgba(255,255,255,0.26);margin-bottom:0.9rem}
.d-hooks{display:flex;flex-direction:column;gap:0.42rem;margin-bottom:1.4rem}
.d-hook{font-family:'Merriweather',serif;font-size:0.85rem;font-weight:300;
  font-style:italic;color:rgba(255,255,255,0.72);display:flex;align-items:center;gap:0.55rem}
.d-hook::before{content:'';width:4px;height:4px;background:var(--gold);border-radius:50%;flex-shrink:0}
.d-trust{font-family:'Oswald',sans-serif;font-size:0.7rem;font-weight:300;
  letter-spacing:0.14em;color:rgba(255,255,255,0.55);margin-bottom:1.6rem;text-transform:uppercase}
.d-ctas{display:flex;gap:0.9rem;flex-wrap:wrap}

/* =============================================
   READING MATTERS — HOME TEASER
   ============================================= */
.reading-teaser{
  position:relative;padding:5rem 4rem 6rem;
  border-top:1px solid rgba(255,255,255,0.05);
  overflow:hidden;
  background:linear-gradient(135deg,rgba(12,8,8,1) 0%,rgba(20,8,8,1) 60%,rgba(12,4,4,1) 100%)}
.reading-teaser::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 70% at 80% 50%,rgba(192,57,43,0.08) 0%,transparent 70%);
  pointer-events:none}
/* Section-level heading — sits above both columns */
.rt-section-head{
  text-align:center;margin-bottom:3.5rem;
  padding-bottom:2.5rem;
  border-bottom:1px solid rgba(255,255,255,0.06)}
.rt-section-eyebrow{
  font-family:'Oswald',sans-serif;font-size:0.62rem;font-weight:500;
  letter-spacing:0.38em;text-transform:uppercase;color:var(--red);
  margin-bottom:0.7rem}
.rt-section-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.2rem,4.5vw,3.6rem);
  letter-spacing:0.06em;color:#fff;line-height:1}
/* Right column heading */
.rt-right-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.8rem,5vw,4.2rem);
  line-height:0.9;letter-spacing:0.03em;color:#fff;
  margin-bottom:1.4rem}
.rt-right-title em{
  font-style:normal;color:var(--gold);display:block}
.rt-inner{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.rt-left{}
.rt-eyebrow{
  font-family:'Oswald',sans-serif;font-size:0.88rem;font-weight:600;
  letter-spacing:0.28em;text-transform:uppercase;color:var(--red);
  margin-bottom:1.2rem;display:flex;align-items:center;gap:0.75rem}
.rt-eyebrow::before{content:'';width:28px;height:2px;background:var(--red)}
.rt-left h2{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.8rem,5vw,4.2rem);
  line-height:0.9;letter-spacing:0.03em;color:#fff;margin-bottom:1.4rem}
.rt-left h2 em{
  font-style:normal;color:var(--gold);display:block}
.rt-intro{
  font-family:'Merriweather',serif;font-size:0.95rem;font-weight:300;
  line-height:1.9;color:rgba(255,255,255,0.75);margin-bottom:2rem}
.rt-intro strong{color:rgba(255,255,255,0.85);font-weight:400}
.rt-stats{
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.06);
  margin-bottom:2.5rem}
.rt-stat{
  padding:1.25rem 1.4rem;background:#0c0c0c}
.rt-stat-n{
  font-family:'Bebas Neue',sans-serif;font-size:2.2rem;
  color:var(--red);line-height:1;display:block;margin-bottom:0.2rem}
.rt-stat-l{
  font-family:'Atkinson Hyperlegible',system-ui,sans-serif;font-size:15px;font-weight:400;
  letter-spacing:0.01em;text-transform:none;color:#f4efe6;
  line-height:1.5}
.rt-right{display:flex;flex-direction:column;gap:1.2rem}
.rt-card{
  position:relative;padding:1.5rem 1.6rem;
  background:rgba(255,255,255,0.025);
  border:1px solid rgba(255,255,255,0.06);
  border-left:3px solid transparent;
  transition:border-color .3s,background .3s}
.rt-card:hover{
  border-left-color:var(--red);
  background:rgba(255,255,255,0.04)}
.rt-card-tag{
  font-family:'Oswald',sans-serif;font-size:0.55rem;font-weight:500;
  letter-spacing:0.28em;text-transform:uppercase;
  color:var(--red);margin-bottom:0.5rem}
.rt-card h3{
  font-family:'Oswald',sans-serif;font-size:1.05rem;font-weight:600;
  letter-spacing:0.04em;color:#fff;margin-bottom:0.5rem;line-height:1.25}
.rt-card p{
  font-family:'Merriweather',serif;font-size:0.8rem;font-weight:300;
  line-height:1.75;color:rgba(255,255,255,0.70)}
.rt-card p strong{color:rgba(255,255,255,0.75);font-weight:400}
.rt-cta-row{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;margin-top:0.5rem}
.rt-source{
  font-family:'Oswald',sans-serif;font-size:0.58rem;font-weight:300;
  letter-spacing:0.08em;color:rgba(255,255,255,0.2);
  font-style:italic;margin-top:1.5rem;
  padding-top:1.5rem;border-top:1px solid rgba(255,255,255,0.05)}

/* =============================================
   WHY READING MATTERS — FULL PAGE
   ============================================= */
.rdg-hero{
  position:relative;min-height:52vh;
  display:flex;align-items:flex-end;overflow:hidden;
  background:#080808}
.rdg-hero-grad{
  position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(0,0,0,0.95) 0%,rgba(30,5,5,0.85) 100%);z-index:1}
.rdg-hero-noise{
  position:absolute;inset:0;z-index:0;opacity:0.03;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-size:200px}
.rdg-hero-inner{
  position:relative;z-index:2;width:100%;
  max-width:900px;padding:4rem 4rem 5rem;margin:0 auto}
.rdg-hero-eyebrow{
  font-family:'Oswald',sans-serif;font-size:0.64rem;font-weight:500;
  letter-spacing:0.35em;text-transform:uppercase;color:var(--red);
  margin-bottom:1.5rem;display:flex;align-items:center;gap:0.75rem}
.rdg-hero-eyebrow::before{content:'';width:24px;height:1px;background:var(--red)}
.rdg-hero h1{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(3rem,7vw,5.5rem);
  line-height:0.88;letter-spacing:0.03em;color:#fff;margin-bottom:1.2rem}
.rdg-hero h1 span{color:var(--gold)}
.rdg-hero-sub{
  font-family:'Merriweather',serif;font-size:1.05rem;font-weight:300;
  font-style:italic;color:rgba(255,255,255,0.48);line-height:1.75;
  max-width:640px}

/* Page body */
.rdg-body{max-width:900px;margin:0 auto;padding:0 4rem 6rem}

/* Opener — the loss frame for parents */
.rdg-opener{
  padding:4rem 0 3rem;
  border-bottom:1px solid rgba(255,255,255,0.06)}
.rdg-opener-quote{
  font-family:'Merriweather',serif;
  font-size:clamp(1.15rem,2.5vw,1.55rem);
  font-weight:300;line-height:1.82;
  color:rgba(255,255,255,0.78);margin-bottom:2rem}
.rdg-opener-quote strong{font-weight:400;color:#fff}
.rdg-opener-quote em{font-style:italic;color:rgba(255,255,255,0.42)}

/* Section headers */
.rdg-section{padding:3.5rem 0;border-bottom:1px solid rgba(255,255,255,0.05)}
.rdg-section:last-child{border-bottom:none}
.rdg-section-label{
  font-family:'Oswald',sans-serif;font-size:0.62rem;font-weight:500;
  letter-spacing:0.32em;text-transform:uppercase;color:var(--red);
  margin-bottom:0.8rem;display:flex;align-items:center;gap:0.75rem}
.rdg-section-label::before{content:'';width:20px;height:1px;background:var(--red)}
.rdg-section h2{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2rem,4vw,3rem);
  letter-spacing:0.04em;color:#fff;
  line-height:0.92;margin-bottom:1.4rem}
.rdg-section h2 em{font-style:normal;color:var(--gold)}
.rdg-prose{
  font-family:'Merriweather',serif;font-size:0.93rem;font-weight:300;
  line-height:1.9;color:rgba(255,255,255,0.75);margin-bottom:1.2rem}
.rdg-prose strong{color:rgba(255,255,255,0.82);font-weight:400}

/* Pull quote / highlight block */
.rdg-pull{
  margin:2rem 0;
  padding:1.75rem 2rem;
  background:rgba(192,57,43,0.06);
  border-left:3px solid var(--red);
  border-right:1px solid rgba(192,57,43,0.15)}
.rdg-pull p{
  font-family:'Oswald',sans-serif;font-size:1.05rem;font-weight:400;
  letter-spacing:0.02em;line-height:1.55;color:rgba(255,255,255,0.85)}
.rdg-pull cite{
  display:block;margin-top:0.6rem;
  font-family:'Oswald',sans-serif;font-size:0.6rem;font-weight:300;
  letter-spacing:0.16em;text-transform:uppercase;
  color:rgba(255,255,255,0.28);font-style:normal}

/* Research fact cards */
.rdg-facts{display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background:rgba(255,255,255,0.05);margin:2rem 0;
  border:1px solid rgba(255,255,255,0.05)}
.rdg-fact{background:#0c0c0c;padding:1.5rem 1.6rem}
.rdg-fact-n{
  font-family:'Bebas Neue',sans-serif;font-size:2.6rem;
  color:var(--red);line-height:1;display:block;margin-bottom:0.3rem}
.rdg-fact-text{
  font-family:'Atkinson Hyperlegible',system-ui,sans-serif;font-size:16px;font-weight:400;
  letter-spacing:0.01em;color:#f4efe6;line-height:1.55}
.rdg-fact-text strong{color:#ffffff;font-weight:700}
.rdg-fact-src{
  display:block;margin-top:0.5rem;
  font-family:'Oswald',sans-serif;font-size:12px;font-weight:400;
  letter-spacing:0.06em;text-transform:uppercase;color:rgba(255,255,255,0.5)}

/* For Boys section — different feel, direct address */
.rdg-for-boys{
  margin:2rem 0;
  padding:2rem 2.2rem;
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.07);
  position:relative;overflow:hidden}
.rdg-for-boys::before{
  content:'FOR THE BOY';
  position:absolute;right:-0.5rem;top:50%;
  transform:translateY(-50%) rotate(90deg);
  font-family:'Bebas Neue',sans-serif;font-size:0.7rem;
  letter-spacing:0.4em;color:rgba(255,255,255,0.04);
  white-space:nowrap;pointer-events:none}
.rdg-for-boys-label{
  font-family:'Oswald',sans-serif;font-size:0.6rem;font-weight:500;
  letter-spacing:0.3em;text-transform:uppercase;color:var(--gold);
  margin-bottom:0.9rem}
.rdg-for-boys p{
  font-family:'Merriweather',serif;font-size:0.93rem;font-weight:300;
  line-height:1.88;color:rgba(255,255,255,0.78)}
.rdg-for-boys p strong{color:#fff;font-weight:400}

/* CTA at bottom of reading page */
.rdg-cta-block{
  margin-top:3.5rem;padding:3rem;
  background:rgba(192,57,43,0.08);
  border:1px solid rgba(192,57,43,0.2);
  text-align:center}
.rdg-cta-block h3{
  font-family:'Bebas Neue',sans-serif;font-size:2.2rem;
  letter-spacing:0.04em;color:#fff;margin-bottom:0.6rem}
.rdg-cta-block p{
  font-family:'Oswald',sans-serif;font-size:0.85rem;font-weight:300;
  letter-spacing:0.04em;color:rgba(255,255,255,0.5);
  line-height:1.6;margin-bottom:1.75rem;max-width:540px;margin-left:auto;margin-right:auto}
.rdg-cta-row{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.rdg-footnotes{
  margin-top:3rem;padding-top:2rem;
  border-top:1px solid rgba(255,255,255,0.05)}
.rdg-footnotes p{
  font-family:'Oswald',sans-serif;font-size:0.58rem;font-weight:300;
  letter-spacing:0.04em;color:rgba(255,255,255,0.2);
  line-height:1.7;margin-bottom:0.4rem}

/* =============================================
   RESPONSIVE / MOBILE
   ============================================= */
@media (max-width:1024px){
  nav{padding:0 1.5rem}
  .hero-inner{padding:0 2rem 4rem;gap:1.5rem}
  .showcase{padding:5rem 2rem;gap:3rem}
  .series-section{padding:4rem 2rem}
  .reading-teaser{padding:4rem 2rem 5rem}
  .player-section{padding:4rem 2rem}
  .extract-section{padding:4rem 2rem}
  .stats-band{padding:1.2rem 2rem;gap:2rem}
}
@media (max-width:768px){
  .nav-right .nav-link{display:none}
  .hero-inner{grid-template-columns:1fr;padding:0 1.5rem 3rem}
  .hero-cover-wrap{display:none}
  .hero{min-height:100svh}
  h1.h-title{font-size:clamp(3.5rem,14vw,6rem)}
  .h-actions{flex-direction:column;align-items:flex-start}
  .btn-red,.btn-ghost{width:100%;text-align:center;justify-content:center}
  .stats-band{flex-wrap:wrap;gap:1.5rem;padding:1.5rem}
  .stat-div{display:none}
  .showcase{grid-template-columns:1fr;text-align:center}
  .sc-book3d{display:none}
  .sc-ctas{justify-content:center}
  .books-grid{grid-template-columns:repeat(3,1fr);gap:0.8rem}
  .player-body{grid-template-columns:1fr}
  .rt-inner{grid-template-columns:1fr;gap:3rem}
  .rdg-facts{grid-template-columns:1fr}
  .detail-inner{grid-template-columns:1fr;gap:2rem;padding:2rem}
  .db-cover{width:180px}
  .hero-trust-row{font-size:0.62rem}
}
@media (max-width:480px){
  nav{padding:0 1rem}
  .logo-big{font-size:1rem}
  .hero-inner{padding:0 1rem 2.5rem}
  .h-actions .btn-red,
  .h-actions .btn-ghost{display:block;width:100%;text-align:center}
  .books-grid{grid-template-columns:repeat(2,1fr)}
  .player-section{padding:3rem 1rem}
  .extract-section{padding:3rem 1rem}
  .series-section{padding:3rem 1rem}
  .reading-teaser{padding:3rem 1rem 4rem}
  .stats-band{padding:1.2rem 1rem}
  .ctrls{gap:0.5rem}
  .ctrl{padding:0.4rem 0.6rem;font-size:0.6rem}
  .ctrl-play{width:48px;height:48px}
  .also-section{padding:2.5rem 1rem}
  footer{padding:2rem 1rem;flex-direction:column;text-align:center}
  .rdg-body{padding:0 1rem 4rem}
  .rdg-hero-inner{padding:3rem 1rem 4rem}
  .detail-inner{padding:1.5rem 1rem}
}

/* Focus states for keyboard accessibility */
.btn-red:focus-visible,.btn-ghost:focus-visible,.nav-link:focus-visible,.ctrl:focus-visible,.ctrl-play:focus-visible{
  outline:2px solid var(--gold);outline-offset:3px}

/* =============================================
   READABILITY OVERRIDES — Accessibility pass
   Target: grandparents, parents, boys 10-14
   Rules: no important text <18px, body 20px,
   line-height 1.7, weight 400 min for prose
   ============================================= */

body{
  font-family:'Atkinson Hyperlegible',system-ui,-apple-system,'Segoe UI',sans-serif !important;
  font-size:20px !important;
  line-height:1.7 !important;
  font-weight:400 !important;
  color:var(--text) !important;
}

p,li{
  font-family:'Atkinson Hyperlegible',system-ui,-apple-system,'Segoe UI',sans-serif !important;
  font-size:20px !important;
  line-height:1.7 !important;
  font-weight:400 !important;
  color:var(--text-soft) !important;
}

/* Merriweather prose elements — switch font and lift size */
.showcase p,.rt-intro,.rt-card p,.rdg-prose,.rdg-opener-quote,
.rdg-for-boys p,.big-quote,.free-text,.gate-what{
  font-family:'Atkinson Hyperlegible',system-ui,-apple-system,'Segoe UI',sans-serif !important;
  font-size:20px !important;
  line-height:1.75 !important;
  font-weight:400 !important;
  color:var(--text-soft) !important;
}

/* Pull-quote / big-quote blocks — slightly larger */
.big-quote,.rdg-opener-quote{
  font-size:clamp(22px,2.6vw,28px) !important;
  line-height:1.65 !important;
}

/* Strong inside prose */
p strong,li strong,.showcase p strong,.rdg-prose strong,
.rdg-opener-quote strong,.rt-intro strong,.rt-card p strong,
.free-text strong{
  color:var(--text) !important;
  font-weight:700 !important;
}

/* Fix default browser-blue links on dark */
a{color:var(--gold) !important;}
nav a,nav button,.nav-link{color:rgba(255,240,218,0.85) !important;}
.nav-cta{color:#fff !important;}

/* Nav legibility */
nav a,.nav-link{
  font-size:15px !important;
  font-weight:500 !important;
  letter-spacing:0.06em !important;
}

/* Buttons — 18 px minimum, taller hit target */
.btn-red,.btn-ghost,.btn-spotify,.nav-cta,
.gate-submit,.gate-close-btn{
  font-size:18px !important;
  min-height:54px !important;
  padding-top:14px !important;
  padding-bottom:14px !important;
  font-weight:700 !important;
}

/* Spotify button contrast — darken slightly */
.btn-spotify{background:#1a9e49 !important;}
.btn-spotify:hover{background:#1db954 !important;}
.gate-spotify-direct{
  background:rgba(26,158,73,0.1) !important;
  border-color:rgba(26,158,73,0.35) !important;
  color:#4cd97b !important;
  font-size:16px !important;
}

/* Eyebrow / kicker labels — floor at 15 px */
.sec-label,.rt-section-eyebrow,.rt-eyebrow,.rdg-section-label,
.rdg-hero-eyebrow,.rdg-for-boys-label,.tag-text,.np-lbl,.ch-lbl,.also-lbl{
  font-size:15px !important;
  font-weight:700 !important;
  letter-spacing:0.1em !important;
}

/* Very small labels — floor at 13 px, lift weight */
.stat-l,.bc-num,.also-num,.bc-status,.also-status,
.rdg-pull cite,
.hero-trust-row,.h-series,.scroll-hint span,
.rdg-footnotes p,.free-badge{
  font-size:13px !important;
  font-weight:500 !important;
}

/* Chapter list */
.ch-name{
  font-size:15px !important;
  font-weight:400 !important;
  color:var(--text-soft) !important;
  line-height:1.4 !important;
}
.ch-n{font-size:14px !important;color:rgba(255,255,255,0.4) !important;}
.ch-dur{font-size:13px !important;}
.ch-free-badge{font-size:12px !important;}

/* Now-playing area */
.np-ttl{font-size:20px !important;font-weight:600 !important;color:var(--text) !important;}
.np-meta{font-size:14px !important;color:var(--text-muted) !important;}
.t-lbl{font-size:14px !important;color:var(--text-muted) !important;}

/* Gate modal copy */
.gate-box p{
  font-family:'Atkinson Hyperlegible',system-ui,sans-serif !important;
  font-size:17px !important;
  line-height:1.65 !important;
  font-weight:400 !important;
  color:var(--text-soft) !important;
}
.gate-input{
  font-size:17px !important;
  font-weight:400 !important;
  color:var(--text) !important;
  background:rgba(255,255,255,0.07) !important;
  border-color:var(--border) !important;
}
.gate-what{font-size:15px !important;color:var(--text-muted) !important;}

/* Feature list in showcase */
.feat-list li{
  font-family:'Atkinson Hyperlegible',system-ui,sans-serif !important;
  font-size:18px !important;
  font-weight:400 !important;
  color:var(--text-soft) !important;
  line-height:1.6 !important;
}

/* Logo — lift nav readability */
.logo-big{font-size:1.35rem !important;}
.logo-small{
  font-size:0.62rem !important;
  font-weight:400 !important;
  color:rgba(255,255,255,0.5) !important;
  letter-spacing:0.2em !important;
}

/* Footer — keep small but readable */
footer p{font-size:12px !important;color:rgba(255,255,255,0.32) !important;}

/* Warm up card surfaces */
.gate-box{background:var(--surface) !important;}
.rt-card,.rdg-for-boys,.rdg-pull{background:var(--surface) !important;}

/* Mobile overrides */
@media(max-width:720px){
  body,p,li,
  .showcase p,.rt-intro,.rt-card p,.rdg-prose,
  .rdg-opener-quote,.rdg-for-boys p,.big-quote,.free-text{
    font-size:18px !important;
    line-height:1.7 !important;
  }
  .btn-red,.btn-ghost,.btn-spotify,.gate-submit,.gate-close-btn{
    font-size:17px !important;
    min-height:54px !important;
  }
  .ch-name{font-size:14px !important;}
  .np-ttl{font-size:18px !important;}
  .big-quote,.rdg-opener-quote{font-size:20px !important;}
}

/* =============================================
   ACCESSIBILITY POLISH — Pass 2
   Button contrast, heading sizes,
   list sizes, tracking, mobile header
   ============================================= */

/* 1. Red CTA — warm white text, never gold */
.btn-red,a.btn-red,button.btn-red,.nav-cta,.gate-submit{
  background:#cf3b30 !important;
  color:#fffaf0 !important;
  border-color:rgba(255,250,240,0.22) !important;
}
.btn-red:hover,a.btn-red:hover,button.btn-red:hover,.nav-cta:hover,.gate-submit:hover{
  background:#e14a3e !important;
  color:#ffffff !important;
}

/* 2. Spotify — dark green, pure white text */
.btn-spotify,a.btn-spotify{
  background:#138a3d !important;
  color:#ffffff !important;
  border-color:rgba(255,255,255,0.22) !important;
}
.btn-spotify:hover,a.btn-spotify:hover{
  background:#16a347 !important;
  color:#ffffff !important;
}
.gate-spotify-direct{
  background:rgba(19,138,61,0.15) !important;
  border-color:rgba(19,138,61,0.45) !important;
  color:#4cd97b !important;
  font-size:16px !important;
}

/* 3. Ghost buttons — off-white text, stronger border */
.btn-ghost,button.btn-ghost,a.btn-ghost{
  color:#f4efe6 !important;
  background:rgba(12,12,12,0.72) !important;
  border:1px solid rgba(244,239,230,0.42) !important;
}
.btn-ghost:hover,button.btn-ghost:hover,a.btn-ghost:hover{
  background:rgba(244,239,230,0.12) !important;
  border-color:rgba(244,239,230,0.7) !important;
  color:#ffffff !important;
}

/* 4. H3 headings — 22px minimum desktop */
h3,.rt-card h3,.gate-box h3,.rdg-cta-block h3,[class*="card"] h3{
  font-size:22px !important;
  line-height:1.35 !important;
  font-weight:600 !important;
}

/* 5. List items — 18px minimum */
li,.feat-list li{
  font-size:18px !important;
  line-height:1.6 !important;
}

/* 6. Letter spacing — tight on copy, military feel kept on labels only */
p,li{letter-spacing:0.01em !important;}
.btn-red,.btn-ghost,.btn-spotify{letter-spacing:0.06em !important;}
.sec-label,.rt-section-eyebrow,.rt-eyebrow,.rdg-section-label,
.rdg-hero-eyebrow,.rdg-for-boys-label,.tag-text,.np-lbl,.ch-lbl,.also-lbl,
[class*="eyebrow"],[class*="kicker"]{
  font-size:16px !important;
  letter-spacing:0.08em !important;
}

/* 7. Mobile header */
@media(max-width:720px){
  .logo{max-width:68vw !important;line-height:1.15 !important;}
  .logo-big{font-size:1.1rem !important;white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;}
  .logo-small{font-size:0.55rem !important;white-space:nowrap !important;}
  .nav-cta{font-size:15px !important;min-height:44px !important;padding:10px 14px !important;white-space:nowrap !important;}
  h3,[class*="card"] h3{font-size:20px !important;}
  li,.feat-list li{font-size:18px !important;}
}

/* ============================================================
   ADDITIONS — multi-page conversion (signup, about, coming-soon)
   ============================================================ */

/* Inline optional signup (replaces the modal gate) */
.signup-inline{max-width:760px;margin:0 auto 4.5rem;padding:2.2rem 2rem;background:rgba(192,57,43,0.06);border:1px solid rgba(192,57,43,0.22);border-radius:4px;text-align:center}
.signup-inline .su-eyebrow{font-family:'Oswald',sans-serif;font-size:0.72rem;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);margin:0 0 0.5rem}
.signup-inline h3{font-family:'Bebas Neue',sans-serif;font-size:2rem;letter-spacing:0.02em;color:#fff;margin:0 0 0.6rem}
.signup-inline p{font-family:'Merriweather',serif;font-size:0.95rem;line-height:1.6;color:rgba(255,255,255,0.72);max-width:560px;margin:0 auto 1.3rem}
.su-input{width:100%;max-width:380px;padding:0.85rem 1rem;margin:0 auto 0.85rem;display:block;background:rgba(0,0,0,0.35);border:1px solid rgba(255,255,255,0.2);color:#fff;font-family:'Oswald',sans-serif;font-size:0.95rem;border-radius:3px}
.su-input:focus{outline:none;border-color:var(--gold)}
.su-btn{font-family:'Oswald',sans-serif;font-weight:600;font-size:0.92rem;letter-spacing:0.08em;text-transform:uppercase;color:#fff;background:var(--red);border:none;padding:0.85rem 1.8rem;cursor:pointer;border-radius:3px;transition:background .2s}
.su-btn:hover{background:var(--red-hot)}
.su-check{font-size:2.4rem;margin-bottom:0.4rem}

/* About / author page */
.about-wrap{max-width:1000px;margin:0 auto;padding:5rem 1.5rem 2rem}
.about-head{text-align:center;margin-bottom:3rem}
.about-head .sec-label{justify-content:center}
.about-head h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.6rem,6vw,4.4rem);letter-spacing:0.02em;color:#fff;margin:0.4rem 0 0}
.about-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:3rem;align-items:start}
.about-photo{width:100%;border-radius:4px;border:1px solid rgba(255,255,255,0.12);box-shadow:0 18px 50px rgba(0,0,0,0.5)}
.about-photo-cap{font-family:'Oswald',sans-serif;font-size:0.72rem;letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,255,255,0.5);text-align:center;margin-top:0.7rem}
.about-bio p{font-family:'Merriweather',serif;font-size:1.02rem;line-height:1.8;color:rgba(255,255,255,0.82);margin:0 0 1.1rem}
.about-note{max-width:780px;margin:3.5rem auto 0;padding:2.4rem 2.2rem;background:rgba(255,255,255,0.03);border-left:3px solid var(--gold);border-radius:0 4px 4px 0}
.about-note .note-lbl{font-family:'Oswald',sans-serif;font-size:0.72rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin:0 0 1rem}
.about-note p{font-family:'Merriweather',serif;font-size:1.02rem;line-height:1.8;color:rgba(255,255,255,0.85);margin:0 0 1rem}
@media(max-width:760px){.about-grid{grid-template-columns:1fr;gap:1.6rem}}

/* Coming-soon stub pages */
.cs-status{display:inline-block;font-family:'Oswald',sans-serif;font-size:0.74rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(212,160,23,0.4);padding:0.35rem 0.9rem;border-radius:3px;margin-bottom:1rem}
.cs-note{font-family:'Merriweather',serif;font-style:italic;color:rgba(255,255,255,0.6);font-size:0.95rem;margin-top:1.2rem}
.cs-cover-placeholder{display:flex;align-items:center;justify-content:center;text-align:center;background:linear-gradient(160deg,#1a1a1a,#0c0c0c);border:1px dashed rgba(255,255,255,0.18);color:rgba(255,255,255,0.4);font-family:'Oswald',sans-serif;letter-spacing:0.1em;text-transform:uppercase;font-size:0.8rem;padding:1rem}

/* footer nav row */
.foot-nav{display:flex;gap:1.4rem;justify-content:center;flex-wrap:wrap;margin-bottom:0.6rem}
.foot-nav a{font-family:'Oswald',sans-serif;font-size:0.8rem;letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,255,255,0.55);text-decoration:none}
.foot-nav a:hover{color:var(--gold)}


/* ============================================================
   LOOK INSIDE — sample-pages carousel + lightbox
   ============================================================ */
.look-inside{max-width:1100px;margin:0 auto 4.5rem;padding:0 1.5rem}
.li-head{text-align:center;margin-bottom:1.8rem}
.li-head .sec-label{justify-content:center}
.li-head h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(2rem,5vw,3.2rem);letter-spacing:0.02em;color:#fff;margin:0.3rem 0 0.5rem}
.li-sub{font-family:'Oswald',sans-serif;font-size:0.8rem;letter-spacing:0.06em;color:rgba(255,255,255,0.5);text-transform:uppercase}
.sample-carousel{position:relative;display:flex;align-items:center;gap:0.6rem;margin-bottom:1.8rem}
.sc-viewport{position:relative;overflow:hidden;flex:1;border-radius:4px}
.sc-track{display:flex;transition:transform .45s cubic-bezier(.4,0,.2,1)}
.sc-slide{min-width:100%;display:flex;align-items:center;justify-content:center;cursor:zoom-in;padding:0.4rem}
.sc-slide img{width:100%;height:auto;max-height:70vh;object-fit:contain;background:#f4f1ea;border:1px solid rgba(255,255,255,0.14);box-shadow:0 14px 44px rgba(0,0,0,0.5);border-radius:2px}
.sc-arrow{flex-shrink:0;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,0.2);background:rgba(0,0,0,0.5);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s}
.sc-arrow:hover{background:var(--red);border-color:var(--red)}
.sc-arrow:disabled{opacity:0.25;cursor:default}
.sc-counter{position:absolute;top:0.6rem;right:0.6rem;font-family:'Oswald',sans-serif;font-size:0.72rem;letter-spacing:0.1em;color:#fff;background:rgba(0,0,0,0.55);padding:0.25rem 0.6rem;border-radius:3px;pointer-events:none}
.sc-dots{position:absolute;bottom:-1.4rem;left:0;right:0;display:flex;gap:0.5rem;justify-content:center}
.sc-dot{width:9px;height:9px;border-radius:50%;border:none;background:rgba(255,255,255,0.25);cursor:pointer;padding:0;transition:background .2s,transform .2s}
.sc-dot.active{background:var(--gold);transform:scale(1.25)}
.li-lightbox{position:fixed;inset:0;background:rgba(0,0,0,0.92);z-index:9999;display:none;align-items:center;justify-content:center;padding:2vh 2vw}
.li-lightbox.open{display:flex}
.li-lightbox img{max-width:96vw;max-height:92vh;object-fit:contain;box-shadow:0 20px 60px rgba(0,0,0,0.7)}
.lb-close{position:absolute;top:1rem;right:1.2rem;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,0.3);background:rgba(0,0,0,0.5);color:#fff;font-size:1.3rem;cursor:pointer}
.lb-arrow{position:absolute;top:50%;transform:translateY(-50%);width:50px;height:50px;border-radius:50%;border:1px solid rgba(255,255,255,0.3);background:rgba(0,0,0,0.5);color:#fff;font-size:1.8rem;cursor:pointer}
.lb-prev{left:1.2rem}.lb-next{right:1.2rem}
.lb-arrow:hover,.lb-close:hover{background:var(--red);border-color:var(--red)}
@media(max-width:680px){.sc-arrow{width:38px;height:38px;font-size:1.3rem}.sc-slide img{max-height:52vh}.lb-arrow{width:42px;height:42px}}


/* ============================================================
   LOOK-INSIDE CAROUSEL + LIGHTBOX
   ============================================================ */
.look-inside{max-width:880px;margin:0 auto 4.5rem;padding:0 1.5rem}
.li-head{text-align:center;margin-bottom:1.6rem}
.li-head .sec-label{justify-content:center}
.li-head h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(2rem,5vw,3rem);letter-spacing:.02em;color:#fff;margin:.3rem 0 .4rem}
.li-sub{font-family:'Oswald',sans-serif;font-size:.82rem;letter-spacing:.04em;color:rgba(255,255,255,.55);text-transform:uppercase}
.sample-carousel{position:relative;display:flex;align-items:center;gap:.6rem;margin-bottom:1.8rem}
.sc-viewport{position:relative;overflow:hidden;flex:1;border-radius:4px}
.sc-track{display:flex;transition:transform .45s cubic-bezier(.4,0,.2,1)}
.sc-slide{min-width:100%;display:flex;align-items:center;justify-content:center;cursor:zoom-in;padding:.4rem}
.sc-slide img{width:auto;max-width:100%;max-height:74vh;object-fit:contain;background:#fff;border:1px solid rgba(255,255,255,.14);box-shadow:0 14px 44px rgba(0,0,0,.55);border-radius:2px}
.sc-arrow{flex-shrink:0;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.45);color:#fff;font-size:1.7rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s}
.sc-arrow:hover:not(:disabled){background:var(--red);border-color:var(--red)}
.sc-arrow:disabled{opacity:.25;cursor:default}
.sc-counter{position:absolute;top:.6rem;right:.6rem;font-family:'Oswald',sans-serif;font-size:.72rem;letter-spacing:.1em;color:#fff;background:rgba(0,0,0,.6);padding:.25rem .6rem;border-radius:3px;pointer-events:none}
.sc-dots{position:absolute;left:0;right:0;bottom:-1.5rem;display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}
.sc-dot{width:9px;height:9px;border-radius:50%;border:none;background:rgba(255,255,255,.25);cursor:pointer;padding:0;transition:background .2s,transform .2s}
.sc-dot.active{background:var(--gold);transform:scale(1.3)}
.li-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.93);z-index:9999;display:none;align-items:center;justify-content:center}
.li-lightbox.open{display:flex}
.li-lightbox img{max-width:95vw;max-height:94vh;object-fit:contain;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.7)}
.lb-close{position:absolute;top:1rem;right:1.1rem;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(0,0,0,.5);color:#fff;font-size:1.4rem;cursor:pointer;z-index:2}
.lb-arrow{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(0,0,0,.5);color:#fff;font-size:2rem;line-height:1;cursor:pointer;z-index:2}
.lb-prev{left:1rem}.lb-next{right:1rem}
.lb-arrow:hover,.lb-close:hover{background:var(--red);border-color:var(--red)}
@media(max-width:640px){.sc-arrow{width:38px;height:38px;font-size:1.4rem}.sc-slide img{max-height:64vh}.lb-arrow{width:42px;height:42px;font-size:1.6rem}}
@media(prefers-reduced-motion:reduce){.sc-track{transition:none}}

/* ====================================================================
   WARM-LIGHT THEME  (TRIAL - homepage only, via body.theme-warm)
   Built to beat the Pass-2 accessibility !important rules, which route
   most text through --text / --text-soft / --text-muted. Flipping those
   to dark is correct on LIGHT sections. The audio player is kept dark on
   purpose, so its text is forced back to light below. Hero image and the
   book covers stay cinematic. Other pages remain dark until sign-off.
   ==================================================================== */
body.theme-warm{
  --red:#B33A2B; --red-hot:#CF3B30; --gold:#CB991C;
  --dark:#F2E9D8; --surface:#FBF6EC; --surface-warm:#EBDFC9;
  --text:#2A2118; --text-soft:#574B3B; --text-muted:#7C6E59;
  --border:rgba(42,33,24,0.16);
  background:var(--dark);
}

/* NAV - light bar; force links dark (beats line 677 !important) */
body.theme-warm nav{background:rgba(247,241,230,0.92);border-bottom:1px solid rgba(42,33,24,0.10)}
body.theme-warm .logo-big{color:var(--text)}
body.theme-warm .logo-small{color:var(--text-muted) !important}
body.theme-warm .nav-link{color:var(--text-soft) !important}
body.theme-warm .nav-link:hover{color:var(--red) !important}

/* HERO - cinematic; only soften heavy black drop + red glow */
body.theme-warm .book3d{filter:drop-shadow(0 18px 34px rgba(60,40,20,0.30))}
body.theme-warm .book-cover{box-shadow:8px 10px 28px rgba(60,40,20,0.30),18px 18px 50px rgba(60,40,20,0.16)}
body.theme-warm .book-glow{background:radial-gradient(ellipse,rgba(179,58,43,0.10) 0%,transparent 70%)}

/* GHOST BUTTON */
body.theme-warm .btn-ghost{color:var(--text-soft);background:rgba(42,33,24,0.04);border:1px solid rgba(42,33,24,0.22)}
body.theme-warm .btn-ghost:hover{background:rgba(42,33,24,0.08);border-color:rgba(42,33,24,0.40)}

/* STATS BAND */
body.theme-warm .stats-band{background:var(--surface-warm);border-top:1px solid rgba(42,33,24,0.10);border-bottom:1px solid rgba(42,33,24,0.10)}
body.theme-warm .stat-l{color:var(--text-muted)}
body.theme-warm .stat-div{background:rgba(42,33,24,0.20)}

/* SHOWCASE (light; prose handled by Pass-2 var flip) */
body.theme-warm .sec-label{color:var(--red) !important}
body.theme-warm .showcase h2{color:var(--text)}
body.theme-warm .sc-cover{box-shadow:10px 12px 36px rgba(60,40,20,0.30),24px 24px 62px rgba(60,40,20,0.15)}
body.theme-warm .sc-glow{background:radial-gradient(ellipse at 50% 0%,rgba(179,58,43,0.12) 0%,transparent 72%)}

/* SERIES / BOOK CARDS */
body.theme-warm .series-section{border-top:1px solid rgba(42,33,24,0.10)}
body.theme-warm .series-header h2{color:var(--text)}
body.theme-warm .series-header p{color:var(--text-muted)}
body.theme-warm .bc-num{color:var(--text-muted)}
body.theme-warm .bc-name{color:var(--text)}
body.theme-warm .bc-img{box-shadow:5px 7px 20px rgba(60,40,20,0.26),12px 12px 32px rgba(60,40,20,0.14)}
body.theme-warm .status-soon{background:rgba(42,33,24,0.06);color:var(--text-muted);border:1px solid rgba(42,33,24,0.15)}

/* EXTRACT / BIG QUOTE (text handled by Pass-2; just the em) */
body.theme-warm .big-quote em{color:var(--text-muted)}

/* READING TEASER - lighten the dark section so dark text is readable */
body.theme-warm .reading-teaser{background:linear-gradient(135deg,#F4ECDD 0%,#ECE0CB 100%);border-top:1px solid rgba(42,33,24,0.10)}
body.theme-warm .reading-teaser::before{background:radial-gradient(ellipse 60% 70% at 80% 50%,rgba(179,58,43,0.06) 0%,transparent 70%)}
body.theme-warm .rt-section-title{color:var(--text)}
body.theme-warm .rt-section-eyebrow{color:var(--red) !important}
body.theme-warm .rt-left h2{color:var(--text)}
body.theme-warm .rt-right-title{color:var(--text)}
body.theme-warm .rt-stats{background:rgba(42,33,24,0.08);border:1px solid rgba(42,33,24,0.10)}
body.theme-warm .rt-stat{background:var(--surface)}
body.theme-warm .rt-stat-l{color:var(--text-soft) !important}
body.theme-warm .rt-card{border:1px solid rgba(42,33,24,0.12)}
body.theme-warm .rt-card:hover{background:#FFFDF8 !important;border-left-color:var(--red)}
body.theme-warm .rt-card h3{color:var(--text)}
body.theme-warm .rt-source{color:var(--text-muted)}

/* INLINE SIGNUP */
body.theme-warm .signup-inline h3{color:var(--text)}
body.theme-warm .su-input{background:#fff;border:1px solid rgba(42,33,24,0.22);color:var(--text) !important}
body.theme-warm .su-input::placeholder{color:var(--text-muted)}

/* FOOTER */
body.theme-warm footer{border-top:1px solid rgba(42,33,24,0.10)}
body.theme-warm footer p{color:var(--text-muted) !important}

/* PLAYER - lightened to a warm panel. Text goes dark via Pass-2 once the
   background is light; here we fix the hardcoded-light chrome
   (waveform, scrubber, controls, volume, chapter list). */
body.theme-warm .player-section{background:var(--surface-warm);border-top:1px solid rgba(42,33,24,0.10)}
body.theme-warm .player-head h2{color:var(--text)}
body.theme-warm .waveform-wrap{background:rgba(42,33,24,0.05)}
body.theme-warm .scrub-wrap{background:rgba(42,33,24,0.14)}
body.theme-warm .scrub-fill::after{background:var(--red);box-shadow:0 0 6px rgba(60,40,20,0.40)}
body.theme-warm .ctrl{background:rgba(42,33,24,0.06);color:var(--text-soft)}
body.theme-warm .ctrl:hover{background:rgba(42,33,24,0.12);color:var(--text)}
body.theme-warm .vol-icon{color:var(--text-muted)}
body.theme-warm input[type=range].vol-slider{background:rgba(42,33,24,0.15)}
body.theme-warm input[type=range].vol-slider::-webkit-slider-thumb{background:var(--red)}
body.theme-warm .ch-lbl{color:var(--text-muted)}
body.theme-warm .ch-item{border-bottom:1px solid rgba(42,33,24,0.07)}
body.theme-warm .ch-item:hover{background:rgba(42,33,24,0.05)}
body.theme-warm .ch-item.active .ch-name{color:var(--text) !important}
body.theme-warm .ch-n{color:var(--text-muted) !important}
body.theme-warm .ch-dur{color:var(--text-muted) !important}
body.theme-warm .ch-lock{color:var(--text-muted)}
body.theme-warm .ch-free-badge{background:rgba(179,58,43,0.12)}


/* ===== WARM-LIGHT THEME - other-page components (rollout) ===== */

/* HEROES stay cinematic-dark (home, book detail, reading-guide). Their
   <p>/<li> subtext is forced dark by Pass-2, so push it back to light. */
body.theme-warm .hero p, body.theme-warm .hero li,
body.theme-warm .detail-hero p, body.theme-warm .detail-hero li,
body.theme-warm .rdg-hero p, body.theme-warm .rdg-hero li{color:rgba(255,255,255,0.90) !important}

/* ALSO-IN-THE-SERIES strip (book pages) */
body.theme-warm .also-section{border-top:1px solid rgba(42,33,24,0.10)}
body.theme-warm .also-lbl{color:var(--text-muted)}
body.theme-warm .also-book{background:var(--surface);border:1px solid rgba(42,33,24,0.12)}
body.theme-warm .also-book:hover{border-color:rgba(42,33,24,0.30);background:#FFFDF8}
body.theme-warm .also-num{color:var(--text-muted)}
body.theme-warm .also-name{color:var(--text)}
body.theme-warm .also-status{color:var(--text-muted)}

/* READING-GUIDE body (why-reading-matters) - hero stays dark, body light */
body.theme-warm .rdg-section{border-bottom:1px solid rgba(42,33,24,0.08)}
body.theme-warm .rdg-section:last-child{border-bottom:none}
body.theme-warm .rdg-section h2{color:var(--text)}
body.theme-warm .rdg-opener{border-bottom:1px solid rgba(42,33,24,0.10)}
body.theme-warm .rdg-opener-quote em{color:var(--text-muted)}
body.theme-warm .rdg-pull p{color:var(--text)}
body.theme-warm .rdg-pull cite{color:var(--text-muted)}
body.theme-warm .rdg-facts{background:rgba(42,33,24,0.08);border:1px solid rgba(42,33,24,0.10)}
body.theme-warm .rdg-fact{background:var(--surface)}
body.theme-warm .rdg-fact-text{color:var(--text-soft)}
body.theme-warm .rdg-fact-text strong{color:var(--text)}
body.theme-warm .rdg-fact-src{color:var(--text-muted)}
body.theme-warm .rdg-for-boys{background:var(--surface);border:1px solid rgba(42,33,24,0.10)}
body.theme-warm .rdg-for-boys::before{color:rgba(42,33,24,0.05)}
body.theme-warm .rdg-for-boys p strong{color:var(--text)}
body.theme-warm .rdg-cta-block h3{color:var(--text)}
body.theme-warm .rdg-footnotes{border-top:1px solid rgba(42,33,24,0.10)}
body.theme-warm .rdg-footnotes p{color:var(--text-muted)}

/* ABOUT page */
body.theme-warm .about-head h1{color:var(--text)}
body.theme-warm .about-photo{border:1px solid rgba(42,33,24,0.14);box-shadow:0 16px 40px rgba(60,40,20,0.20)}
body.theme-warm .about-photo-cap{color:var(--text-muted)}
body.theme-warm .about-note{background:var(--surface)}

/* COMING-SOON (Genghis) */
body.theme-warm .cs-note{color:var(--text-soft)}
body.theme-warm .cs-cover-placeholder{background:linear-gradient(160deg,#EFE6D4,#E4D7BE);border:1px dashed rgba(42,33,24,0.25);color:var(--text-muted)}

/* LOOK INSIDE carousel (hannibal, why-reading) - lightbox stays dark */
body.theme-warm .li-head h2{color:var(--text)}
body.theme-warm .li-sub{color:var(--text-muted)}
body.theme-warm .sc-slide img{border:1px solid rgba(42,33,24,0.12);box-shadow:0 12px 36px rgba(60,40,20,0.22)}
body.theme-warm .sc-arrow{background:rgba(42,33,24,0.06);border:1px solid rgba(42,33,24,0.20);color:var(--text)}
body.theme-warm .sc-arrow:hover{background:var(--red);border-color:var(--red);color:#fff}
body.theme-warm .sc-dot{background:rgba(42,33,24,0.22)}


/* Hero text legibility over bright image areas (book-detail + reading hero) */
.detail-text .sec-label,.detail-text .d-sub,.detail-text h1,
.detail-text .d-tagline,.detail-text .d-meta,.detail-text .d-hook,.detail-text .d-trust,
.rdg-hero h1,.rdg-hero-eyebrow,.rdg-hero-sub{
  text-shadow:0 2px 12px rgba(0,0,0,0.85),0 1px 3px rgba(0,0,0,0.7);
}
body.theme-warm .detail-text .d-meta,
body.theme-warm .detail-text .d-trust{color:rgba(255,255,255,0.90) !important}
body.theme-warm .detail-text .d-tagline{color:#fff !important}

/* Smaller emblem on phones so the masthead fits */
@media(max-width:600px){ .logo-mark{height:34px;width:34px} }

/* Image slots on the For Parents & Teachers page (placeholders for art to come) */
.rdg-figure{margin:2.4rem auto 0.4rem;max-width:760px}
.rdg-figure figcaption{font-family:'Oswald',sans-serif;font-size:0.82rem;color:var(--text-muted);text-align:center;margin-top:0.65rem;letter-spacing:0.02em;font-weight:300}
.img-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.6rem;min-height:300px;padding:2rem 1.5rem;border:2px dashed rgba(42,33,24,0.22);border-radius:8px;text-align:center;background:repeating-linear-gradient(45deg,rgba(42,33,24,0.018),rgba(42,33,24,0.018) 11px,transparent 11px,transparent 22px),var(--surface)}
.img-slot-tag{font-family:'Bebas Neue',sans-serif;letter-spacing:0.14em;font-size:1.15rem;color:var(--red)}
.img-slot-desc{font-family:'Oswald',sans-serif;font-weight:300;font-size:0.95rem;color:var(--text-soft);max-width:500px;line-height:1.55}

/* ---- Mobile nav menu (hamburger) ---- */
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;padding:9px;background:none;border:none;cursor:pointer;border-radius:6px}
.nav-toggle span{display:block;height:2.5px;width:100%;background:var(--text);border-radius:2px;transition:transform .25s ease,opacity .2s ease}
.nav-toggle:hover{background:rgba(42,33,24,0.06)}
nav.open .nav-toggle span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
nav.open .nav-toggle span:nth-child(2){opacity:0}
nav.open .nav-toggle span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
@media(max-width:860px){
  .nav-toggle{display:flex}
  .nav-right{display:none;position:fixed;top:64px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:rgba(247,241,230,0.99);border-bottom:1px solid rgba(42,33,24,0.12);box-shadow:0 18px 30px rgba(60,40,20,0.16);padding:0.4rem 1.3rem 1.1rem}
  nav.open .nav-right{display:flex}
  nav.open .nav-right .nav-link{display:block !important;padding:0.9rem 0.2rem;font-size:1rem;border-bottom:1px solid rgba(42,33,24,0.08)}
  nav.open .nav-right .nav-cta{margin-top:0.9rem;text-align:center;align-self:stretch}
}

/* Real images inside figure slots */
.rdg-figure img{width:100%;height:auto;display:block;border-radius:8px;box-shadow:0 14px 38px rgba(60,40,20,0.20)}

/* ============================================================
   SAMPLE PDF EMBED  (replaces the Look-Inside JPEG carousel)
   ============================================================ */
.sample-embed-wrap{max-width:900px;margin:0 auto;padding:0 1.25rem}
.sample-embed{width:100%;height:80vh;min-height:540px;border:1px solid rgba(42,33,24,0.22);border-radius:5px;background:#fff;box-shadow:0 12px 34px rgba(0,0,0,0.14)}
.sample-embed-fallback{font-family:'Oswald',sans-serif;font-size:0.82rem;letter-spacing:0.03em;color:var(--text-muted);text-align:center;margin:0.7rem 0 0}
.sample-embed-cta{text-align:center;margin-top:1.5rem}

/* ============================================================
   KIT (ck.5.js) inline error list inside the signup box
   ============================================================ */
.signup-inline .formkit-alert-error{list-style:none;max-width:380px;margin:0.2rem auto 0.9rem;padding:0;border-radius:3px;font-family:'Oswald',sans-serif;font-size:0.85rem;color:#fff;background:rgba(0,0,0,0.28);border:1px solid var(--gold)}
.signup-inline .formkit-alert-error:empty{display:none;border:none;background:none}
.signup-inline .formkit-alert-error li{list-style:none;padding:0.5rem 0.85rem}
body.theme-warm .signup-inline .formkit-alert-error{color:var(--red);background:rgba(192,57,43,0.07);border-color:rgba(192,57,43,0.30)}

/* graceful fallback shown when the sample PDF isn't uploaded yet (or on mobile) */
.sample-embed-pending{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:540px;padding:2rem;text-align:center}
.sample-embed-pending .sep-lead{font-family:'Bebas Neue',sans-serif;font-size:1.7rem;letter-spacing:0.02em;color:var(--text);margin:0 0 0.4rem}
.sample-embed-pending p{font-family:'Merriweather',serif;font-size:0.95rem;line-height:1.6;color:var(--text-soft);margin:0.2rem 0}