body { margin: 0; background: #0a0a0a; color: #fff; font-family: Inter, sans-serif; }
.hero { height: 100vh; display: flex; align-items: center; justify-content: center; position: relative; }
.hero-bg { position: absolute; top:0; left:0; width: 100%; height: 100%; background: url('hero-background.jpg') center/cover; animation: pan 20s infinite alternate; }
@keyframes pan { from { transform: scale(1); } to { transform: scale(1.05); } }
.content { z-index: 2; text-align: center; }
.btn { background: #00d4ff; padding: 15px 30px; text-decoration: none; color: #000; border-radius: 5px; }
.cards { display: flex; gap: 20px; justify-content: center; padding: 50px; background: #111; }
.card { padding: 30px; background: #222; border-radius: 8px; }