
    
    /* Fondo */
    
    .background-glow{
    
    position:absolute;
    
    width:900px;
    
    height:900px;
    
    background:
    
    radial-gradient(circle,
    
    rgba(122,80,255,.18),
    
    transparent 70%);
    
    filter:blur(90px);
    
    animation:backgroundMove 10s ease-in-out infinite;
    
    }
    
    /* Contenedor */
    
    .container{
    margin-top: 60px ; 
    margin-bottom: 50px;
    position:relative;
    
    z-index:2;
    
    text-align:center;
    
    }
    
    /* Halo */
    
    .halo{
    
    width:220px;
    
    height:220px;
    
    margin:auto;
    
    position:relative;
    
    display:flex;
    
    justify-content:center;
    
    align-items:center;
    
    }
    
    .halo-ring{
    
    position:absolute;
    
    inset:0;
    
    border-radius:50%;
    
    border:2px solid rgba(170,140,255,.35);
    
    box-shadow:
    
    0 0 40px rgba(170,140,255,.35),
    
    0 0 80px rgba(170,140,255,.25);
    
    animation:
    
    pulse 4s ease-in-out infinite,
    
    rotate 25s linear infinite;
    
    }
    
    .halo-core{
    
    width:28px;
    
    height:28px;
    
    border-radius:50%;
    
    background:white;
    
    box-shadow:
    
    0 0 30px white,
    
    0 0 60px rgba(180,160,255,.8);
    
    animation:corePulse 2.5s infinite;
    
    }
    
    /* Texto */
    
    h1{
    
    margin-top:50px;
    
    font-size:46px;
    
    font-weight:300;
    
    letter-spacing:.08em;
    
    }
    
    p{
    
    margin-top:18px;
    
    opacity:.7;
    
    font-size:18px;
    
    }
    
    /* Botón */
    
    button{
    
    margin-top:45px;
    
    padding:16px 40px;
    
    background:transparent;
    
    border:1px solid rgba(255,255,255,.2);
    
    color:white;
    
    font-size:16px;
    
    cursor:pointer;
    
    border-radius:50px;
    
    display:none;
    
    transition:.4s;
    
    }
    
    button:hover{
    
    background:white;
    
    color:black;
    
    }
    
    /* Animaciones */
    
    @keyframes pulse{
    
    0%{
    
    transform:scale(.96);
    
    opacity:.4;
    
    }
    
    50%{
    
    transform:scale(1.05);
    
    opacity:1;
    
    }
    
    100%{
    
    transform:scale(.96);
    
    opacity:.4;
    
    }
    
    }
    
    @keyframes rotate{
    
    from{
    
    transform:rotate(0deg);
    
    }
    
    to{
    
    transform:rotate(360deg);
    
    }
    
    }
    
    @keyframes corePulse{
    
    0%{
    
    transform:scale(.8);
    
    }
    
    50%{
    
    transform:scale(1.3);
    
    }
    
    100%{
    
    transform:scale(.8);
    
    }
    
    }
    
    @keyframes backgroundMove{
    
    0%{
    
    transform:translateY(-20px);
    
    }
    
    50%{
    
    transform:translateY(20px);
    
    }
    
    100%{
    
    transform:translateY(-20px);
    
    }
    
    }
    /*==========================
BOTÓN CERRAR
==========================*/
.close-btn{
    position: fixed;
    top: 24px;
    right: 24px;

    width: 52px;
    height: 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.9);

    border: 1px solid rgba(255,255,255,.15);
    border-radius: 50%;

    font-size: 22px;
    line-height: 1;

    cursor: pointer;

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);


    z-index: 999999;
}

.close-btn:hover{
    background: rgba(255,255,255,.12);
    border-color: rgba(255,255,255,.3);
    color: #fff;
    transform: none;

}.close-btn{
    -webkit-tap-highlight-color: transparent;
    outline: none;
}

.close-btn:focus{
    outline: none;
}