*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--ink:#121930;--wool:#1B2546;--chalk:#ECEFF3;--tape:#F2C230;--mute:#5F6880;--serif:'Bodoni Moda',Didot,'Times New Roman',serif;--sans:'Hanken Grotesk',system-ui,sans-serif;--g:clamp(16px,4vw,64px)}
body{background:var(--chalk);color:var(--ink);font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px dashed var(--ink);outline-offset:4px}
header{background-color:var(--wool);background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 1px,transparent 1px 6px);color:var(--chalk);padding:20px var(--g) 72px}
header nav{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:72px}
header :focus-visible{outline-color:var(--tape)}
.brand{text-decoration:none;display:flex;align-items:baseline;gap:10px}
.brand b{font:500 30px/1 var(--serif);letter-spacing:-.02em}
.brand span{font-size:13px;opacity:.7}
.back{font-size:15px;text-decoration:none;border-bottom:1.5px dashed currentColor}
h1{font:400 clamp(48px,8vw,120px)/.95 var(--serif);letter-spacing:-.04em}
main{padding:72px var(--g) 120px;max-width:calc(68ch + 2*var(--g))}
h2{font:400 clamp(26px,2.6vw,34px)/1.15 var(--serif);margin:48px 0 12px}
h2:first-child{margin-top:0}
p,ul{margin-bottom:14px}
ul{padding-left:1.2em}
mark{background:var(--tape);color:var(--ink);padding:0 .25em}
.note{font-size:14px;color:var(--mute)}
footer{border-top:1.5px dashed rgba(18,25,48,.25);margin:0 var(--g);padding:24px 0 40px;font-size:14px;color:var(--mute);display:flex;flex-wrap:wrap;gap:16px 24px}
