@font-face{font-family:Bangers;src:url(fonts/Bangers-Regular.ttf) format("truetype");font-display:swap}
@font-face{font-family:Anton;src:url(fonts/Anton-Regular.ttf) format("truetype");font-display:swap}
@font-face{font-family:"Archivo Black";src:url(fonts/ArchivoBlack-Regular.ttf) format("truetype");font-display:swap}
@font-face{font-family:Oswald;src:url(fonts/Oswald-VariableFont_wght.ttf) format("truetype");font-weight:200 700;font-display:swap}
:root{--gold:#F2A51C;--teal:#16A0A6;--violet:#4E2E74;--ink:#141116;--cream:#F3E9D2;--paper:#F7F0E0}
*{box-sizing:border-box}
body{margin:0;font-family:Oswald,system-ui,sans-serif;font-weight:600;font-size:1.15rem;line-height:1.55;color:var(--ink);background:var(--cream) radial-gradient(rgba(20,17,22,.07) 1.2px,transparent 1.3px) 0 0/14px 14px}
a{color:var(--ink);text-decoration-thickness:2px}
h1,h2,.bangers{font-family:Bangers,Impact,sans-serif;font-weight:400;letter-spacing:.03em;text-transform:uppercase;line-height:1}
.wrap{max-width:64rem;margin:0 auto;padding:0 1.1rem}
.top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 0}
.top img{height:56px;width:auto}
.hero{padding:1.5rem 0 2.5rem;text-align:center}
.hero h1{font-size:clamp(3rem,13vw,6.5rem);margin:.2em 0}
.hero h1 .a{color:var(--gold);-webkit-text-stroke:2px var(--ink);text-shadow:4px 4px 0 var(--ink)}
.hero h1 .b{color:var(--teal);-webkit-text-stroke:2px var(--ink);text-shadow:4px 4px 0 var(--ink)}
.hero h1 .d{color:var(--violet)}
.lede{max-width:40rem;margin:0 auto;font-size:1.25rem;background:var(--paper);border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:1rem 1.2rem;border-radius:.6rem}
.split{height:14px;background:linear-gradient(90deg,var(--gold) 50%,var(--teal) 50%);border-block:3px solid var(--ink)}
.chip{font-family:"Archivo Black",sans-serif;display:inline-block;font-size:.9rem;padding:.25rem .7rem;border:3px solid var(--ink);border-radius:999px;background:var(--paper);text-decoration:none;margin:.2rem}
.chip.a{background:var(--gold)}.chip.b{background:var(--teal)}
.btn{font-family:"Archivo Black",sans-serif;display:inline-block;padding:.8rem 1.3rem;margin:.35rem;border:3px solid var(--ink);border-radius:.6rem;box-shadow:4px 4px 0 var(--ink);text-decoration:none;background:var(--paper)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
section{padding:2.2rem 0}
h2{font-size:clamp(2.2rem,8vw,3.4rem);margin:0 0 1rem}
.grid{display:grid;grid-template-columns:1fr;gap:1.1rem}
@media(min-width:720px){.grid{grid-template-columns:1fr 1fr 1fr}.grid.two{grid-template-columns:1fr 1fr}}
.card{background:var(--paper);border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);border-radius:.6rem;padding:1.2rem}
.card h3{font-family:Anton,sans-serif;font-weight:400;font-size:1.6rem;margin:0 0 .4rem;letter-spacing:.02em}
.card.a{border-top:12px solid var(--gold)}.card.b{border-top:12px solid var(--teal)}.card.n{border-top:12px solid var(--violet)}
.race ul{list-style:none;padding:0;margin:.4rem 0}.race li{padding:.3rem 0;border-bottom:2px dashed rgba(20,17,22,.25)}
.todo{font-family:"Archivo Black",sans-serif;font-size:.85rem;color:var(--violet);background:#fff;border:2px dashed var(--violet);padding:.4rem .6rem;border-radius:.4rem;display:inline-block;margin-top:.5rem}
.thumb{width:100%;height:auto;border:3px solid var(--ink);border-radius:.6rem;box-shadow:6px 6px 0 var(--ink);display:block}
.ink{background:var(--ink);color:var(--cream)}.ink a{color:var(--cream)}
footer{padding:2rem 0;text-align:center;font-size:1rem}
.doc{max-width:46rem}.doc h2{font-size:2.2rem;margin-top:2rem;border-left:10px solid var(--teal);padding-left:.6rem}
.doc h1{font-size:clamp(2.6rem,10vw,4rem)}
.ink .chip,.ink a.chip{color:var(--ink);background:var(--paper)}
