/* =========================================
   FOOTER PREMIUM NEGRO • BLANCO • ROJO
========================================= */

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

html,
body{
    overflow-x:hidden;
}

/* =========================================
FOOTER GENERAL
========================================= */
.footer{
    background:linear-gradient(
        135deg,
        #050505 0%,
        #0d0d0d 35%,
        #170000 100%
    );

    color:#d9d9d9;

    padding:70px 60px 25px;

    margin-top:80px;

    font-family:'Segoe UI',sans-serif;

    position:relative;

    overflow:hidden;

    border-top:1px solid rgba(255,0,0,0.12);
}

/* EFECTO SUPERIOR */
.footer::before{
    content:'';

    position:absolute;
    top:0;
    left:0;

    width:100%;
    height:2px;

    background:linear-gradient(
        to right,
        transparent,
        #8b0000,
        #ff1a1a,
        #8b0000,
        transparent
    );
}

/* =========================================
CONTENEDOR
========================================= */
.footer-container{
    display:grid;

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

    gap:50px;

    max-width:1400px;

    margin:auto;

    position:relative;
    z-index:2;
}

/* =========================================
COLUMNAS
========================================= */
.footer-col h3.logo{
    font-size:30px;

    color:#ffffff;

    margin-bottom:20px;

    letter-spacing:1px;

    font-weight:700;
}

.footer-col h4{
    font-size:18px;

    color:#ffffff;

    margin-bottom:20px;

    position:relative;

    font-weight:600;
}

/* LINEA ROJA */
.footer-col h4::after{
    content:"";

    width:45px;
    height:2px;

    background:#b30000;

    position:absolute;

    left:0;
    bottom:-8px;

    border-radius:50px;
}

.footer-col p{
    font-size:14px;

    line-height:1.9;

    color:#b8b8b8;

    margin-bottom:12px;
}

/* =========================================
LINKS
========================================= */
.footer-col a{
    display:flex;
    align-items:center;
    gap:10px;

    text-decoration:none;

    color:#dcdcdc;

    margin-bottom:14px;

    font-size:14px;

    transition:.35s ease;
}

.footer-col a i{
    color:#c40000;

    width:18px;

    transition:.35s ease;
}

.footer-col a:hover{
    color:#ffffff;

    transform:translateX(5px);
}

.footer-col a:hover i{
    color:#ff2b2b;
}

/* =========================================
SEO FOOTER
========================================= */
.footer-seo{
    width:100%;

    text-align:center;

    padding:35px 5%;

    border-top:1px solid rgba(255,255,255,0.08);

    margin-top:50px;

    position:relative;
    z-index:2;
}

.footer-seo p{
    color:#bdbdbd;

    font-size:14px;

    line-height:2;

    max-width:1100px;

    margin:auto;

    font-weight:300;
}

/* =========================================
BOTTOM
========================================= */
.footer-bottom{
    border-top:1px solid rgba(255,255,255,0.08);

    margin-top:30px;

    padding-top:22px;

    text-align:center;

    position:relative;
    z-index:2;
}

.footer-bottom p{
    margin:7px 0;

    font-size:13px;

    color:#8d8d8d;
}

.footer-bottom a{
    color:#ff2b2b;

    text-decoration:none;

    font-weight:600;

    transition:.3s ease;
}

.footer-bottom a:hover{
    color:#ffffff;
}

/* =========================================
SEO LINKS SECTION
========================================= */
.seo-links{
    background:
    linear-gradient(
        180deg,
        #0b0b0b 0%,
        #120000 100%
    );

    padding:70px 20px;

    margin-top:60px;

    border-top:1px solid rgba(255,0,0,0.12);

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

.seo-links .seo-container{
    max-width:1200px;

    margin:auto;

    text-align:center;
}

/* TITULO */
.seo-links h3{
    font-size:28px;

    color:#ffffff;

    margin-bottom:40px;

    letter-spacing:1px;

    font-weight:700;
}

/* LISTA */
.seo-links ul{
    list-style:none;

    padding:0;
    margin:0;

    display:flex;

    flex-wrap:wrap;

    justify-content:center;

    gap:16px;
}

/* ITEMS */
.seo-links li{
    max-width:100%;
}

/* LINKS */
.seo-links a{
    display:inline-block;

    padding:13px 22px;

    border-radius:40px;

    text-decoration:none;

    font-size:14px;

    color:#f0f0f0;

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

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

    transition:all .35s ease;

    backdrop-filter:blur(8px);

    word-break:break-word;
}

/* HOVER */
.seo-links a:hover{
    background:#a00000;

    color:#ffffff;

    border-color:#ff2b2b;

    transform:translateY(-3px);

    box-shadow:
    0 10px 25px rgba(255,0,0,0.18);
}

/* =========================================
RESPONSIVE
========================================= */
@media(max-width:900px){

    .footer{
        padding:60px 25px 25px;
    }

    .footer-container{
        grid-template-columns:1fr;

        gap:35px;
    }

    .footer-seo{
        padding:30px 20px;
    }

    .seo-links{
        padding:55px 20px;
    }

    .seo-links h3{
        font-size:24px;
    }

}