:root{--paper:#fafaf5;--ink:#163027;--muted:#4f5d52;--line:#d7ddd0;--lime:#d0f38b;--card:#fffef9}
@media(prefers-color-scheme:dark){:root{--paper:#101a16;--ink:#eef3ea;--muted:#aebbb0;--line:#2a3a33;--card:#16231e}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.65 'DM Sans',system-ui,sans-serif}
.wrap{width:min(720px,100% - 32px);margin:0 auto}
header{padding:22px 0;border-bottom:1px solid var(--line)}
header .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;width:min(960px,100% - 32px)}
.brand{font:600 24px 'Outfit',sans-serif;letter-spacing:-1px;color:inherit;text-decoration:none;display:inline-flex;gap:8px;align-items:center;min-height:44px}
.brand svg{width:26px;height:22px;fill:currentColor}
nav a{color:var(--muted);text-decoration:none;margin-left:18px;display:inline-block;padding:10px 0;min-height:44px}
nav a:hover{color:var(--ink)}
a{color:var(--ink);text-underline-offset:3px}
a:focus-visible{outline:3px solid #7a5cc4;outline-offset:3px;border-radius:3px}
main{padding:56px 0 80px}
h1{font:500 clamp(36px,6vw,56px)/1.05 'Outfit',sans-serif;letter-spacing:-2px;margin:0 0 12px}
h2{font:500 24px/1.25 'Outfit',sans-serif;letter-spacing:-.5px;margin:40px 0 8px}
.meta{color:var(--muted);margin:0 0 32px}
p,li{max-width:68ch}li{margin:6px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin:16px 0}
.card b{display:block;font:500 13px 'DM Sans';letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.card a,.card span{font-size:22px;font-family:'Outfit',sans-serif}
footer{border-top:1px solid var(--line);padding:28px 0 48px;color:var(--muted);font-size:15px}
footer .wrap{width:min(960px,100% - 32px)}footer a{color:var(--muted);margin-right:18px;display:inline-block;padding:10px 0;min-height:44px}