@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700&family=Manrope:wght@400;700;800&display=swap');
*{box-sizing:border-box}body{margin:0;background:#05082a;color:#fff;font-family:Manrope,sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 70% 20%,#ffe50033,transparent 30%),linear-gradient(#05082a,#03051a);z-index:-2}
.noise{position:fixed;inset:0;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:40px 40px;z-index:-1}
header{width:min(1200px,92%);margin:25px auto;padding:18px 25px;background:#090d35cc;border:1px solid #ffffff18;border-radius:24px;display:flex;justify-content:space-between;align-items:center;backdrop-filter:blur(15px)}
.logo{font-family:"Space Grotesk";font-size:24px;font-weight:700}
nav{display:flex;gap:12px}nav a{background:#fff;border-radius:14px;width:45px;height:45px;display:grid;place-items:center;transition:.3s}
nav a:hover{transform:translateY(-5px) rotate(5deg)}nav img{width:24px;height:24px}
main{width:min(1200px,92%);margin:auto}.hero{display:grid;grid-template-columns:1fr 1fr;gap:30px;min-height:700px;align-items:center}
.text{background:#090d35cc;border:1px solid #ffffff18;padding:45px;border-radius:30px;box-shadow:0 30px 80px #0008}
.tag{color:#ffe600;font-weight:800;letter-spacing:3px}
h1,h2{font-family:"Space Grotesk";font-size:clamp(45px,7vw,90px);line-height:.95;margin:15px 0}
p{font-size:18px;line-height:1.7;color:#cbd3ff}
.buttons,.socials{display:flex;gap:15px;flex-wrap:wrap;margin-top:25px}
.btn,.socials a{display:flex;align-items:center;gap:10px;padding:15px 22px;border-radius:16px;background:#ffffff12;border:1px solid #ffffff22;font-weight:800}
.yellow{background:#ffd000;color:#111}
.btn img,.socials img{width:24px;height:24px}
.art{position:relative;text-align:center}
.art img{width:90%;animation:float 5s infinite}
.circle{position:absolute;width:450px;height:450px;border-radius:50%;border:1px dashed #ffe60055;left:50%;top:50%;transform:translate(-50%,-50%);animation:spin 20s linear infinite}
.ca{margin-top:25px;background:#ffffff08;padding:18px;border-radius:18px;display:flex;flex-direction:column;gap:10px}
.ca button{width:max-content;background:#8dde2f;border:0;padding:10px 15px;border-radius:10px;font-weight:800;cursor:pointer}
code{word-break:break-all}
.info{margin:50px 0;background:#090d35cc;padding:40px;border-radius:30px}
.info h2{font-size:45px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.cards div{padding:25px;background:#ffffff08;border-radius:18px;font-weight:800}
@keyframes float{50%{transform:translateY(-20px)}}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@media(max-width:850px){.hero{grid-template-columns:1fr}.cards{grid-template-columns:1fr}header{flex-direction:column;gap:15px}.text{padding:25px}}