*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Poppins,sans-serif;background:#050505;color:#fff}
nav{position:fixed;top:0;width:100%;padding:20px 8%;display:flex;justify-content:space-between;background:rgba(0,0,0,.35);backdrop-filter:blur(10px);z-index:99}
nav a{color:#fff;text-decoration:none;margin-left:20px}
.hero{height:100vh;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden}
.bg{position:absolute;inset:0;background:radial-gradient(circle at top,#7c3aed55,transparent 45%),radial-gradient(circle at bottom,#2563eb44,transparent 40%)}
.content{position:relative;text-align:center;z-index:2}
h1{font-size:clamp(60px,10vw,130px);text-transform:uppercase;letter-spacing:10px;animation:fade 1.4s,glow 3s infinite}
p{margin:20px 0;color:#d1d5db}
.btn{display:inline-block;padding:14px 30px;border-radius:40px;background:#7c3aed;color:#fff;text-decoration:none;margin:8px;transition:.3s}
.btn:hover{transform:translateY(-3px)}
.outline{background:transparent;border:1px solid #7c3aed}
.section{padding:100px 10%;text-align:center}
input,textarea{width:min(500px,100%);display:block;margin:12px auto;padding:12px;background:#111;border:1px solid #333;color:#fff;border-radius:8px}
textarea{height:140px}
button{border:none;cursor:pointer}
.particles::before,.particles::after{content:"";position:absolute;width:6px;height:6px;background:#fff;border-radius:50%;box-shadow:20vw 30vh #fff,40vw 80vh #fff,70vw 20vh #fff,85vw 65vh #fff,10vw 70vh #fff;animation:float 14s linear infinite;opacity:.5}
@keyframes float{from{transform:translateY(100vh)}to{transform:translateY(-120vh)}}
@keyframes glow{50%{text-shadow:0 0 20px #fff,0 0 60px #7c3aed}}
@keyframes fade{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}