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

body{
    height:100vh;
    overflow:hidden;
    display:flex;
    justify-content:center;
    align-items:center;
    background:#050505;
    font-family:Arial, Helvetica, sans-serif;
}

.background{
    position:absolute;
    width:700px;
    height:700px;
    background:radial-gradient(circle,#00aaff 0%,transparent 70%);
    filter:blur(120px);
    animation:pulse 5s infinite alternate;
}

@keyframes pulse{
    from{
        transform:scale(0.9);
        opacity:0.5;
    }

    to{
        transform:scale(1.3);
        opacity:1;
    }
}

.card{
    position:relative;
    z-index:1;

    width:700px;
    max-width:90%;

    padding:60px;

    text-align:center;

    border:1px solid rgba(255,255,255,0.1);

    background:rgba(255,255,255,0.05);

    backdrop-filter:blur(30px);

    border-radius:30px;

    box-shadow:
    0 0 40px rgba(0,170,255,0.15),
    inset 0 0 30px rgba(255,255,255,0.03);
}

.logo{
    color:#00bfff;
    font-weight:700;
    letter-spacing:5px;
    margin-bottom:40px;
}

h1{
    color:white;

    font-size:5rem;

    line-height:0.95;

    letter-spacing:4px;

    font-weight:900;
}

p{
    color:#d5d5d5;

    margin-top:35px;

    font-size:1.2rem;

    line-height:1.7;
}

.loader{
    display:flex;

    justify-content:center;

    gap:15px;

    margin-top:45px;
}

.loader span{

    width:18px;

    height:18px;

    border-radius:50%;

    background:#00bfff;

    animation:bounce 1.2s infinite;
}

.loader span:nth-child(2){
    animation-delay:0.2s;
}

.loader span:nth-child(3){
    animation-delay:0.4s;
}

@keyframes bounce{

    0%,80%,100%{

        transform:translateY(0);

        opacity:0.3;
    }

    40%{

        transform:translateY(-15px);

        opacity:1;
    }
}
