/* ==========================================================================
   ASODIB
   Archivo: assets/css/layout.css
   Estructura general del Portal Web.
   Contiene únicamente:
   - Header público.
   - Logo e información institucional.
   - Información de contacto.
   - Redes sociales.
   - Contenido general.
   - Secciones generales.
   - Tarjetas generales.
   - Breadcrumb.
   - Footer público.
   - Divisores.
   - Fondos.
   - Espaciados generales.
   - Cabeceras de página.
   - Utilidades globales de layout.
   - Impresión.
   No contiene:
   - Variables globales.
   - Componentes específicos de módulos.
   - Estilos exclusivos del Home.
   - Estilos de Noticias, Comunicados, Eventos, Galerías, Debates, etc.
   ========================================================================== */
/* ==========================================================================
   HEADER PÚBLICO
   ========================================================================== */
.header-publico{
    position:relative;
    z-index:var(--z-sticky);
    padding:var(--espacio-5) 0;
    border-bottom:var(--ancho-borde) solid var(--color-borde);
    background:var(--color-blanco);
    box-shadow:var(--sombra-sm);
    transition:box-shadow var(--transicion-normal);
}
.header-publico .container{
    max-width:var(--ancho-maximo);
}
.header-publico .row{
    align-items:center;
}
.header-publico .col-lg-2,
.header-publico .col-lg-3,
.header-publico .col-lg-7{
    padding-top:var(--espacio-1);
    padding-bottom:var(--espacio-1);
}
/* ==========================================================================
   LOGO
   ========================================================================== */
.header-logo{
    text-align:center;
}
.logo-asodib{
    display:inline-block;
    width:auto;
    max-height:100px;
    transition:transform var(--transicion-normal);
}
.logo-asodib:hover{
    transform:scale(1.04);
}
/* ==========================================================================
   INFORMACIÓN INSTITUCIONAL
   ========================================================================== */
.header-info{
    display:flex;
    flex-direction:column;
    justify-content:center;
}
.titulo-asodib{
    margin:0;
    color:var(--color-primario);
    font-family:var(--fuente-titulos);
    font-size:var(--titulo-h1);
    font-weight:var(--peso-negrita);
    line-height:var(--linea-titulos);
}
.descripcion-asodib{
    margin:var(--espacio-2) 0;
    color:var(--color-gris-800);
    font-size:var(--texto-xl);
    font-weight:var(--peso-semibold);
}
.slogan-asodib{
    margin:0;
    color:var(--color-texto-secundario);
    font-size:var(--texto-sm);
    font-style:italic;
}
/* ==========================================================================
   INFORMACIÓN DE CONTACTO
   ========================================================================== */
.datos-contacto{
    color:var(--color-gris-700);
    font-size:var(--texto-sm);
    line-height:var(--linea-relajada);
}
.datos-contacto i{
    width:var(--ancho-icono-md);
    color:var(--color-primario);
    text-align:center;
}
/* ==========================================================================
   REDES SOCIALES
   ========================================================================== */
.redes-sociales{
    margin-top:var(--espacio-4);
}
.redes-sociales a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    margin-left:var(--espacio-2);
    border-radius:50%;
    background:var(--color-gris-100);
    color:var(--color-primario);
    transition:
        background-color var(--transicion-normal),
        color var(--transicion-normal),
        transform var(--transicion-normal);
}
.redes-sociales a:hover{
    background:var(--color-primario);
    color:var(--color-blanco);
    transform:translateY(-2px);
}
/* ==========================================================================
   CONTENIDO GENERAL
   ========================================================================== */
.portal-contenido{
    margin-top:var(--espacio-6);
    margin-bottom:var(--espacio-7);
}
.container{
    max-width:var(--ancho-maximo);
}
.container-sm{
    max-width:var(--ancho-contenido-sm);
}
/* ==========================================================================
   SECCIONES
   ========================================================================== */
.portal-seccion{
    margin-bottom:var(--espacio-7);
}
.portal-seccion-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:var(--espacio-4);
    margin-bottom:var(--espacio-5);
}
.portal-seccion-titulo{
    margin:0;
    color:var(--color-primario);
    font-size:var(--titulo-h3);
    font-weight:var(--peso-negrita);
}
.portal-seccion-descripcion{
    margin-top:var(--espacio-1);
    color:var(--color-texto-secundario);
}
.portal-seccion-header .btn{
    border-radius:var(--radio-boton-pill);
}
/* ==========================================================================
   TARJETAS GENERALES DEL PORTAL
   ========================================================================== */
.portal-card{
    overflow:hidden;
    border:0;
    border-radius:var(--radio-card);
    background:var(--color-blanco);
    box-shadow:var(--sombra-sm);
    transition:
        transform var(--transicion-normal),
        box-shadow var(--transicion-normal);
}
.portal-card:hover{
    transform:translateY(-4px);
    box-shadow:var(--sombra-md);
}
.portal-card img{
    display:block;
    width:100%;
    height:var(--altura-imagen-card);
    object-fit:cover;
}
.portal-card-body{
    padding:var(--espacio-5);
}
.portal-card-title{
    margin-bottom:var(--espacio-3);
    font-size:var(--texto-lg);
    font-weight:var(--peso-negrita);
}
.portal-card-text{
    color:var(--color-gris-700);
    line-height:var(--linea-relajada);
}
.portal-card-footer{
    padding:var(--espacio-4) var(--espacio-5);
    border-top:var(--ancho-borde) solid var(--color-borde-claro);
    background:var(--color-blanco);
}
/* ==========================================================================
   BREADCRUMB
   ========================================================================== */
.portal-breadcrumb{
    margin-bottom:var(--espacio-6);
    padding:var(--espacio-3) var(--espacio-5);
    border:var(--ancho-borde) solid var(--color-borde);
    border-radius:var(--radio-md);
    background:var(--color-blanco);
    box-shadow:var(--sombra-sm);
}
.portal-breadcrumb ol{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    margin:0;
    padding:0;
    list-style:none;
}
.portal-breadcrumb li{
    display:flex;
    align-items:center;
    font-size:var(--texto-sm);
}
.portal-breadcrumb li + li::before{
    margin:0 var(--espacio-3);
    color:var(--color-gris-500);
    content:"›";
    font-size:var(--texto-lg);
}
.portal-breadcrumb a{
    color:var(--color-enlace);
    font-weight:var(--peso-medio);
}
.portal-breadcrumb a:hover{
    color:var(--color-enlace-hover);
    text-decoration:underline;
}
.portal-breadcrumb .activo{
    color:var(--color-texto-secundario);
    font-weight:var(--peso-semibold);
}
/* ==========================================================================
   FOOTER PÚBLICO
   ========================================================================== */
.footer-publico{
    margin-top:var(--espacio-8);
    background:linear-gradient(
        135deg,
        var(--color-primario),
        var(--color-primario-hover)
    );
    color:var(--color-blanco);
}
.footer-publico .container{
    padding-top:var(--espacio-7);
    padding-bottom:var(--espacio-6);
}
.footer-titulo{
    margin-bottom:var(--espacio-5);
    color:var(--color-blanco);
    font-size:var(--texto-lg);
    font-weight:var(--peso-negrita);
}
.footer-publico p{
    margin-bottom:var(--espacio-3);
    color:rgba(255,255,255,.90);
}
.footer-publico a{
    color:rgba(255,255,255,.85);
    transition:
        color var(--transicion-normal),
        padding-left var(--transicion-normal);
}
.footer-publico a:hover{
    padding-left:var(--espacio-1);
    color:var(--color-blanco);
}
.footer-publico ul{
    margin:0;
    padding:0;
    list-style:none;
}
.footer-publico li{
    margin-bottom:var(--espacio-3);
}
.footer-publico i{
    margin-right:var(--espacio-2);
}
.footer-redes{
    margin-top:var(--espacio-5);
}
.footer-redes a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    margin-right:var(--espacio-2);
    border-radius:50%;
    background:rgba(255,255,255,.12);
    transition:
        background-color var(--transicion-normal),
        color var(--transicion-normal);
}
.footer-redes a:hover{
    background:var(--color-blanco);
    color:var(--color-primario);
}
.footer-copyright{
    margin-top:var(--espacio-6);
    padding:var(--espacio-4);
    border-top:var(--ancho-borde) solid rgba(255,255,255,.18);
    font-size:var(--texto-sm);
    text-align:center;
}
/* ==========================================================================
   DIVISORES
   ========================================================================== */
.portal-divider{
    margin:var(--espacio-7) 0;
    border:0;
    border-top:var(--ancho-borde) solid var(--color-borde);
}
/* ==========================================================================
   FONDOS
   ========================================================================== */
.bg-portal{
    background:var(--color-fondo);
}
.bg-white{
    background:var(--color-blanco);
}
.bg-primary-soft{
    background:var(--color-primario-claro);
}
/* ==========================================================================
   ESPACIADOS GENERALES
   ========================================================================== */
.section-padding{
    padding-top:var(--espacio-7);
    padding-bottom:var(--espacio-7);
}
.section-margin{
    margin-top:var(--espacio-7);
    margin-bottom:var(--espacio-7);
}
/* ==========================================================================
   CABECERA DE PÁGINA
   ========================================================================== */
.page-header{
    margin-bottom:var(--espacio-6);
}
.page-header h1{
    margin-bottom:var(--espacio-2);
    color:var(--color-primario);
    font-weight:var(--peso-negrita);
}
.page-header p{
    max-width:850px;
    color:var(--color-texto-secundario);
}
/* ==========================================================================
   ANIMACIONES GENERALES
   ========================================================================== */
.fade-up{
    transition:
        transform var(--transicion-normal),
        box-shadow var(--transicion-normal);
}
.fade-up:hover{
    transform:translateY(-4px);
}
/* ==========================================================================
   UTILIDADES
   ========================================================================== */
.centrado{
    display:flex;
    align-items:center;
    justify-content:center;
}
.texto-justificado{
    text-align:justify;
}
.oculto{
    display:none !important;
}
.sombra{
    box-shadow:var(--sombra-md);
}
.radio{
    border-radius:var(--radio-lg);
}
/* ==========================================================================
   IMPRESIÓN
   ========================================================================== */
@media print{
    .topbar,
    nav,
    .footer-publico,
    footer,
    .btn{
        display:none !important;
    }
    body{
        background:var(--color-blanco);
    }
    .portal-contenido{
        margin:0;
    }
    .portal-card{
        box-shadow:none;
    }
}
/* ==========================================================
   FOOTER PÚBLICO
   ========================================================== */

.footer-asodib {
    background-color: #000;
    color: #fff;
    margin-top: 0;
}

.footer-asodib h5 {
    color: #fff;
    font-weight: 600;
}

.footer-asodib p,
.footer-asodib small {
    color: rgba(255, 255, 255, 0.8);
}

.footer-asodib a {
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
}

.footer-asodib a:hover {
    color: #fff;
}

.footer-line {
    border-color: rgba(255, 255, 255, 0.2);
    margin: 1.5rem 0;
}