:root{
--text-xs:clamp(.75rem,.7rem + .25vw,.875rem);--text-sm:clamp(.875rem,.8rem + .35vw,1rem);--text-base:clamp(1rem,.95rem + .25vw,1.125rem);--text-lg:clamp(1.125rem,1rem + .75vw,1.5rem);--text-xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem);--text-2xl:clamp(2rem,1.2rem + 2.5vw,3.5rem);
--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;
--color-bg:#F6F5F1;--color-surface:#FFFFFF;--color-ink:#18201F;--color-muted:#55605F;--color-line:#D9DCD8;
--color-deep:#073F44;--color-primary:#0B5C63;--color-primary-hover:#084A50;--color-tint:#E4EFEF;--color-on-deep:#E3F0F1;--color-on-deep-muted:#A9CFD2;
--radius-sm:.375rem;--radius-md:.5rem;--radius-lg:.75rem;
--font-body:'Inter','Helvetica Neue',sans-serif;--font-serif:'Source Serif 4',Georgia,serif;
--t:180ms cubic-bezier(.16,1,.3,1)}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:none;text-size-adjust:none;-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:var(--space-16)}
body{min-height:100dvh;line-height:1.6;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-ink);background:var(--color-bg)}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{text-wrap:balance;line-height:1.15}
p,li{text-wrap:pretty}
a{color:var(--color-primary);transition:color var(--t),background var(--t),border-color var(--t)}
:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm)}
@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;scroll-behavior:auto!important}}
.wrap{width:min(100% - 2*var(--space-5),1120px);margin-inline:auto}
.narrow{max-width:720px}
.top{position:sticky;top:0;z-index:10;background:color-mix(in oklab,var(--color-bg) 90%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--color-line)}
.top-in{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-3)}
.brand{font-weight:700;font-size:var(--text-sm);color:var(--color-deep);text-decoration:none}
.brand span{font-weight:500;color:var(--color-muted)}
.btn{display:inline-block;background:var(--color-primary);color:#fff;font-weight:600;font-size:var(--text-sm);text-decoration:none;padding:var(--space-3) var(--space-6);border-radius:var(--radius-md);text-align:center}
.btn:hover{background:var(--color-primary-hover)}
.btn-sm{padding:var(--space-2) var(--space-4)}
.btn-block{display:block;width:100%}
.btn[aria-disabled=true]{opacity:.55;cursor:not-allowed}
.link{font-weight:600;font-size:var(--text-sm)}
.hero{padding-block:clamp(var(--space-12),7vw,var(--space-24))}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(var(--space-8),6vw,var(--space-20));align-items:center}
.kicker{font-size:var(--text-xs);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--color-primary);margin-bottom:var(--space-4)}
h1{font-size:var(--text-2xl);font-weight:700;letter-spacing:-.02em;color:var(--color-deep);margin-bottom:var(--space-5)}
.lede{font-family:var(--font-serif);font-size:var(--text-lg);line-height:1.5;color:var(--color-muted);max-width:34ch;margin-bottom:var(--space-8)}
.hero-cta{display:flex;flex-wrap:wrap;gap:var(--space-6);align-items:center;margin-bottom:var(--space-10)}
.facts{list-style:none;display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-8);font-size:var(--text-sm);color:var(--color-muted);border-top:1px solid var(--color-line);padding-top:var(--space-5)}
.facts strong{color:var(--color-deep);font-size:var(--text-lg);margin-right:var(--space-1)}
.hero-book img{width:min(100%,380px);margin-inline:auto;border-radius:var(--radius-sm);box-shadow:0 2px 4px rgb(7 63 68/.15),0 24px 48px rgb(7 63 68/.22);transform:rotate(-1.5deg)}
.band{background:var(--color-deep);color:var(--color-on-deep);padding-block:clamp(var(--space-12),6vw,var(--space-20))}
.band h2{font-size:var(--text-xl);color:#fff;margin-bottom:var(--space-5)}
.band p{font-family:var(--font-serif);font-size:var(--text-base);max-width:62ch;margin-bottom:var(--space-4)}
.band p:last-child{color:#fff;font-weight:600;margin-bottom:0}
section.why,section.inside,section.who,section.buy,section.author,section.faq{padding-block:clamp(var(--space-12),6vw,var(--space-20))}
.sec{font-size:var(--text-xl);color:var(--color-deep);margin-bottom:var(--space-8);letter-spacing:-.01em}
.center{text-align:center}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-5)}
.stat{background:var(--color-surface);border:1px solid var(--color-line);border-radius:var(--radius-lg);padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-3)}
.stat .num{font-size:var(--text-xl);font-weight:700;color:var(--color-primary);line-height:1}
.stat p{font-size:var(--text-sm);color:var(--color-ink)}
.cite{margin-top:auto;font-size:var(--text-xs);color:var(--color-muted)}
.cite:hover{color:var(--color-primary)}
.note{margin-top:var(--space-8);font-family:var(--font-serif);font-size:var(--text-base);color:var(--color-muted)}
.inside{background:var(--color-surface);border-block:1px solid var(--color-line)}
.inside-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(var(--space-8),5vw,var(--space-16));align-items:start}
.parts{list-style:none;display:flex;flex-direction:column}
.parts li{display:grid;grid-template-columns:5.5rem 1fr;gap:var(--space-4);padding-block:var(--space-5);border-top:1px solid var(--color-line)}
.parts li:last-child{border-bottom:1px solid var(--color-line)}
.parts span{font-size:var(--text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--color-primary);padding-top:var(--space-1)}
.parts h3{font-size:var(--text-lg);margin-bottom:var(--space-1)}
.parts p{font-size:var(--text-sm);color:var(--color-muted)}
.pages{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);position:sticky;top:var(--space-20)}
.pages img{border:1px solid var(--color-line);border-radius:var(--radius-sm);box-shadow:0 10px 24px rgb(7 63 68/.1)}
.pages figcaption{font-size:var(--text-xs);color:var(--color-muted);margin-top:var(--space-2)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(var(--space-8),5vw,var(--space-16))}
.ticks{list-style:none;display:flex;flex-direction:column;gap:var(--space-3)}
.ticks li{position:relative;padding-left:var(--space-6)}
.ticks li::before{content:"";position:absolute;left:0;top:.6em;width:.6rem;height:2px;background:var(--color-primary)}
.buy{background:var(--color-tint)}
.plans{display:grid;grid-template-columns:repeat(2,minmax(0,340px));justify-content:center;gap:var(--space-6)}
.plan{background:var(--color-surface);border:1px solid var(--color-line);border-radius:var(--radius-lg);padding:var(--space-8);display:flex;flex-direction:column;gap:var(--space-3)}
.plan-featured{border:2px solid var(--color-primary)}
.plan h3{font-size:var(--text-lg)}
.tag{font-size:var(--text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--color-primary)}
.price{font-size:var(--text-2xl);font-weight:700;color:var(--color-deep);line-height:1}
.plan-desc{font-size:var(--text-sm);color:var(--color-muted);margin-bottom:var(--space-3);flex:1}
.secure,.pending{text-align:center;font-size:var(--text-xs);color:var(--color-muted);margin:var(--space-6) auto 0;max-width:60ch}
.pending{color:var(--color-primary);font-weight:600;margin-top:var(--space-2)}
.author p{font-family:var(--font-serif);font-size:var(--text-base)}
.faq{background:var(--color-surface);border-top:1px solid var(--color-line)}
details{border-top:1px solid var(--color-line);padding-block:var(--space-4)}
details:last-child{border-bottom:1px solid var(--color-line)}
summary{cursor:pointer;font-weight:600;list-style-position:outside}
details p{margin-top:var(--space-2);color:var(--color-muted)}
.foot{background:var(--color-deep);color:var(--color-on-deep-muted);font-size:var(--text-xs);padding-block:var(--space-10)}
.foot p{max-width:80ch;margin-bottom:var(--space-3)}
@media (max-width:900px){.stats{grid-template-columns:1fr 1fr}.inside-grid{grid-template-columns:1fr}.pages{position:static}}
@media (max-width:720px){
.hero-grid{grid-template-columns:1fr}.hero-book{order:-1}.hero-book img{width:min(62%,260px)}
.two{grid-template-columns:1fr}.plans{grid-template-columns:1fr}.brand span{display:none}
.stats{grid-template-columns:1fr}.parts li{grid-template-columns:1fr;gap:var(--space-1)}}