/* =========================================
   FOOTER PREMIUM OSCURO MODERNO
========================================= */

.footer-premium{

    background:
    linear-gradient(
        180deg,
        #0b0b0b,
        #111827
    );

    padding:90px 8% 30px;

    color:white;

    position:relative;

    overflow:hidden;
}

/* EFECTO SUAVE */

.footer-premium::before{

    content:"";

    position:absolute;

    top:-120px;
    right:-120px;

    width:300px;
    height:300px;

    background:
    radial-gradient(
        circle,
        rgba(248,118,163,.10),
        transparent 70%
    );

    filter:blur(20px);
}

/* CONTENEDOR */

.footer-premium-container{

    position:relative;
    z-index:2;

    display:grid;

    grid-template-columns:
    repeat(auto-fit,minmax(260px,1fr));

    gap:50px;

    padding-bottom:45px;

    border-bottom:
    1px solid rgba(255,255,255,.08);
}

/* TITULOS */

.footer-premium-col h3{

    font-size:14px;

    letter-spacing:2px;

    margin-bottom:22px;

    color:var(--rosa);

    font-weight:700;
}

/* TEXTO */

.footer-premium-col p{

    color:rgba(255,255,255,.72);

    line-height:2;

    font-size:14px;
}

/* FACEBOOK */

.footer-social{

    display:inline-flex;

    align-items:center;

    gap:12px;

    margin-top:18px;

    text-decoration:none;

    color:white;

    font-size:14px;

    transition:.35s ease;
}

.footer-social i{

    width:40px;
    height:40px;

    border-radius:50%;

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

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

    font-size:14px;

    transition:.35s ease;
}

.footer-social:hover{

    color:var(--rosa);

    transform:translateX(5px);
}

.footer-social:hover i{

    background:var(--rosa);

    color:white;
}

/* COPYRIGHT */

.footer-premium-bottom{

    position:relative;
    z-index:2;

    text-align:center;

    padding-top:28px;
}

.footer-premium-bottom p{

    color:rgba(255,255,255,.45);

    font-size:12px;

    letter-spacing:1px;
}

/* RESPONSIVE */

@media(max-width:768px){

    .footer-premium{

        padding:70px 6% 25px;
    }

    .footer-premium-container{

        gap:35px;
    }

}