body{margin:0;font-family:system-ui;background:#090b12;color:#eee}header{display:flex;justify-content:space-between;align-items:center;padding:20px 8%}.logo{width:64px}nav a{color:#ccc;margin-left:20px;text-decoration:none}.hero{text-align:center;padding:100px 8%}h1{font-size:3rem}.btn{display:inline-block;background:#8b5cf6;color:#fff;padding:14px 28px;border-radius:10px;text-decoration:none}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;padding:60px 8%}.grid div{background:#141824;padding:24px;border-radius:16px}footer{text-align:center;padding:40px;color:#888}@media(max-width:700px){h1{font-size:2.2rem}header{flex-direction:column}}