/* ======================================================= */
/* VERSI?N FINAL, LIMPIA Y CORREGIDA DE FOOTER.CSS      */
/* ======================================================= */
 
:root {
    --fiduprevisora-magenta:#881d43 ;
    --fiduprevisora-blue: #0048AD;
    --footer-text-color: #FFFFFF;
    --footer-link-color: #f0f0f0;
    --footer-divider-color: rgba(255, 255, 255, 0.2);
    --cert-bg-color: #f7f7f7;
    --cert-text-color: #333;
}
 
/* Contenedor personalizado para controlar el ancho */
.final-footer .footer-container {
    width: 90%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    max-width: 1400px;
}
 
.final-footer {
    font-family: 'Arial', sans-serif;
    font-size: 14px;
    line-height: 1.6;
    clear: both; 
    background-color: #881d43;
}
 
/* --- ?REA PRINCIPAL MAGENTA --- */
.final-footer .footer-main-area {
    background-color: var(--fiduprevisora-magenta);
    color: var(--footer-text-color);
    padding: 15px 10px;
    
}
 
/* Fila Superior */
.final-footer .footer-top-row {
    display: flex;
    align-item: center;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
    
    
}
 
.final-footer .main-footer-logo img {
    max-height: 45px;
    width: auto;
}
 
.final-footer .footer-social-icons {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    gap: 10px;
}
 
.final-footer .footer-social-icons a {
    color: var(--footer-text-color);
    border: 1px solid var(--footer-divider-color);
    width: 42px;
    height: 42px;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    text-decoration: none;
    transition: background-color 0.3s, border-color 0.3s;
}
 
.final-footer .footer-social-icons a:hover {
    background-color: var(--footer-text-color);
    color: #881d43;
    border-color: var(--footer-text-color);
}
 
/* Estilo para la l?nea divisoria larga */
.final-footer .footer-divider-full {
    border: 0;
    border-top: 1px solid var(--footer-divider-color);
    margin: 0;
    width: 100%;
}
 
/* Columnas de contenido */
.final-footer .content-columns {
    padding-top: 25px;
}
 
.final-footer .footer-col {
    margin-bottom: 25px;
}
 
/* REGLA CORREGIDA Y REFORZADA PARA LOS DIVISORES DE T?TULO */
.final-footer .footer-col .title-divider {
    border: none !important; 
    height: 2px !important;      /* Grosor de la l?nea */
    width: 250px !important;     /* Largo de la l?nea */
    background: white !important; /* Color de la l?nea */
    opacity: 1 !important;
    visibility: visible !important;
    margin: 0 0 15px 0 !important;
}
 
.final-footer .footer-col h4 {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 15px 0;
    color: var(--footer-text-color);
}
 
.final-footer .footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
 
.final-footer .footer-col ul li {
    margin-bottom: 8px;
}
 
.final-footer .footer-col a, 
.final-footer .footer-col p, 
.final-footer .footer-col p a {
    color: var(--footer-link-color);
    text-decoration: none;
    font-size: 14px;
}
 
.final-footer .footer-col a:hover {
    text-decoration: underline;
    color: #FFFFFF;
}
 
.final-footer .footer-col p {
    margin-bottom: 0;
}
 
/* --- OTRAS SECCIONES --- */


  margin: -15px 15px 25px 15px; }
.final-footer .cert-title {
    font-weight: bold;
    font-size: 16px;
    margin: 0;
}
 
.final-footer .logo-carousel .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
}
 
/* ======================================================= */
/* REGLA PARA EL TAMA?O DE LOS LOGOS    */
/* ======================================================= */
 
/* Usamos un selector */
.final-footer .certifications-container .logo-carousel .swiper-slide img {
    /* Reseteamos el ancho que viene de main.css */
    width: auto !important;
 
    /* --- ?CONTROL DEL TAMA?O! --- */
    /* Ajusta el valor de 'height' para hacer los logos m?s grandes o peque?os */
    height: 200px !important;
 
    /* Propiedades de seguridad para evitar deformaciones */
    max-width: 250px !important;
    object-fit: contain;
}




.final-footer .sub-footer {
    background-color: var(--fiduprevisora-magenta);
    padding: 15px 0;
}
 
.final-footer .vigilado-logo {
    max-height: 25px;
}
 
.final-footer .copyright-text {
    font-size: 13px;
    color: var(--footer-link-color);
    margin: 0;
}
 
.final-footer .govco-bar {
    background-color: var(--fiduprevisora-blue);
    padding: 10px 0;
}
 
.final-footer .govco-bar img {
    max-height: 20px;
}
 
/* --- AJUSTES RESPONSIVOS --- */
@media (max-width: 768px) {
    .final-footer .footer-top-row {
        flex-direction: column;
        gap: 20px;
    }
    .final-footer .main-footer-logo {
        margin-bottom: 20px;
    }
    .final-footer .sub-footer .text-md-end {
        margin-top: 10px;
    }
    .final-footer .cert-title {
        text-align: center;
        margin-bottom: 20px;
    }



.final-footer .footer-main-area {     
      padding-bottom: 0 !important; }
    
}

/* ======================================================= */
/* AJUSTE FINAL DE ALINEACI?N Y TAMA?O PARA LOGOS         */
/* ======================================================= */
 
/* 1. Asegura la alineaci?n del logo 'Vigilado' y el Copyright */
.final-footer .sub-footer .row {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.final-footer .sub-footer .text-md-start {
    text-align: left !important;
    }
 
/* 2. Corrige el logo de GOV.CO estirado */
.final-footer .govco-bar img {
    max-height: 22px; /* Mantenemos la altura deseada */
    width: auto !important; /* ?ESTA ES LA L?NEA CLAVE! Le dice a la imagen que ajuste su ancho autom?ticamente para no deformarse */
    max-width: 100%; /* Buena pr?ctica para que no se desborde en m?viles */
}

.final-footer .sub-footer .text-md-start {
    text-align: left !important;
}
 
/* Fuerza el contenido de la columna derecha a la derecha */
.final-footer .sub-footer .text-md-end {
    text-align: right !important;
}


/* ================================================== */
/* ESTILOS PARA LA BARRA DE CERTIFICACIONES (CONTROL TOTAL) */
/* ================================================== */
 
/* Contenedor que solo sirve para darle un espacio a la secci?n */
.certifications-section {
    
    padding-top: 0;
    padding-bottom:20px;
}
 
/* El contenedor blanco y redondeado */
.certifications-container {
    /* --- ESTILOS VISUALES --- */
    background-color: #FFFFFF;
    color: #333;
    border-radius: 10px;  /* Esquinas muy redondeadas */
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.07); /* Sombra suave */
    /* --- CONTROL DE TAMA?O Y POSICI?N --- */
 
    /* Para controlar el ALTO, modifica el padding */
    padding: 50px 20px; /* 30px arriba/abajo, 40px a los lados */
    /* Para controlar el ANCHO, modifica el max-width */
    max-width: 1150px; 
    /* Para CENTRAR y alinear con el resto, usamos margin: auto */
    margin-left: auto;
    margin-right: auto;
}
 
.certifications-container .cert-text-col p {
    font-weight: bold;
    font-size: 16px;
    margin: 0;
}
 
.certifications-container .logo-carousel img {
    max-height: 100px;
    width: auto;
}
 
/* Ajuste para m?viles */
@media (max-width: 991px) {
    .certifications-container .cert-text-col {
        text-align: center;
        margin-bottom: 25px;
    }
}