:root{--bg:#fbfaf6;--ink:#23301f;--mute:#667060;--line:#dfe3d6;--acc:#4f7a3a}
*{box-sizing:border-box}body{margin:0;font:18px/1.7 "Segoe UI",Roboto,system-ui,sans-serif;background:var(--bg);color:var(--ink)}
header,main,footer{max-width:720px;margin:0 auto;padding:0 22px}
header{padding-top:30px;padding-bottom:16px;display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--line)}
.logo{font-size:24px;font-weight:600;color:var(--acc);text-decoration:none}
nav a{margin-left:20px;color:var(--mute);text-decoration:none;font-size:15px}nav a:hover,nav a.on{color:var(--acc)}
h1{font-size:32px;line-height:1.25;margin:34px 0 8px}h2{font-size:21px;margin:30px 0 6px}
p{margin:0 0 15px}.meta{color:var(--mute);font-size:14px;margin-bottom:20px}.lead{font-size:20px;color:var(--mute)}
article{padding:18px 0;border-bottom:1px solid var(--line)}article h2{margin:0 0 4px}article a{color:var(--ink);text-decoration:none}article a:hover{color:var(--acc)}
ul{padding-left:20px}li{margin-bottom:6px}
footer{margin-top:46px;padding-top:16px;padding-bottom:36px;border-top:2px solid var(--line);color:var(--mute);font-size:14px}
a{color:var(--acc)}
@media(max-width:540px){header{flex-direction:column;align-items:flex-start;gap:8px}nav a{margin:0 16px 0 0}h1{font-size:27px}}