*{box-sizing:border-box}
body{
margin:0;
min-height:100vh;
background:#050505;
color:white;
font-family:Arial,Helvetica,sans-serif;
overflow:hidden;
text-align:center;
}
.grid{
position:fixed;
inset:0;
background-image:linear-gradient(#1b1b1b 1px,transparent 1px),linear-gradient(90deg,#1b1b1b 1px,transparent 1px);
background-size:45px 45px;
animation:gridmove 8s linear infinite;
opacity:.25;
}
.glow{
position:fixed;
width:500px;
height:500px;
background:#00ff55;
filter:blur(180px);
top:20%;
left:50%;
transform:translateX(-50%);
opacity:.25;
}
header{position:relative;padding:50px 20px}
h1{
font-size:90px;
margin:0;
text-transform:uppercase;
letter-spacing:10px;
animation:title 3s infinite alternate;
}
header p{font-size:24px;color:#8cff7a}
main{position:relative;max-width:900px;margin:auto}
.hero{
width:min(650px,85vw);
animation:hero 3s infinite alternate;
filter:drop-shadow(0 0 40px #00ff55);
}
section{
border:2px solid white;
padding:25px;
margin:20px auto;
max-width:650px;
background:rgba(0,0,0,.45);
}
.links a{
position:fixed;
display:flex;
align-items:center;
gap:10px;
background:white;
color:black;
padding:14px 22px;
font-weight:900;
text-decoration:none;
animation:float 6s infinite alternate,spin 5s infinite linear;
}
.links img{width:28px;height:28px}
#buy{left:5%;top:25%}
#dex{right:5%;top:45%}
#x{left:8%;bottom:15%}
@keyframes hero{to{transform:translateY(-25px) scale(1.04)}}
@keyframes float{to{translate:35px -40px}}
@keyframes spin{to{rotate:360deg}}
@keyframes title{to{letter-spacing:18px}}
@keyframes gridmove{to{background-position:45px 45px}}
@media(max-width:700px){h1{font-size:45px}}