*{
margin:0;
padding:0;
box-sizing:border-box;
font-family: Inter, system-ui, sans-serif;
}

body{
min-height:100vh;
background:#f8fafc;
overflow:hidden;
}

/* Global glow background */
.background{
position:fixed;
inset:0;
background:
radial-gradient(circle at 20% 30%, rgba(56,189,248,.35), transparent 45%),
radial-gradient(circle at 80% 70%, rgba(99,102,241,.35), transparent 45%);
filter: blur(130px);
animation: bgmove 16s ease-in-out infinite alternate;
}

@keyframes bgmove{
from{transform:translateY(-60px);}
to{transform:translateY(60px);}
}

/* Particles */
.particles{
position:fixed;
inset:0;
pointer-events:none;
z-index:0;
}

.particles span{
position:absolute;
width:6px;
height:6px;
border-radius:50%;
background:rgba(56,189,248,.6);
box-shadow:0 0 12px rgba(56,189,248,.8);
animation: float 22s linear infinite;
}

@keyframes float{
from{
transform:translateY(110vh);
opacity:0;
}
to{
transform:translateY(-10vh);
opacity:1;
}
}

.particles span:nth-child(1){left:0%;animation-delay:0.0s;animation-duration:18s;}
.particles span:nth-child(2){left:7%;animation-delay:0.6s;animation-duration:21s;}
.particles span:nth-child(3){left:14%;animation-delay:1.2s;animation-duration:24s;}
.particles span:nth-child(4){left:21%;animation-delay:1.7999999999999998s;animation-duration:27s;}
.particles span:nth-child(5){left:28%;animation-delay:2.4s;animation-duration:30s;}
.particles span:nth-child(6){left:35%;animation-delay:3.0s;animation-duration:33s;}
.particles span:nth-child(7){left:42%;animation-delay:3.5999999999999996s;animation-duration:18s;}
.particles span:nth-child(8){left:49%;animation-delay:4.2s;animation-duration:21s;}
.particles span:nth-child(9){left:56%;animation-delay:4.8s;animation-duration:24s;}
.particles span:nth-child(10){left:63%;animation-delay:5.3999999999999995s;animation-duration:27s;}
.particles span:nth-child(11){left:70%;animation-delay:6.0s;animation-duration:30s;}
.particles span:nth-child(12){left:77%;animation-delay:6.6s;animation-duration:33s;}
.particles span:nth-child(13){left:84%;animation-delay:7.199999999999999s;animation-duration:18s;}
.particles span:nth-child(14){left:91%;animation-delay:7.8s;animation-duration:21s;}
.particles span:nth-child(15){left:98%;animation-delay:8.4s;animation-duration:24s;}
.particles span:nth-child(16){left:5%;animation-delay:9.0s;animation-duration:27s;}
.particles span:nth-child(17){left:12%;animation-delay:9.6s;animation-duration:30s;}
.particles span:nth-child(18){left:19%;animation-delay:10.2s;animation-duration:33s;}
.particles span:nth-child(19){left:26%;animation-delay:10.799999999999999s;animation-duration:18s;}
.particles span:nth-child(20){left:33%;animation-delay:11.4s;animation-duration:21s;}
.particles span:nth-child(21){left:40%;animation-delay:12.0s;animation-duration:24s;}
.particles span:nth-child(22){left:47%;animation-delay:12.6s;animation-duration:27s;}
.particles span:nth-child(23){left:54%;animation-delay:13.2s;animation-duration:30s;}
.particles span:nth-child(24){left:61%;animation-delay:13.799999999999999s;animation-duration:33s;}
.particles span:nth-child(25){left:68%;animation-delay:14.399999999999999s;animation-duration:18s;}
.particles span:nth-child(26){left:75%;animation-delay:15.0s;animation-duration:21s;}
.particles span:nth-child(27){left:82%;animation-delay:15.6s;animation-duration:24s;}
.particles span:nth-child(28){left:89%;animation-delay:16.2s;animation-duration:27s;}
.particles span:nth-child(29){left:96%;animation-delay:16.8s;animation-duration:30s;}
.particles span:nth-child(30){left:3%;animation-delay:17.4s;animation-duration:33s;}
.particles span:nth-child(31){left:10%;animation-delay:18.0s;animation-duration:18s;}
.particles span:nth-child(32){left:17%;animation-delay:18.599999999999998s;animation-duration:21s;}
.particles span:nth-child(33){left:24%;animation-delay:19.2s;animation-duration:24s;}
.particles span:nth-child(34){left:31%;animation-delay:19.8s;animation-duration:27s;}
.particles span:nth-child(35){left:38%;animation-delay:20.4s;animation-duration:30s;}

/* Layout */
.container{
position:relative;
z-index:1;
min-height:100vh;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
padding:24px;
}

/* Card */
.card{
position:relative;
background:rgba(255,255,255,.78);
backdrop-filter: blur(18px);
border-radius:28px;
padding:64px 72px;
max-width:720px;
width:100%;
text-align:center;
box-shadow:0 40px 120px rgba(2,6,23,.18);
overflow:hidden;
}

/* Card internal glow loop */
.card-glow{
position:absolute;
inset:-60%;
background:
radial-gradient(circle at 20% 30%, rgba(56,189,248,.45), transparent 40%),
radial-gradient(circle at 80% 70%, rgba(99,102,241,.45), transparent 40%);
filter: blur(120px);
animation: glowmove 14s linear infinite alternate;
z-index:-1;
}

@keyframes glowmove{
from{transform:translateX(-40px) translateY(-20px);}
to{transform:translateX(40px) translateY(20px);}
}

/* Content */
.logo{
width:240px;
margin-bottom:28px;
}

h1{
font-size:46px;
margin-bottom:14px;
color:#020617;
}

p{
font-size:15px;
color:#334155;
}

/* Footer */
.footer{
margin-top:24px;
font-size:13px;
color:#2563eb;
text-decoration:none;
}

.footer:hover{
text-decoration:underline;
}

/* Mobile */
@media(max-width:768px){
.card{
padding:40px 24px;
}
.logo{
width:180px;
}
h1{
font-size:32px;
}
}