:root { --ground:#f6f5f3; --surface:#fff; --ink:#161616; --muted:#6d6d6d; --line:#e3e1de; --accent:#d7262e; --accent-dark:#a51b22; --nav:#161616;
  --display:"Barlow Semi Condensed","Arial Narrow",sans-serif; --body:"Source Sans 3",system-ui,sans-serif; color-scheme:light; }
* { box-sizing:border-box; } html,body { margin:0; }
body { background:var(--ground); color:var(--ink); font:17px/1.6 var(--body); }
a { color:var(--accent-dark); }
.wrap { max-width:820px; margin:0 auto; padding:0 20px; }
.bar { background:var(--nav); } .bar .wrap { max-width:1120px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:12px; padding-bottom:12px; }
.bar img { display:block; width:96px; height:auto; background:#fff; border-radius:8px; padding:6px 8px; }
.bar nav { display:flex; gap:22px; flex-wrap:wrap; } .bar nav a { color:#fff; font-weight:600; text-decoration:none; }
main .wrap { background:var(--surface); border:1px solid var(--line); border-radius:14px; margin-top:32px; margin-bottom:32px; padding:36px 40px; }
h1,h2 { font-family:var(--display); line-height:1.1; } h1 { font-size:44px; margin:0 0 4px; } h2 { font-size:24px; margin:30px 0 8px; }
.date { color:var(--muted); margin:0 0 20px; } ul { padding-left:22px; } li { margin:4px 0; }
footer { padding:0 0 40px; color:var(--muted); font-size:15px; } footer .wrap { display:flex; gap:20px; flex-wrap:wrap; } footer a { color:var(--muted); }
@media (max-width:640px) { main .wrap { padding:24px 20px; margin-top:16px; border-radius:0; border-left:0; border-right:0; } h1 { font-size:36px; } .bar nav { gap:14px; font-size:15px; } }