:root { --paper:#eaf0ee; --surface:#fff; --ink:#12302d; --muted:#566e69; --line:#c6d5d1; --accent:#f2b705; --accent-ink:#12302d; --good:#1d8656;
  --font-display:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif; --font-body:"Atkinson Hyperlegible",system-ui,-apple-system,sans-serif; --font-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace; }
@media (prefers-color-scheme: dark) { :root { --paper:#0e1b1a; --surface:#152725; --ink:#e3eeeb; --muted:#94aaa5; --line:#2a413e; --accent:#f5c234; --good:#4cc38a; color-scheme:dark; } }
* { box-sizing:border-box; }
html { color-scheme:light; }
body { margin:0; background:var(--paper); color:var(--ink); font:17px/1.6 var(--font-body);
  padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px)); padding-block:20px 48px; }
img { max-width:100%; }
a { color:inherit; text-decoration-color:var(--accent); text-decoration-thickness:2px; text-underline-offset:3px; }
a:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.wrap { max-width:860px; margin:0 auto; display:grid; gap:24px; }
.top { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 20px; }
.brand { font:800 1.7rem/1 var(--font-display); text-decoration:none; letter-spacing:-.02em; }
.brand span { background:var(--accent); color:var(--accent-ink); padding:0 .15em; border-radius:4px; }
nav.links { display:flex; flex-wrap:wrap; gap:6px 16px; font-weight:700; font-size:.95rem; }
nav.links a { text-decoration:none; }
nav.links a:hover, nav.links a[aria-current] { text-decoration:underline; text-decoration-color:var(--accent); }
.card { background:var(--surface); border:1.5px solid var(--ink); border-radius:14px; padding:clamp(18px, 4vw, 32px); display:grid; gap:14px; min-width:0; }
h1 { font:800 clamp(2rem, 6vw, 2.8rem)/1.08 var(--font-display); margin:0; text-wrap:balance; }
h2 { font:800 1.4rem/1.2 var(--font-display); margin:8px 0 0; text-wrap:balance; }
p, li { max-width:68ch; }
p { margin:0; }
.eyebrow { font:500 .75rem var(--font-mono); letter-spacing:.1em; color:var(--muted); text-transform:uppercase; }
.flag-hero { width:min(100%, 360px); aspect-ratio:4/3; border-radius:10px; box-shadow:0 0 0 1px var(--line), 0 10px 22px rgba(0,0,0,.18); display:block; }
.facts { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:10px; margin:0; }
.facts div { border:1px solid var(--line); border-radius:10px; padding:10px 14px; }
.facts dt { font:500 .72rem var(--font-mono); letter-spacing:.08em; color:var(--muted); text-transform:uppercase; }
.facts dd { margin:2px 0 0; font-weight:700; font-size:1.1rem; }
.fact { border:1.5px dashed var(--ink); border-radius:12px; padding:14px 16px; background:var(--paper); }
.fact b { color:var(--good); }
.cta { display:inline-block; font-weight:700; text-decoration:none; background:var(--accent); color:var(--accent-ink); border:1.5px solid var(--ink); border-radius:10px; padding:11px 18px; justify-self:start; }
.grid { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); gap:8px; }
.grid a { display:flex; align-items:center; gap:10px; padding:8px 10px; border:1px solid var(--line); border-radius:8px; text-decoration:none; font-weight:700; min-width:0; }
.grid a:hover { border-color:var(--ink); }
.grid img { width:32px; aspect-ratio:4/3; border-radius:3px; box-shadow:0 0 0 1px var(--line); flex:none; }
.ad { display:grid; gap:4px; }
.ad-label { font:500 .65rem var(--font-mono); letter-spacing:.1em; color:var(--muted); text-transform:uppercase; }
footer { display:grid; gap:6px; justify-items:center; text-align:center; padding-top:12px; border-top:1.5px solid var(--ink); font-size:.85rem; color:var(--muted); }
footer .sig { font:800 1.1rem var(--font-display); color:var(--ink); }
footer .sig span { background:var(--accent); color:var(--accent-ink); padding:0 .2em; border-radius:4px; }
footer nav { display:flex; flex-wrap:wrap; gap:4px 14px; justify-content:center; }
