@font-face{
    font-family:"Sonic XBd BT";
    src:url("../fonts/Sonic-Extra-Bold-BT_41663.ttf") format("truetype");
    font-display:swap;
}

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

html,
body{
    height:100%;
}

body{

    overflow:hidden;

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

    background:
        radial-gradient(circle at center,
            rgba(70,170,255,.30) 0%,
            rgba(70,170,255,0) 45%),

        linear-gradient(
            135deg,
            #031f4b 0%,
            #0b3f8a 35%,
            #1565c0 70%,
            #2b84ff 100%);

    font-family:
        "Segoe UI",
        Arial,
        sans-serif;
}

.bg-light{

    position:absolute;

    width:700px;
    height:700px;

    border-radius:50%;

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

    filter:blur(100px);

    animation:pulse 8s ease-in-out infinite;
}

.contenido{

    position:relative;

    z-index:2;

    text-align:center;

    animation:entrada .8s ease;
}

.logo{

    font-family:"Sonic XBd BT",Arial,sans-serif;

    color:white;

    font-size:clamp(60px,8vw,110px);

    letter-spacing:2px;

    text-shadow:
        0 10px 25px rgba(0,0,0,.35);

    margin-bottom:70px;
}

.boton{

    display:inline-block;

    padding:24px 50px;

    border-radius:20px;

    text-decoration:none;

    color:white;

    font-size:28px;

    font-weight:700;

    backdrop-filter:blur(16px);

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

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

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

    transition:
        transform .25s,
        background .25s,
        box-shadow .25s;
}

.boton:hover{

    transform:
        translateY(-4px)
        scale(1.03);

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

    box-shadow:
        0 25px 45px rgba(0,0,0,.40),
        0 0 30px rgba(255,255,255,.15);
}

@keyframes entrada{

    from{

        opacity:0;

        transform:
            translateY(30px);
    }

    to{

        opacity:1;

        transform:none;
    }
}

@keyframes pulse{

    0%,100%{

        transform:scale(1);
    }

    50%{

        transform:scale(1.15);
    }
}