body{margin:0;font-family:Arial;background:#0c0c0c;color:#fff}
header{position:fixed;width:100%;top:0;padding:20px;background:#000;display:flex;justify-content:space-between}
nav a{color:#ccc;margin-left:20px;text-decoration:none}
.hero{height:100vh;background:url('https://images.unsplash.com/photo-1503387762-592deb58ef4e') center/cover;display:flex;align-items:center;padding:40px}
.btn{background:#ffb400;color:#000;padding:12px 20px;border-radius:6px;text-decoration:none}
section{padding:100px 40px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.card{background:#161616;padding:20px;border-radius:10px}
img{width:100%;border-radius:10px;margin-top:10px}
.fade{opacity:0;transform:translateY(40px);transition:0.7s}
.fade.show{opacity:1;transform:translateY(0)}