*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:#0e1116;color:#dfe4ea;line-height:1.55}
header{display:flex;align-items:center;justify-content:space-between;padding:20px 32px;border-bottom:1px solid #1e2530}
.brand{font-weight:600;font-size:17px;letter-spacing:.2px}
nav a{color:#9aa5b1;text-decoration:none;margin-left:24px;font-size:14px}
nav a:hover{color:#dfe4ea}
main{max-width:760px;margin:0 auto;padding:64px 24px}
.hero h1{font-size:28px;font-weight:600;margin-bottom:16px}
.hero p{color:#9aa5b1;margin-bottom:12px;max-width:560px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.cards article{background:#151a22;border:1px solid #1e2530;border-radius:10px;padding:20px}
.cards h2{font-size:15px;margin-bottom:8px}
.cards p{color:#8891a0;font-size:13px}
footer{text-align:center;color:#5b6472;font-size:12px;padding:32px;border-top:1px solid #1e2530}
@media (max-width:640px){.cards{grid-template-columns:1fr}}