
:root{
  --bg:#ffffff; --tint:#f3f4fa; --card:#ffffff; --ink:#0d1a33; --muted:#4a5672; --rule:#dfe2ee;
  --navy:#0c1433; --on-navy:#f7f8fc; --on-navy-muted:#c3cbe0; --navy-rule:#2c3a6a;
  --gold:#e5b81f; --gold-ink:#7d5f00; --on-gold:#0d1a33;
  --serif:"Source Serif 4", "Source Serif Pro", Georgia, serif;
  --sans:"Source Sans 3", "Source Sans Pro", system-ui, -apple-system, "Segoe UI", sans-serif;
  --wrap:1160px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0a1022; --tint:#0e1630; --card:#131d3b; --ink:#eaeef7; --muted:#aab3ca; --rule:#26325a;
  --navy:#0a1029; --gold:#f0c63a; --gold-ink:#f0c63a; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0a1022; --tint:#0e1630; --card:#131d3b; --ink:#eaeef7; --muted:#aab3ca; --rule:#26325a;
  --navy:#0a1029; --gold:#f0c63a; --gold-ink:#f0c63a; color-scheme:dark}
*{box-sizing:border-box}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.7 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
a{color:var(--gold-ink)}
a:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:3px}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.2;margin:0;text-wrap:balance;letter-spacing:-.01em}
.btn{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(110deg,#f2bf2e 0%,#f2bf2e 40%,#fff0b0 50%,#f2bf2e 60%,#e3a816 100%);background-size:260% 100%;animation:sweep 4.5s ease-in-out infinite;color:var(--on-gold);border-radius:3px;padding:12px 20px;font:700 .95rem var(--sans);text-decoration:none;white-space:nowrap}
@keyframes sweep{0%,55%{background-position:100% 0}100%{background-position:0% 0}}
.band{background:radial-gradient(55% 75% at 8% 12%,rgba(58,110,255,.55),transparent 62%),radial-gradient(50% 70% at 92% 18%,rgba(165,80,225,.5),transparent 62%),radial-gradient(60% 80% at 72% 100%,rgba(18,190,170,.42),transparent 62%),var(--navy);color:var(--on-navy)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:#0b1336}
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:linear-gradient(90deg,#0b1336,#1a1446 55%,#0b2234);color:var(--on-navy);border-bottom:1px solid rgba(255,255,255,.08)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:14px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--on-navy)}
.seal{width:42px;height:42px;border-radius:50%;border:1.5px solid #f2c230;box-shadow:inset 0 0 0 3px #0b1336,inset 0 0 0 4px #f2c230;display:grid;place-items:center;font:700 .72rem var(--sans);letter-spacing:.06em;color:#f2c230;flex:none}
.bname{display:grid;line-height:1.15}
.bname b{font:700 1.28rem/1.1 "Cinzel", Georgia, serif;letter-spacing:.06em;color:#f2c230;background:linear-gradient(180deg,#fff1b8 0%,#f2c230 60%,#d9a10f 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.bname small{font:400 .78rem/1.3 "Jost", var(--sans);letter-spacing:.03em;white-space:nowrap;color:var(--on-navy-muted);margin-top:3px}
nav{display:flex;gap:22px}
nav a{color:var(--on-navy-muted);text-decoration:none;font:600 .92rem var(--sans);white-space:nowrap}
nav a:hover,nav a[aria-current]{color:var(--on-navy)}
@media (max-width:1180px){nav{display:none}}
@media (max-width:460px){.bname small{display:none}.top .btn{padding:10px 14px;font-size:.85rem}}
.hero{padding-block:clamp(48px,7vw,88px)}
.hero .crumbs{font:600 .85rem var(--sans);color:var(--on-navy-muted)}
.hero .crumbs a{color:var(--on-navy-muted);text-decoration:none}
.hero .tag{display:inline-block;margin-top:18px;font:700 .75rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#ffd25a}
.hero h1{font-size:clamp(2.1rem,4.6vw,3.3rem);margin-top:12px;max-width:22ch}
.hero .by{margin-top:18px;color:var(--on-navy-muted);font-size:.95rem}
.hero .by b{color:var(--on-navy)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,320px);gap:clamp(32px,5vw,72px);padding-block:clamp(48px,6vw,80px);align-items:start}
@media (max-width:900px){.layout{grid-template-columns:1fr}}
article{max-width:68ch;min-width:0}
article .dek{font:500 1.25rem/1.55 var(--serif);color:var(--ink);margin:0 0 8px}
article h2{font-size:1.6rem;margin:2.2em 0 .6em;padding-top:.2em}
article h2::before{content:"";display:block;width:44px;height:4px;margin-bottom:14px;background:var(--accent)}
article p{margin:0 0 1em;color:var(--ink)}
article ul,article ol{margin:0 0 1.2em;padding-left:1.3em;display:grid;gap:.45em}
article li::marker{color:var(--accent)}
.tablewrap{overflow-x:auto;margin:1em 0 1.4em;border:1px solid var(--rule);border-radius:4px}
table{border-collapse:collapse;width:100%;min-width:520px;font-size:.95rem}
th,td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--rule)}
thead th{background:var(--tint);font-weight:700}
tbody td:first-child{font-weight:600}
.note{margin-top:2.4em;padding:18px 20px;background:var(--tint);border-left:4px solid var(--accent);font-size:.92rem;color:var(--muted)}
aside.side{position:sticky;top:96px;display:grid;gap:22px}
@media (max-width:900px){aside.side{position:static}}
.cta{background:var(--card);border:1px solid var(--rule);border-top:5px solid;border-image:linear-gradient(90deg,#3a6eff,#9d5cf0,#e8477f,#f5c542,#14b8a6) 1;padding:24px;display:grid;gap:12px}
.cta .eyebrow{font:700 .74rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink)}
.cta .price{font:600 2.6rem/1 var(--serif)}
.cta p{margin:0;color:var(--muted);font-size:.95rem}
.more{display:grid;gap:0;border-top:2px solid var(--ink)}
.more h3{font:700 .78rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:14px 0 6px}
.more a{display:block;padding:12px 0;border-bottom:1px solid var(--rule);color:var(--ink);text-decoration:none;font-weight:600;line-height:1.4}
.more a:hover{color:var(--gold-ink)}
footer{background:#070d22;color:#c3cbe0;font-size:.86rem;padding-block:32px}
footer .wrap{display:grid;gap:8px}
footer strong,footer a{color:#f7f8fc}
@media (prefers-reduced-motion:reduce){.btn{animation:none}}
