:root{
  --navy:#14284A; --navy-2:#1d3762; --gold:#D4A017; --gold-dark:#A87C0E; --gold-soft:#F2DC96;
  --cream:#F4ECD8; --paper:#FBF8F1; --ink:#1B2433; --sub:#4A5568; --line:#E3DCC8;
  --green:#3F8F4F; --green-pale:#E4F1E6;
  --serif:Cambria,Caladea,Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 var(--sans);-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy);text-underline-offset:3px}
a:hover{color:var(--gold-dark)}
h1,h2,h3{font-family:var(--serif);color:var(--navy);line-height:1.2;margin:0 0 .5em}
h1{font-size:clamp(2rem,5vw,3rem)}
h2{font-size:clamp(1.5rem,3.4vw,2rem)}
h3{font-size:1.2rem}
p{margin:0 0 1em}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
.narrow{max-width:760px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:10}

/* header */
.site-header{background:var(--navy);border-bottom:3px solid var(--gold)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px;flex-wrap:wrap}
.brand img{height:46px;width:auto}
.nav{display:flex;gap:22px;flex-wrap:wrap}
.nav a{color:var(--cream);text-decoration:none;font-size:.95rem;letter-spacing:.02em}
.nav a:hover,.nav a[aria-current=page]{color:var(--gold)}

/* hero */
.hero{background:linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 100%);color:var(--cream);padding:72px 0 80px;text-align:center}
.hero .mark{width:84px;margin:0 auto 22px}
.hero h1{color:var(--cream)}
.hero .tagline{font-family:var(--serif);font-style:italic;color:var(--gold);font-size:clamp(1.15rem,2.6vw,1.45rem);margin-bottom:18px}
.hero p.lead{max-width:640px;margin:0 auto;color:#DCE3EE;font-size:1.08rem}

section{padding:64px 0}
section.alt{background:var(--cream)}
.eyebrow{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-dark);font-weight:600;margin-bottom:8px}

/* book card */
.book{display:grid;grid-template-columns:240px 1fr;gap:40px;align-items:start}
.book img{border-radius:4px;box-shadow:0 10px 30px rgba(20,40,74,.25)}
.book .subtitle{font-family:var(--serif);font-style:italic;color:var(--sub);font-size:1.1rem;margin-top:-6px}
.badge{display:inline-block;background:var(--green-pale);color:var(--green);border:1px solid #C3E0C9;border-radius:999px;padding:3px 12px;font-size:.82rem;font-weight:600;margin-bottom:14px}
ul.checks{list-style:none;padding:0;margin:0 0 1.2em}
ul.checks li{padding-left:28px;position:relative;margin-bottom:6px}
ul.checks li:before{content:"";position:absolute;left:4px;top:.55em;width:10px;height:10px;background:var(--gold);transform:rotate(45deg)}
.btn{display:inline-block;background:var(--navy);color:var(--cream);text-decoration:none;padding:11px 20px;border-radius:6px;font-weight:600;font-size:.95rem}
.btn:hover{background:var(--navy-2);color:var(--gold)}
.btn.ghost{background:transparent;color:var(--navy);border:1.5px solid var(--navy)}
.btn.ghost:hover{background:var(--navy);color:var(--cream)}
.actions{display:flex;gap:12px;flex-wrap:wrap}

blockquote.story{margin:1.5em 0 0;padding:20px 24px;background:#fff;border-left:4px solid var(--gold);border-radius:4px;font-family:var(--serif);font-size:1.08rem}

/* toolkit */
.page-head{background:var(--navy);color:var(--cream);padding:44px 0 40px;border-bottom:6px solid var(--green)}
.page-head h1{color:var(--cream);margin-bottom:.2em}
.page-head p{color:#DCE3EE;margin:0;max-width:680px}
.page-head .eyebrow{color:var(--gold)}
.toc{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.toc a{color:var(--cream);border:1px solid rgba(244,236,216,.45);border-radius:999px;padding:5px 14px;text-decoration:none;font-size:.9rem}
.toc a:hover{border-color:var(--gold);color:var(--gold)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.card{background:#fff;border:1px solid var(--line);border-radius:8px;padding:20px}
.card h3{margin-bottom:.3em}
.card p{color:var(--sub);font-size:.95rem;margin-bottom:.6em}
.soon{font-size:.8rem;font-weight:600;color:var(--gold-dark);letter-spacing:.04em;text-transform:uppercase}
ol.refs{padding-left:0;list-style:none;margin:0}
ol.refs li{padding:14px 0;border-bottom:1px solid var(--line)}
ol.refs .key{font-weight:700;color:var(--navy)}
ol.refs .cite{font-size:.95rem}
ol.refs .note{font-size:.9rem;color:var(--sub);margin-top:4px}
ol.refs a{word-break:break-word}
.note-box{background:#fff;border:1px solid var(--line);border-left:4px solid var(--green);border-radius:6px;padding:16px 20px;margin:0 0 24px}
.article h2{margin-top:1.6em}.article h3{margin-top:1.4em}
.article ul{padding-left:1.2em}.article li{margin-bottom:.5em}
.article ol li{margin-bottom:.6em;word-break:break-word}
.muted{color:var(--sub);font-size:.92rem}

/* toolkits hub */
.page-head.gold{border-bottom-color:var(--gold)}
.tk-list{display:grid;gap:18px}
a.tk{display:grid;grid-template-columns:96px 1fr;gap:22px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px;text-decoration:none;color:var(--ink);transition:box-shadow .15s,border-color .15s}
a.tk:hover{border-color:var(--gold);box-shadow:0 8px 24px rgba(20,40,74,.12);color:var(--ink)}
a.tk img{border-radius:3px;box-shadow:0 4px 12px rgba(20,40,74,.25)}
a.tk h3{margin:.1em 0 .1em;font-size:1.4rem}
a.tk .sub{font-family:var(--serif);font-style:italic;color:var(--sub);margin-bottom:.5em}
a.tk p{margin-bottom:.5em}
a.tk .go{color:var(--navy);font-weight:600}

/* footer */
.site-footer{background:var(--navy);color:#C9D2E0;padding:36px 0;font-size:.88rem;border-top:3px solid var(--gold)}
.site-footer a{color:var(--cream)}
.site-footer .row{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-start}
.site-footer img{height:34px;width:auto;margin-bottom:10px}
.site-footer p{margin:0 0 .5em;max-width:560px}

@media (max-width:720px){
  .book{grid-template-columns:1fr}
  .book img{max-width:220px}
  section{padding:48px 0}
  .hero{padding:56px 0 60px}
  .site-header .wrap{justify-content:center;padding-top:10px;padding-bottom:10px}
}
@media print{
  .site-header,.site-footer,.toc,.hero .mark{display:none}
  body{background:#fff;font-size:11pt}
  .page-head{background:#fff;color:#000;border:0;padding:0}
  .page-head h1,.page-head p{color:#000}
  a{color:#000}
}