:root{--bg:#05010a;--accent:#ff00cf;--cyan:#22e8ee;--text:#fff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#fff;font-family:system-ui,sans-serif}
.hero{min-height:100vh;position:relative;background:url('assets/hero-bg.jpg') center/cover}
.overlay{position:absolute;inset:0;background:rgba(0,0,0,.55)}
nav,.hero-content{position:relative;z-index:2}
nav{padding:2rem}.logo{width:min(420px,70vw)}
.hero-content{min-height:80vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2rem}
h1{font-size:clamp(2.5rem,7vw,5rem)}
.buttons{display:flex;gap:1rem;flex-wrap:wrap}
.btn{padding:1rem 1.5rem;border-radius:999px;text-decoration:none;background:var(--accent);color:#fff}
.btn-outline{background:transparent;border:2px solid var(--cyan)}
.container{max-width:1000px;margin:auto;padding:4rem 1.5rem}
footer{text-align:center;padding:2rem;opacity:.7}