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

body{

font-family:'Poppins',sans-serif;

background:#081120;
height:100vh;
overflow:hidden;
display:flex;
justify-content:center;
align-items:center;
position:relative;

color:#fff;

}

.background{

position:absolute;
width:100%;
height:100%;

background:

radial-gradient(circle at 10% 20%,rgba(0,168,255,.20),transparent 30%),

radial-gradient(circle at 90% 20%,rgba(0,255,163,.18),transparent 35%),

radial-gradient(circle at 50% 80%,rgba(255,255,255,.05),transparent 30%),

linear-gradient(135deg,#07152d,#081b36,#0b2345,#102d5f);

animation:bgMove 12s ease infinite;

background-size:300% 300%;

}

@keyframes bgMove{

0%{
background-position:left;
}

50%{
background-position:right;
}

100%{
background-position:left;
}

}

.container{

position:relative;

width:100%;
max-width:900px;

padding:30px;

z-index:10;

text-align:center;

}

.logo{

font-size:28px;
font-weight:700;

margin-bottom:25px;

letter-spacing:1px;

}

.card{

background:rgba(255,255,255,.08);

border:1px solid rgba(255,255,255,.15);

backdrop-filter:blur(18px);

padding:60px;

border-radius:25px;

box-shadow:

0 20px 60px rgba(0,0,0,.35);

}

.tag{

display:inline-block;

padding:10px 22px;

border-radius:50px;

background:#14c38e;

color:#fff;

font-size:14px;

margin-bottom:25px;

font-weight:600;

}

h1{

font-size:48px;

line-height:1.2;

margin-bottom:20px;

font-weight:700;

}

p{

font-size:18px;

color:#d8e1ef;

line-height:1.8;

max-width:700px;

margin:auto;

margin-bottom:45px;

}

.countdown{

display:flex;

justify-content:center;

gap:20px;

margin-bottom:45px;

flex-wrap:wrap;

}

.countdown div{

width:120px;

height:120px;

background:rgba(255,255,255,.08);

border-radius:18px;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

border:1px solid rgba(255,255,255,.12);

transition:.3s;

}

.countdown div:hover{

transform:translateY(-8px);

background:rgba(20,195,142,.18);

}

.countdown span{

font-size:38px;

font-weight:700;

}

.countdown label{

margin-top:8px;

color:#bfd0e4;

}

.notify{

display:flex;

justify-content:center;

gap:12px;

margin-bottom:40px;

flex-wrap:wrap;

}

.notify input{

width:380px;

padding:16px 22px;

border-radius:50px;

border:none;

outline:none;

font-size:16px;

}

.notify button{

padding:16px 32px;

border:none;

border-radius:50px;

background:#00c896;

color:#fff;

font-weight:600;

cursor:pointer;

transition:.3s;

}

.notify button:hover{

background:#0fe0a8;

transform:translateY(-2px);

}

.features{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:18px;

margin-top:20px;

}

.features div{

background:rgba(255,255,255,.06);

padding:16px;

border-radius:12px;

font-size:15px;

}

.footer{

margin-top:35px;

color:#a7b6c8;

font-size:14px;

}

@media(max-width:768px){

.card{

padding:35px 25px;

}

h1{

font-size:34px;

}

p{

font-size:16px;

}

.features{

grid-template-columns:1fr;

}

.notify input{

width:100%;

}

.notify button{

width:100%;

}

.countdown div{

width:90px;
height:90px;

}

.countdown span{

font-size:30px;

}

}