:root{
  --accent:#00FF66; /* pick ONE: #0066FF (blue) | #FF3131 (red) | #00FF66 (green) */
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#fff;color:#000;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,sans-serif;line-height:1.45}
.container{max-width:1080px;margin:0 auto;padding:24px}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;border-top:2px solid #000;border-left:2px solid #000;margin-top:24px}
.grid > div{border-right:2px solid #000;border-bottom:2px solid #000;padding:24px}
.header{display:flex;justify-content:space-between;align-items:center;border:2px solid #000;margin:24px 0;padding:16px}
.brand{font-weight:900;font-size:28px;letter-spacing:-0.02em}
.nav a{margin-left:16px;text-decoration:underline;color:#000}
.hero{border:2px solid #000;padding:48px;margin:24px 0}
.hero h1{font-size:48px;margin:0 0 8px 0;letter-spacing:-0.03em}
.hero p{max-width:48ch}
.btn{display:inline-block;border:2px solid #000;padding:14px 18px;text-decoration:none;color:#000;font-weight:800;text-transform:uppercase;letter-spacing:0.06em}
.btn:hover{background:#000;color:#fff}
.badge{display:inline-block;border:2px solid #000;padding:6px 10px;font-weight:800}
.accent{color:var(--accent)}
hr{border:0;border-top:2px solid #000;margin:24px 0}
.footer{display:flex;justify-content:space-between;align-items:center;border:2px solid #000;margin:24px 0;padding:16px}
