*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:Poppins,sans-serif;
height:100vh;
display:flex;
justify-content:center;
align-items:center;
background:linear-gradient(-45deg,#6d28d9,#2563eb,#9333ea,#0f172a);
background-size:400% 400%;
animation:bg 12s infinite;
overflow:hidden;
}

@keyframes bg{
0%{background-position:0 50%;}
50%{background-position:100% 50%;}
100%{background-position:0 50%;}
}

.overlay{
width:100%;
display:flex;
justify-content:center;
padding:20px;
}

.card{
max-width:650px;
width:100%;
padding:50px;
border-radius:20px;
background:rgba(255,255,255,.08);
backdrop-filter:blur(15px);
color:white;
text-align:center;
box-shadow:0 20px 50px rgba(0,0,0,.3);
}

.logo{
width:120px;
margin-bottom:30px;
}

h1{
font-size:3rem;
margin-bottom:20px;
}

p{
opacity:.85;
margin-bottom:30px;
}

#countdown{
font-size:2rem;
font-weight:700;
margin-bottom:35px;
}

form{
display:flex;
gap:10px;
flex-wrap:wrap;
justify-content:center;
}

input{
flex:1;
min-width:220px;
padding:15px;
border:none;
border-radius:50px;
}

button{
padding:15px 30px;
border:none;
border-radius:50px;
background:#7c3aed;
color:white;
cursor:pointer;
transition:.3s;
}

button:hover{
background:#5b21b6;
}

.socials{
margin-top:40px;
}

.socials i{
font-size:22px;
margin:0 12px;
cursor:pointer;
transition:.3s;
}

.socials i:hover{
transform:translateY(-4px);
color:#c084fc;
}