*{box-sizing:border-box}
body{margin:0;font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
color:#222;background:#fafaf7}
a{color:var(--accent)}
header,main,footer{max-width:760px;margin:0 auto;padding:0 20px}
header{display:flex;justify-content:space-between;align-items:center;padding-top:28px;padding-bottom:28px}
header .brand{font-weight:700;font-size:20px;text-decoration:none;color:#222}
nav a{margin-left:18px;text-decoration:none}
.hero{padding:40px 0 24px;border-top:4px solid var(--accent)}
.hero h1{font-size:32px;line-height:1.25;margin:0 0 12px}
.card{padding:18px 0;border-bottom:1px solid #e6e4dc}
.card h2{font-size:20px;margin:0 0 6px}
footer{padding-top:40px;padding-bottom:40px;color:#777;font-size:14px}