/* ============================================================
   MTP LANDING - style.css   ·   VARIATION A: "Light Editorial"
   LIGHT-dominant: warm paper page, navy serif headlines, gold accents.
   Reads like a university-press title. Only two dark bands (bridge + CTA)
   for rhythm. This is the deliberate opposite of the dark Bold theme.
   --blue / --blue-d / --gold + html font-size injected by page.php above.
   ============================================================ */

/* ---- WordPress full-width reset (must stay first) ---- */
#mtp-root{width:100vw!important;max-width:100vw!important;overflow-x:hidden!important;margin:0!important;padding:0!important}
html,body{margin:0!important;padding:0!important;max-width:100%!important;width:100%!important;overflow-x:hidden!important;box-sizing:border-box!important;background:#faf7f0!important;color:#22303f!important}
#page,#content,#primary,#main,.site,.site-content,.site-main,.entry-content,.post-content,.page-content,.wp-block-post-content,.wp-site-blocks,.hentry,article,main,.container,.container-fluid{max-width:100%!important;width:100%!important;margin:0!important;padding:0!important}
nav,.hero,.marquee,.sec-problem,.sec-bridge,.sec-solution,.sec-benefits,.sec-author,.sec-signup,.sec-taste,.sec-puzzle,.sec-cta,footer{width:100vw!important;max-width:100vw!important;box-sizing:border-box!important;position:relative!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;margin:0!important}
nav{position:fixed!important;left:0!important;right:0!important;transform:none!important;width:100%!important}
.hero{position:relative!important}
html{margin-top:0!important}
#wpadminbar{position:fixed!important}

/* ---- Tokens / brand ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --blue:#294A70; --blue-d:#1d3450; --gold:#A37B38;
  --gold-d:#8a6529;  --gold-d:color-mix(in srgb, var(--gold) 78%, #000);   /* readable gold on light */
  --gold-l:#c9a96a;  --gold-l:color-mix(in srgb, var(--gold) 52%, #fff);   /* gold on dark bands */
  --gold-soft:#efe6d6;--gold-soft:color-mix(in srgb, var(--gold) 15%, #fff);
  --ink:#22303f; --mid:#586475; --muted:#8b93a0;
  --paper:#faf7f0; --paper-2:#f4eee2; --cream:#f0e8d8; --white:#fff; --line:#e7ddca;
  --green:#3f8f57;
  --serif:"Fraunces",Georgia,serif;
  --sans:"Plus Jakarta Sans",system-ui,sans-serif;
  --mono:"DM Mono",ui-monospace,monospace;
  --wrap:1220px;
}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);overflow-x:hidden;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--gold-d);text-decoration:none}
a:hover{color:var(--blue)}
img{max-width:100%}
em{font-style:italic}
::selection{background:var(--gold);color:#fff}

/* ---- Reveal on scroll ---- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ---- Buttons ---- */
.btn-gold{display:inline-flex;align-items:center;gap:.5rem;background:var(--gold);color:#fff;font-family:var(--sans);font-weight:600;font-size:.95rem;padding:.92rem 2rem;border:none;border-radius:6px;cursor:pointer;box-shadow:0 10px 26px -10px rgba(163,123,56,.6);transition:transform .25s,box-shadow .25s,filter .25s;letter-spacing:.005em}
.btn-gold:hover{color:#fff;transform:translateY(-2px);box-shadow:0 16px 34px -10px rgba(163,123,56,.65);filter:brightness(1.05)}
/* ghost = navy outline on light backgrounds */
.btn-ghost{display:inline-flex;align-items:center;gap:.5rem;background:transparent;color:var(--blue);font-family:var(--mono);font-size:.78rem;letter-spacing:.05em;padding:.92rem 1.5rem;border:1.5px solid rgba(41,74,112,.28);border-radius:6px;cursor:pointer;transition:all .25s}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue-d);background:rgba(41,74,112,.05)}
.btn-ghost-dark{color:var(--blue);border-color:rgba(41,74,112,.28)}
.btn-ghost-dark:hover{color:var(--blue-d);background:rgba(41,74,112,.05);border-color:var(--blue)}
/* ghost variant that sits on the dark bridge/CTA bands */
.sec-bridge .btn-ghost,.sec-cta .btn-ghost{color:var(--gold-l);border-color:rgba(163,123,56,.4)}
.sec-bridge .btn-ghost:hover,.sec-cta .btn-ghost:hover{color:#fff;background:rgba(163,123,56,.14);border-color:var(--gold-l)}

/* ---- NAV (light) ---- */
nav{z-index:200;display:flex;align-items:center;justify-content:space-between;padding:1.05rem 3.2rem;background:rgba(250,247,240,.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line);transition:box-shadow .3s,padding .3s}
nav.scrolled{box-shadow:0 6px 22px -14px rgba(41,74,112,.3);padding-top:.85rem;padding-bottom:.85rem}
.logo{font-family:var(--sans);font-weight:800;font-size:1.22rem;letter-spacing:-.02em}
.logo-m{color:var(--ink)}.logo-t{color:var(--gold-d)}.logo-d{color:rgba(34,48,63,.4);font-size:.92rem;font-weight:500}
.nav-r{display:flex;align-items:center;gap:2rem}
.nav-link{font-family:var(--mono);font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;color:var(--mid);transition:color .2s}
.nav-link:hover{color:var(--gold-d)}
.nav-btn{background:var(--gold);color:#fff;font-family:var(--sans);font-weight:600;font-size:.82rem;padding:.55rem 1.35rem;border-radius:6px;transition:transform .2s,filter .2s;box-shadow:0 6px 16px -8px rgba(163,123,56,.6)}
.nav-btn:hover{color:#fff;transform:translateY(-1px);filter:brightness(1.05)}

/* ---- HERO (LIGHT) ---- */
.hero{min-height:100vh;background:linear-gradient(180deg,var(--paper) 0%,var(--paper-2) 100%);display:grid;grid-template-columns:1.05fr .95fr;align-items:center;padding-top:4.5rem;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse 60% 55% at 82% 26%,rgba(163,123,56,.13) 0%,transparent 55%),radial-gradient(ellipse 50% 70% at 4% 96%,rgba(41,74,112,.08) 0%,transparent 60%)}
.hero-dots{position:absolute;inset:0;background-image:radial-gradient(rgba(41,74,112,.06) 1px,transparent 1px);background-size:30px 30px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 92%);mask-image:linear-gradient(180deg,#000,transparent 92%)}
.hero-l{padding:5.5rem 3.5rem 5rem clamp(2rem,5vw,6rem);position:relative;z-index:2}
.kicker-wrap{display:inline-flex;align-items:center;gap:.6rem;background:var(--gold-soft);border:1px solid rgba(163,123,56,.32);padding:.4rem 1rem;border-radius:100px;margin-bottom:2.2rem}
.kicker-dot{width:6px;height:6px;background:var(--gold);border-radius:50%;animation:kdot 2.4s infinite}
@keyframes kdot{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(163,123,56,.45)}50%{opacity:.4;box-shadow:0 0 0 5px rgba(163,123,56,0)}}
.kicker-txt{font-family:var(--mono);font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold-d)}
h1{font-family:var(--serif);font-size:clamp(2.6rem,4.6vw,4.35rem);line-height:1.04;letter-spacing:-.025em;color:var(--blue-d);margin-bottom:1.7rem;font-weight:700;text-wrap:balance}
h1 .italic{font-style:italic;color:var(--gold-d);font-weight:400}
h1 .answer{display:block;font-style:italic;color:var(--gold);font-weight:400}
.hero-bridge{font-size:1.05rem;color:var(--mid);line-height:1.85;max-width:470px;margin-bottom:2.4rem;font-weight:400}
.hero-bridge strong{color:var(--ink);font-weight:700}
.hero-acts{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;margin-bottom:2.8rem}
.trust-row{display:flex;align-items:center;gap:1.4rem;padding-top:1.6rem;border-top:1px solid var(--line);flex-wrap:wrap}
.trust-item{font-family:var(--mono);font-size:.6rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.tdiv{width:1px;height:.9rem;background:var(--line)}

/* HERO book on light */
.hero-r{display:flex;align-items:center;justify-content:center;padding:4rem 4rem 4rem 1rem;position:relative;z-index:2}
.book-stage{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.5rem}
.book-glow{position:absolute;top:12%;width:300px;height:380px;background:radial-gradient(ellipse,rgba(163,123,56,.22) 0%,transparent 70%);filter:blur(34px);pointer-events:none}
.book-outer{position:relative;z-index:2;animation:bookFloat 7s ease-in-out infinite;cursor:pointer}
@keyframes bookFloat{0%,100%{transform:perspective(900px) rotateY(-11deg) rotateX(3deg) translateY(0)}50%{transform:perspective(900px) rotateY(-11deg) rotateX(3deg) translateY(-14px)}}
.book-outer:hover{animation-play-state:paused}
.book-cover-wrap{position:relative;width:230px}
.book-img{width:230px;height:auto;display:block;border-radius:3px 8px 8px 3px;box-shadow:-8px 0 0 rgba(41,74,112,.1),-15px 0 0 rgba(41,74,112,.05),0 40px 70px -20px rgba(41,74,112,.42);border:1px solid var(--line)}
.book-pages{position:absolute;right:-5px;top:3px;bottom:3px;width:10px;background:repeating-linear-gradient(to bottom,#efe8d6 0,#efe8d6 2px,#d8ceb4 2px,#d8ceb4 3px);border-radius:0 4px 4px 0;opacity:.9}
.crc-float{position:absolute;bottom:-14px;right:-16px;z-index:3;background:var(--gold);color:#fff;font-family:var(--mono);font-size:.56rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;padding:.5rem .9rem;border-radius:5px;box-shadow:0 12px 26px -10px rgba(163,123,56,.6)}
.book-details{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;max-width:300px}
.book-detail-pill{font-family:var(--mono);font-size:.56rem;letter-spacing:.08em;color:var(--mid);background:var(--white);border:1px solid var(--line);padding:.34rem .72rem;border-radius:100px;white-space:nowrap}
.click-hint{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-d);display:flex;align-items:center;gap:.5rem;cursor:pointer;animation:hintPulse 2.4s ease-in-out infinite}
.click-hint::before{content:"\25B2";font-size:.5rem}
@keyframes hintPulse{0%,100%{opacity:.55}50%{opacity:1}}

/* ---- MARQUEE (navy strip, inverts the Bold theme's gold) ---- */
.marquee{background:var(--blue-d);padding:.68rem 0;overflow:hidden;white-space:nowrap}
.mq-inner{display:inline-flex;animation:mq 60s linear infinite}
.mq-item{font-family:var(--mono);font-size:.66rem;color:rgba(233,226,213,.82);letter-spacing:.12em;text-transform:uppercase;padding:0 2rem;font-weight:500}
.mq-star{color:var(--gold-l);opacity:.7}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---- section headings ---- */
.sec-kicker{font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-d);margin-bottom:1rem}
.sec-h{font-family:var(--serif);font-size:clamp(2.1rem,3.9vw,3.15rem);line-height:1.08;letter-spacing:-.022em;color:var(--blue-d);font-weight:700;text-wrap:balance}
.sec-h em{font-style:italic;color:var(--gold-d)}
.sec-desc{font-size:1.02rem;color:var(--mid);line-height:1.8;margin-top:1.1rem;font-weight:400}

/* ---- PROBLEM (white) ---- */
.sec-problem{background:var(--white);padding:8rem 2rem}
.prob-hdr{text-align:center;max-width:760px;margin:0 auto}

/* ---- BRIDGE (the one dark navy moment up top) ---- */
.sec-bridge{background:var(--blue-d);padding:7rem 2rem;text-align:center;overflow:hidden}
.sec-bridge::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 60% 85% at 50% 45%,rgba(163,123,56,.14) 0%,transparent 62%)}
.bridge-inner{max-width:760px;margin:0 auto;position:relative;z-index:1}
.bridge-kicker{font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-l);margin-bottom:1.1rem}
.bridge-h{font-family:var(--serif);font-size:clamp(2.1rem,4vw,3.3rem);line-height:1.08;letter-spacing:-.022em;color:#fff;font-weight:700;margin-bottom:1.5rem;text-wrap:balance}
.bridge-h em{font-style:italic;color:var(--gold-l)}
.bridge-p{font-size:1.05rem;color:rgba(233,226,213,.72);line-height:1.9;font-weight:300;margin-bottom:2.6rem;max-width:660px;margin-inline:auto}
.bridge-p strong{color:#fff;font-weight:600}

/* ---- SOLUTION (paper) ---- */
.sec-solution{background:var(--paper);padding:8rem 2rem;display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,6vw,6.5rem);align-items:center;max-width:var(--wrap);margin-inline:auto!important}
.sol-book{display:flex;justify-content:center;align-items:center;position:relative;cursor:pointer}
.sol-ring{position:absolute;width:380px;height:380px;border:1px solid rgba(163,123,56,.2);border-radius:50%}
.sol-ring2{position:absolute;width:300px;height:300px;border:1px dashed rgba(41,74,112,.14);border-radius:50%}
.sol-img-wrap{position:relative;z-index:2}
.sol-img{width:225px;height:auto;display:block;border-radius:3px 9px 9px 3px;box-shadow:-6px 0 0 rgba(41,74,112,.1),-12px 0 0 rgba(41,74,112,.05),24px 38px 58px -22px rgba(41,74,112,.4);transform:perspective(800px) rotateY(-7deg);transition:transform .5s;border:1px solid var(--line)}
.sol-book:hover .sol-img{transform:perspective(800px) rotateY(-1deg)}
.sol-pages{position:absolute;right:-4px;top:3px;bottom:3px;width:9px;background:repeating-linear-gradient(to bottom,#efe8d6 0,#efe8d6 2px,#d8ceb4 2px,#d8ceb4 3px);border-radius:0 3px 3px 0;opacity:.9}
.chip{position:absolute;z-index:3;background:var(--white);border:1px solid var(--line);border-radius:100px;padding:.5rem .95rem;font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);box-shadow:0 12px 28px -12px rgba(41,74,112,.35);white-space:nowrap;animation:chipf 5.5s ease-in-out infinite}
.chip-a{top:6%;right:-6px}.chip-b{bottom:16%;left:-18px;animation-delay:1.8s}.chip-c{top:52%;right:-24px;animation-delay:3.4s}
@keyframes chipf{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.sol-info{display:flex;flex-direction:column;gap:1.4rem}
.sol-kicker{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-d);display:flex;align-items:center;gap:.7rem}
.sol-kicker::before{content:"";width:1.5rem;height:1px;background:var(--gold)}
.sol-h{font-family:var(--serif);font-size:clamp(1.9rem,3.3vw,2.85rem);line-height:1.1;letter-spacing:-.02em;color:var(--blue-d);font-weight:700}
.sol-h em{font-style:italic;color:var(--gold-d)}
.sol-p{font-size:1rem;color:var(--mid);line-height:1.85;font-weight:400}
.sol-p em{color:var(--ink);font-style:italic}
.checklist{display:flex;flex-direction:column;gap:.85rem;margin-top:.3rem}
.ci{display:flex;align-items:flex-start;gap:.9rem}
.ci-icon{width:24px;height:24px;min-width:24px;background:var(--gold-soft);border:1px solid rgba(163,123,56,.32);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.72rem;color:var(--gold-d);margin-top:.1rem;font-weight:700}
.ci-text{font-size:.96rem;color:var(--mid);line-height:1.6;font-weight:400}
.ci-text strong{color:var(--ink);font-weight:600}
.rel-badge{display:inline-flex;align-items:center;gap:.75rem;background:var(--gold-soft);border:1px solid rgba(163,123,56,.24);padding:.7rem 1.15rem;border-radius:6px;width:fit-content}
.rel-dot{width:7px;height:7px;background:var(--gold);border-radius:50%;animation:pulse 2s infinite;flex-shrink:0}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.rel-txt{font-family:var(--mono);font-size:.62rem;color:var(--gold-d);letter-spacing:.05em}
.sol-acts{display:flex;gap:1rem;flex-wrap:wrap;margin-top:.5rem}

/* ---- BENEFITS (white cards on cream) ---- */
.sec-benefits{background:var(--cream);padding:8rem 2rem}
.ben-hdr{max-width:var(--wrap);margin:0 auto 3.8rem}
.ben-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;max-width:var(--wrap);margin:0 auto}
.ben-card{background:var(--white);border-radius:10px;padding:2.4rem;border:1px solid var(--line);display:flex;gap:1.3rem;align-items:flex-start;transition:box-shadow .35s,transform .35s}
.ben-card:hover{box-shadow:0 22px 46px -24px rgba(41,74,112,.35);transform:translateY(-4px)}
.ben-n{font-family:var(--serif);font-size:2.1rem;font-weight:900;color:rgba(163,123,56,.3);line-height:.9;min-width:2.4rem}
.ben-title{font-family:var(--serif);font-size:1.15rem;font-weight:700;color:var(--blue-d);margin-bottom:.5rem}
.ben-desc{font-size:.9rem;color:var(--mid);line-height:1.7;font-weight:400}
.ben-desc em{color:var(--gold-d);font-style:italic}

/* ---- AUTHOR (LIGHT: bordered portrait, navy text) ---- */
.sec-author{background:var(--white);padding:7rem 2rem;overflow:hidden}
.sec-author::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 55% 60% at 50% 12%,var(--gold-soft) 0%,transparent 60%);pointer-events:none;opacity:.6}
.author-inner{max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.25rem;position:relative;z-index:1}
.author-photo-circle-box{width:200px;height:200px;border-radius:50%;overflow:hidden;border:4px solid var(--white);box-shadow:0 0 0 2px var(--gold),0 0 0 11px var(--gold-soft),0 24px 50px -18px rgba(41,74,112,.4);flex-shrink:0}
.author-photo-circle-box img{width:100%;height:100%;object-fit:cover;object-position:center 15%;display:block}
.author-photo-circle-box.no-photo{display:flex;align-items:center;justify-content:center;background:linear-gradient(150deg,var(--blue),var(--blue-d))}
.author-photo-circle-box.no-photo::after{content:"JLB";font-family:var(--serif);font-weight:900;font-size:3.4rem;color:var(--gold-l);letter-spacing:.03em}
.author-kicker{font-family:var(--mono);font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-d);margin-top:.4rem}
.author-name{font-family:var(--serif);font-size:1.85rem;font-weight:700;color:var(--blue-d);line-height:1.1}
.author-title{font-size:.9rem;color:var(--gold-d);font-weight:500}
.author-p{font-size:.98rem;color:var(--mid);line-height:1.85;font-weight:400;max-width:620px}
.author-p em{color:var(--gold-d);font-style:italic}
.author-stat-row{display:flex;align-items:center;gap:2rem;padding:1.1rem 1.8rem;border:1px solid var(--line);border-radius:10px;background:var(--paper);margin-top:.5rem}
.a-stat{display:flex;flex-direction:column;align-items:center;gap:.15rem}
.a-stat-n{font-family:var(--serif);font-size:1.6rem;font-weight:900;color:var(--gold-d);line-height:1}
.a-stat-l{font-family:var(--mono);font-size:.54rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.a-stat-div{width:1px;height:2rem;background:var(--line)}
.author-creds{display:flex;flex-direction:column;gap:.5rem;text-align:left;max-width:620px;margin-top:.6rem;width:100%}
.cred-item{display:flex;align-items:flex-start;gap:.7rem;font-size:.85rem;color:var(--mid);line-height:1.55;font-weight:400}
.cred-item::before{content:"";width:.65rem;height:1px;background:var(--gold);margin-top:.65rem;flex-shrink:0}
.cred-item em{color:var(--gold-d);font-style:italic}
.author-quote{font-family:var(--serif);font-size:1.15rem;font-style:italic;color:var(--blue-d);border-left:2px solid var(--gold);padding-left:1.3rem;text-align:left;max-width:620px;margin-top:.8rem;align-self:flex-start;width:100%}

/* ---- NEWSLETTER (paper card, navy form) ---- */
.sec-signup{background:var(--paper-2);padding:5.5rem 2rem}
.nl-wrap{max-width:var(--wrap);margin:0 auto;display:flex;gap:3.5rem;align-items:center;flex-wrap:wrap;justify-content:space-between;background:var(--white);border:1px solid var(--line);border-radius:16px;padding:3rem 3.2rem;box-shadow:0 26px 55px -34px rgba(41,74,112,.4)}
.nl-copy{flex:1;min-width:280px}
.nl-kicker{font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-d);margin-bottom:.7rem}
.nl-h{font-family:var(--serif);font-size:clamp(1.5rem,2.4vw,2rem);font-weight:700;color:var(--blue-d);line-height:1.12;letter-spacing:-.015em}
.nl-h-em{font-style:italic;color:var(--gold-d);font-weight:400}
.nl-p{font-size:.92rem;color:var(--mid);line-height:1.7;font-weight:400;margin-top:.9rem;max-width:440px}
.nl-right{min-width:320px;flex:1;max-width:460px}
.nl-form{display:flex;gap:.5rem}
.nl-input{flex:1;padding:.9rem 1.1rem;background:var(--paper);border:1.5px solid var(--line);border-radius:6px;color:var(--ink);font-family:var(--sans);font-size:.9rem;outline:none;transition:border-color .2s}
.nl-input::placeholder{color:var(--muted)}
.nl-input:focus{border-color:var(--gold)}
.nl-btn{background:var(--gold);color:#fff;font-family:var(--sans);font-weight:600;font-size:.88rem;padding:.9rem 1.5rem;border:none;border-radius:6px;cursor:pointer;white-space:nowrap;transition:filter .2s,transform .2s}
.nl-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.nl-success{display:none;padding:.95rem 1.1rem;background:rgba(63,143,87,.1);border:1px solid rgba(63,143,87,.4);border-radius:6px;color:#2c7a44;font-size:.85rem;line-height:1.6}
.nl-success.show{display:block}
.nl-success strong{color:#236b39}
.nl-note{font-family:var(--mono);font-size:.56rem;letter-spacing:.06em;color:var(--muted);margin-top:.8rem}

/* ---- TASTE / YOUTUBE (white) ---- */
.sec-taste{background:var(--white);padding:7rem 2rem;display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(3rem,5vw,5.5rem);align-items:center;max-width:var(--wrap);margin-inline:auto!important}
.taste-kicker{font-family:var(--mono);font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-d);margin-bottom:.9rem}
.taste-h{font-family:var(--serif);font-size:clamp(1.9rem,3.3vw,2.85rem);line-height:1.1;letter-spacing:-.02em;color:var(--blue-d);font-weight:700}
.taste-h em{font-style:italic;color:var(--gold-d)}
.taste-p{font-size:.96rem;color:var(--mid);line-height:1.8;margin-top:1rem;font-weight:400;max-width:440px}
.yt-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.5rem 0}
.yt-tag{font-family:var(--mono);font-size:.58rem;letter-spacing:.06em;color:var(--gold-d);background:var(--gold-soft);border:1px solid rgba(163,123,56,.24);padding:.34rem .7rem;border-radius:100px}
.yt-actions{display:flex;gap:.8rem;flex-wrap:wrap;align-items:center}
.yt-btn{display:inline-flex;align-items:center;gap:.6rem;background:#fff;border:1.5px solid rgba(214,48,49,.35);color:var(--ink);font-family:var(--sans);font-weight:600;font-size:.9rem;padding:.85rem 1.6rem;border-radius:6px;transition:background .25s,transform .25s,border-color .25s}
.yt-btn:hover{color:var(--ink);background:rgba(214,48,49,.06);transform:translateY(-2px);border-color:rgba(214,48,49,.6)}
.yt-play{color:#d63031;font-size:.8rem}
.yt-embed{border-radius:12px;overflow:hidden;box-shadow:0 30px 60px -28px rgba(41,74,112,.5);border:1px solid var(--line)}
.yt-embed iframe{width:100%;aspect-ratio:16/9;display:block;border:none}

/* ---- PUZZLE (paper, white card) ---- */
.sec-puzzle{background:var(--paper);padding:8rem 2rem}
.puz-inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,5vw,5.5rem);align-items:center;max-width:var(--wrap);margin:0 auto}
.pz-kicker{font-family:var(--mono);font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-d);margin-bottom:.9rem}
.pz-h{font-family:var(--serif);font-size:clamp(1.9rem,3.3vw,2.85rem);line-height:1.1;letter-spacing:-.02em;color:var(--blue-d);font-weight:700}
.pz-h em{font-style:italic;color:var(--gold-d)}
.pz-p{font-size:.98rem;color:var(--mid);line-height:1.8;margin-top:1rem;font-weight:400}
.pz-p strong{color:var(--ink);font-weight:600}
.pw{background:var(--white);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 26px 52px -28px rgba(41,74,112,.45)}
.pw-top{padding:.9rem 1.4rem;border-bottom:1px solid var(--line);background:var(--paper);display:flex;align-items:center;justify-content:space-between}
.pw-title{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-d)}
.diff{font-family:var(--mono);font-size:.58rem;color:var(--blue);border:1px solid rgba(41,74,112,.25);padding:.16rem .5rem;border-radius:4px}
.pw-body{padding:1.6rem}
.pq{font-size:.95rem;color:var(--ink);line-height:1.7;margin-bottom:1.3rem}
.pq strong{color:var(--blue-d);font-weight:600}
.choices{display:flex;flex-direction:column;gap:.5rem}
.cb{background:var(--paper);border:1px solid var(--line);color:var(--mid);font-family:var(--sans);font-size:.9rem;padding:.8rem 1.05rem;border-radius:7px;text-align:left;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:.7rem}
.cb:hover:not(.answered){border-color:rgba(163,123,56,.5);color:var(--ink);background:var(--gold-soft)}
.cb.correct{border-color:var(--green);color:#2c7a44;background:rgba(63,143,87,.09)}
.cb.wrong{border-color:#c0504d;color:#b0433f;background:rgba(192,80,77,.06)}
.cl{font-family:var(--mono);font-size:.64rem;color:var(--gold-d);min-width:1rem;font-weight:500}
.pfb{margin-top:.9rem;padding:.85rem 1.05rem;border-radius:7px;font-size:.85rem;line-height:1.65;display:none}
.pfb.show{display:block}
.pfb-ok{background:rgba(63,143,87,.09);border:1px solid rgba(63,143,87,.3);color:#2c7a44}
.pfb-ok em{color:var(--gold-d);font-style:italic}
.pfb-no{background:rgba(192,80,77,.06);border:1px solid rgba(192,80,77,.28);color:#a8433f}

/* ---- CTA (dark navy finish) ---- */
.sec-cta{background:var(--blue-d);padding:8.5rem 2rem;text-align:center;overflow:hidden}
.sec-cta::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 65% 80% at 50% 45%,rgba(163,123,56,.14) 0%,transparent 60%)}
.cta-inner{max-width:720px;margin:0 auto;position:relative;z-index:1}
.cta-kicker{font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-l);margin-bottom:1.1rem}
.cta-h{font-family:var(--serif);font-size:clamp(2.2rem,4.2vw,3.4rem);line-height:1.07;letter-spacing:-.022em;color:#fff;font-weight:700;margin-bottom:1.3rem;text-wrap:balance}
.cta-h em{font-style:italic;color:var(--gold-l)}
.cta-p{font-size:1.02rem;color:rgba(233,226,213,.68);line-height:1.85;font-weight:300;margin-bottom:2.6rem;max-width:600px;margin-inline:auto}
.cta-p em{color:#fff;font-style:italic}
.cta-acts{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.cta-note{font-family:var(--mono);font-size:.58rem;letter-spacing:.06em;color:rgba(233,226,213,.34);margin-top:1.6rem}

/* ---- FOOTER (deep navy) ---- */
footer{background:var(--blue-d);border-top:1px solid rgba(255,255,255,.08);padding:3.5rem 2rem 3rem;display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center}
.fl{font-family:var(--sans);font-weight:800;font-size:1.55rem;letter-spacing:-.02em}
.fl-m{color:#fff}.fl-t{color:var(--gold-l)}.fl-d{color:rgba(255,255,255,.3);font-size:1.05rem;font-weight:500}
.f-sub{font-family:var(--mono);font-size:.62rem;letter-spacing:.07em;color:rgba(233,226,213,.42)}
.f-links{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center;margin:.3rem 0}
.f-links a{font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(233,226,213,.58)}
.f-links a:hover{color:var(--gold-l)}
.f-tl{font-family:var(--mono);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-l);opacity:.75}
.f-copy{font-family:var(--mono);font-size:.58rem;letter-spacing:.05em;color:rgba(233,226,213,.32)}

/* ---- TOC MODAL (kept dark for focus/legibility) ---- */
.toc-overlay{position:fixed;inset:0;background:rgba(13,20,32,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);z-index:500;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s;padding:2rem}
.toc-overlay.open{opacity:1;pointer-events:all}
.toc-modal{background:var(--blue-d);border:1px solid rgba(163,123,56,.24);border-radius:14px;max-width:940px;width:100%;max-height:88vh;overflow:hidden;display:flex;flex-direction:column;transform:scale(.95) translateY(24px);transition:transform .45s cubic-bezier(.2,.8,.2,1);box-shadow:0 50px 90px -30px rgba(0,0,0,.7)}
.toc-overlay.open .toc-modal{transform:none}
.toc-header{display:grid;grid-template-columns:auto 1fr auto;gap:1.5rem;align-items:center;padding:1.4rem 1.8rem;border-bottom:1px solid rgba(163,123,56,.16);background:rgba(163,123,56,.05)}
.toc-book-mini{display:flex;align-items:center;gap:1rem}
.toc-book-img{width:54px;height:auto;border-radius:2px 5px 5px 2px;box-shadow:-3px 0 0 rgba(0,0,0,.4),0 6px 16px -6px rgba(0,0,0,.6);border:1px solid rgba(163,123,56,.3)}
.toc-book-title{font-family:var(--serif);font-size:1rem;font-weight:700;color:#fff;line-height:1.2}
.toc-book-sub{font-family:var(--mono);font-size:.58rem;letter-spacing:.06em;color:rgba(233,226,213,.5);margin-top:.25rem}
.toc-isbn-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.45rem}
.toc-isbn-pill{font-family:var(--mono);font-size:.52rem;letter-spacing:.05em;color:var(--gold-l);background:rgba(163,123,56,.1);border:1px solid rgba(163,123,56,.2);padding:.2rem .55rem;border-radius:100px;white-space:nowrap}
.toc-heading{font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-l);text-align:center}
.toc-close{width:38px;height:38px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.9rem;color:rgba(255,255,255,.6);cursor:pointer;transition:all .2s;flex-shrink:0}
.toc-close:hover{background:rgba(163,123,56,.22);border-color:var(--gold-l);color:var(--gold-l)}
.toc-body{overflow-y:auto;flex:1;padding:1.6rem 1.8rem}
.toc-body::-webkit-scrollbar{width:5px}
.toc-body::-webkit-scrollbar-thumb{background:rgba(163,123,56,.35);border-radius:3px}
.toc-chapters{display:flex;flex-direction:column;gap:.45rem}
.ch-header{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.85rem 1.1rem;border-radius:8px;cursor:pointer;transition:background .2s,border-color .2s;border:1px solid transparent}
.ch-header:hover{background:rgba(163,123,56,.07);border-color:rgba(163,123,56,.14)}
.ch-header.active{background:rgba(163,123,56,.11);border-color:rgba(163,123,56,.28)}
.ch-left{display:flex;align-items:center;gap:1rem;flex:1}
.ch-num{font-family:var(--mono);font-size:.62rem;color:var(--gold-l);min-width:2rem;font-weight:500}
.ch-title{font-family:var(--serif);font-size:1.05rem;font-weight:700;color:#fff}
.ch-arrow{font-size:.7rem;color:rgba(233,226,213,.4);transition:transform .3s}
.ch-header.active .ch-arrow{transform:rotate(180deg);color:var(--gold-l)}
.ch-content{display:none;padding:.3rem 1.1rem .8rem}
.ch-content.open{display:block;animation:fadeUp .4s ease}
.ch-sections{display:grid;grid-template-columns:1fr 1fr;gap:.35rem;margin-bottom:1rem}
.ch-section{font-family:var(--sans);font-size:.85rem;color:rgba(233,226,213,.6);padding:.4rem .65rem;border-radius:5px;display:flex;align-items:center;gap:.55rem;transition:color .2s,background .2s}
.ch-section:hover{color:var(--gold-l);background:rgba(163,123,56,.07)}
.ch-section-num{font-family:var(--mono);font-size:.6rem;color:rgba(163,123,56,.5);min-width:1.9rem}
.ch-challenge{background:rgba(255,255,255,.03);border:1px solid rgba(163,123,56,.2);border-radius:8px;padding:1.1rem 1.2rem;margin-top:.4rem}
.chal-label{font-family:var(--mono);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold-l);margin-bottom:.7rem;display:flex;align-items:center;gap:.5rem}
.chal-label::before{content:"\2234";font-size:.85rem}
.chal-q{font-size:.9rem;color:#fff;line-height:1.65;margin-bottom:.9rem}
.chal-q em{color:var(--gold-l);font-style:normal;font-family:var(--mono)}
.chal-choices{display:flex;flex-direction:column;gap:.4rem}
.chal-btn{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);color:rgba(233,226,213,.75);font-family:var(--sans);font-size:.85rem;padding:.6rem .9rem;border-radius:6px;text-align:left;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:.6rem}
.chal-btn:hover:not(.answered){border-color:rgba(163,123,56,.4);color:#fff;background:rgba(163,123,56,.08)}
.chal-btn.correct{border-color:var(--green);color:#7fd196;background:rgba(63,143,87,.1)}
.chal-btn.wrong{border-color:#c0504d;color:#e08a87;background:rgba(192,80,77,.08)}
.chal-letter{font-family:var(--mono);font-size:.62rem;color:var(--gold-l);min-width:.9rem}
.chal-fb{margin-top:.7rem;padding:.75rem .9rem;border-radius:6px;font-size:.82rem;line-height:1.6;display:none}
.chal-fb.show{display:block}
.chal-fb-ok{background:rgba(63,143,87,.1);border:1px solid rgba(63,143,87,.3);color:#7fd196}
.chal-fb-no{background:rgba(192,80,77,.08);border:1px solid rgba(192,80,77,.28);color:#e08a87}
.chal-reset{font-family:var(--mono);font-size:.6rem;letter-spacing:.06em;background:transparent;border:1px solid rgba(163,123,56,.3);color:var(--gold-l);padding:.35rem .8rem;border-radius:5px;cursor:pointer;transition:all .2s;margin-top:.6rem;display:none}
.chal-reset.show{display:inline-block}
.chal-reset:hover{border-color:var(--gold-l);background:rgba(163,123,56,.12)}
.pz-reset{color:var(--gold-d);border-color:rgba(163,123,56,.4)}
.pz-reset:hover{background:var(--gold-soft)}
.toc-appendix{margin-top:1.2rem;border-top:1px solid rgba(255,255,255,.08);padding-top:1.2rem}
.app-title{font-family:var(--mono);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(233,226,213,.45);margin-bottom:.7rem}
.app-items{display:grid;grid-template-columns:1fr 1fr;gap:.35rem}
.app-item{font-size:.82rem;color:rgba(233,226,213,.5);padding:.3rem .5rem;display:flex;align-items:center;gap:.5rem}
.app-item::before{content:"\00A7";font-family:var(--mono);font-size:.62rem;color:rgba(163,123,56,.4)}

/* ---- load-in animation ---- */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.ai{animation:fadeUp .8s ease both}
.d1{animation-delay:.05s}.d2{animation-delay:.22s}.d3{animation-delay:.4s}.d4{animation-delay:.58s}

/* ---- Responsive ---- */
@media(max-width:960px){
  .hero{grid-template-columns:1fr}
  .hero-r{display:none}
  .hero-l{padding:6.5rem 1.6rem 4rem}
  .sec-solution,.sec-taste,.puz-inner{grid-template-columns:1fr;gap:3rem}
  .sol-book{order:-1}
  .ben-grid{grid-template-columns:1fr}
  .nav-r{gap:1rem}.nav-link{display:none}
  nav{padding:.9rem 1.4rem}
  .sec-problem,.sec-bridge,.sec-solution,.sec-benefits,.sec-author,.sec-signup,.sec-taste,.sec-puzzle,.sec-cta{padding-left:1.6rem;padding-right:1.6rem}
  .sec-problem,.sec-benefits,.sec-puzzle{padding-top:5rem;padding-bottom:5rem}
  .nl-wrap{gap:2rem;padding:2.2rem 1.8rem}
  .toc-header{grid-template-columns:1fr auto;gap:1rem}
  .toc-book-mini{display:none}
  .ch-sections,.app-items{grid-template-columns:1fr}
  .author-quote{align-self:center;text-align:center;border-left:none;border-top:2px solid var(--gold);padding:1rem 0 0}
}
@media(max-width:600px){
  html{font-size:14px}
  .author-stat-row{flex-wrap:wrap;gap:1rem;justify-content:center}
  .a-stat-div{display:none}
  .nl-form{flex-direction:column}
  .hero-acts{flex-direction:column;align-items:stretch}
  .btn-gold,.btn-ghost{justify-content:center}
}
