:root{--bg:#f6f4ef;--fg:#16262a;--muted:#5b6b6e;--card:#fff;--line:#e2ddd2;--accent:#1f7a68}
@media(prefers-color-scheme:dark){:root{--bg:#0e1a1d;--fg:#eaf1ef;--muted:#92a5a6;--card:#14262a;--line:#223a3f;--accent:#7fd1b9}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.55 system-ui,-apple-system,sans-serif}
main{max-width:760px;margin:0 auto;padding:64px 16px}
h1{font-size:clamp(2.2rem,8vw,3.6rem);line-height:1.05;margin:0 0 12px;letter-spacing:-.02em}
.lede{color:var(--muted);font-size:1.1rem;margin:0 0 40px}
.grid{display:grid;gap:12px}
.card{display:block;padding:16px 18px;background:var(--card);border:1px solid var(--line);border-radius:12px;color:inherit;text-decoration:none}
.card h2{margin:0 0 2px;font-size:1.05rem}
.card p{margin:0;color:var(--muted);font-size:.95rem}
a.card:hover{border-color:var(--accent)}
.hero{padding:22px 22px;margin-bottom:28px;border-width:2px}
.hero h2{font-size:1.35rem;margin:4px 0 6px}
.section{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 10px}
.tag{font-size:.75rem;color:var(--accent);text-transform:uppercase;letter-spacing:.06em}
footer{margin-top:48px;color:var(--muted);font-size:.85rem}
