*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial, Helvetica, sans-serif;
}

body{

    height:100vh;

    display:flex;
    justify-content:center;
    align-items:center;

    background:#0f172a;
    overflow:hidden;
    color:white;

}

.background{

    position:fixed;
    width:100%;
    height:100%;

    background:
    radial-gradient(circle at top,#2563eb33,transparent 40%),
    radial-gradient(circle at bottom,#22c55e33,transparent 40%),
    #012c18;

    animation:bgMove 12s infinite alternate;

}

@keyframes bgMove{

    from{
        transform:scale(1);
    }

    to{
        transform:scale(1.2);
    }

}

.container{

    position:relative;

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

    text-align:center;

    padding:45px;

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

    border-radius:20px;

    backdrop-filter:blur(15px);

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

    box-shadow:0 20px 50px rgba(0,0,0,.35);

}

.logo{

    width:180px;

    margin-bottom:25px;

}

h1{

    font-size:3rem;

    margin-bottom:20px;

}

p{

    font-size:1.1rem;

    opacity:.85;

    line-height:1.7;

    margin-bottom:35px;

}

.loader{

    width:70px;
    height:70px;

    border-radius:50%;

    border:6px solid rgba(255,255,255,.2);

    border-top:6px solid #25D366;

    margin:0 auto 40px;

    animation:spin 1s linear infinite;

}

@keyframes spin{

    to{

        transform:rotate(360deg);

    }

}

.whatsapp{

    display:inline-flex;

    align-items:center;

    gap:10px;

    text-decoration:none;

    color:white;

    background:#25D366;

    padding:15px 30px;

    border-radius:50px;

    font-weight:bold;

    transition:.3s;

    font-size:18px;

}

.whatsapp:hover{

    transform:translateY(-4px);

    box-shadow:0 10px 25px rgba(37,211,102,.4);

}

.phones{

    margin-top:35px;

    display:flex;

    justify-content:center;

    gap:30px;

    flex-wrap:wrap;

}

.phones a{

    color:white;

    text-decoration:none;

    opacity:.9;

    transition:.3s;

}

.phones a:hover{

    color:#25D366;

}

@media(max-width:700px){

    h1{

        font-size:2rem;

    }

    .logo{

        width:130px;

    }

    p{

        font-size:1rem;

    }

    .phones{

        flex-direction:column;

        gap:15px;

    }

}