*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Arial;background:#0f0f10;color:#fff}
header{background:radial-gradient(circle at top,#2d1a00,#111 60%);padding-bottom:60px}
.nav{max-width:1200px;margin:auto;padding:20px;display:flex;justify-content:space-between;align-items:center}
.brand{font-weight:700;color:#ff9800;font-size:24px}.cta{text-decoration:none;color:#fff;border:1px solid #ff9800;padding:10px 18px;border-radius:30px}
.hero{max-width:900px;margin:auto;text-align:center;padding:30px 20px}
.logo{width:220px;animation:spin 25s linear infinite;filter:drop-shadow(0 0 20px rgba(255,152,0,.4))}
h1{font-size:48px;margin:20px 0;color:#fff}h2{text-align:center;color:#ff9800}
p{color:#d0d0d0;line-height:1.7}.buttons{margin-top:30px}
.btn{display:inline-block;padding:14px 28px;margin:8px;border-radius:30px;border:2px solid #ff9800;color:#fff;text-decoration:none}
.orange{background:#ff9800;color:#111;font-weight:700}
section{max-width:1200px;margin:auto;padding:70px 20px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px;margin-top:30px}
.card{background:#1b1b1d;border:1px solid #303030;border-radius:16px;padding:25px;text-align:center;transition:.3s}
.card:hover{transform:translateY(-6px);border-color:#ff9800}
.alt{background:#171717;max-width:none}.badges{text-align:center}.badges span{display:inline-block;margin:8px;padding:12px 18px;background:#222;border-radius:25px;border:1px solid #333}
.cta-section{text-align:center}.cta-section .btn{margin-top:20px}
footer{text-align:center;padding:35px;color:#888;border-top:1px solid #222}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}