/* =======================================================

   ESTILOS INSTITUCIONALES - HSM SALAMANCA

   ======================================================= */



:root {

    --morado-hsm: #3A326D;

    --blanco-hsm: #ffffff;

    --plomo-hsm: #efefef;

    --transicion: all 0.3s ease;

}



/* 1. RESET Y ESTRUCTURA GLOBAL */

html, body {

    max-width: 100%;

    overflow-x: hidden;

    margin: 0;

    padding: 0;

    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

}



/* 2. CABECERA Y COMUNICACIONES (Top Bar) */

#cabecera, #hsmmscomunica {

    background-color: var(--morado-hsm) !important;

    color: var(--blanco-hsm);

}



#hsmmscomunica {

    font-size: 12px;

    padding: 5px;

}



#hsmmscomunica a {

    color: var(--blanco-hsm) !important;

    text-decoration: none;

    padding: 5px;

    transition: var(--transicion);

}



#hsmmscomunica a:hover {

    background-color: var(--blanco-hsm);

    color: var(--morado-hsm) !important;

    border-radius: 4px;

}



/* 3. NAVBAR (Navegación Principal) */

.navbar, #hsmmenu {

    background-color: var(--morado-hsm) !important;

}



.navbar-brand {

    color: var(--blanco-hsm) !important;

    font-size: 1.1rem;

    white-space: normal;

    max-width: 70%;

}



.navbar-dark .navbar-nav .nav-link {

    color: var(--blanco-hsm) !important;

    padding: 10px 15px !important;

    border-radius: 5px;

    transition: var(--transicion);

    font-weight: 500;

    font-size: 16px;

}



/* Efecto Hover: Fondo Blanco / Letra Morada */

.navbar-dark .navbar-nav .nav-link:hover,

.navbar-dark .navbar-nav .nav-link.active {

    background-color: var(--blanco-hsm) !important;

    color: var(--morado-hsm) !important;

}



/* 4. MENÚS DESPLEGABLES (Dropdowns) */

.dropdown-menu {

    background-color: var(--morado-hsm) !important;

    border: 1px solid var(--blanco-hsm);

    border-radius: 8px;

    box-shadow: 0 8px 20px rgba(0,0,0,0.3);

    padding: 0;

    overflow: hidden;

}



.dropdown-item {

    color: var(--blanco-hsm) !important;

    padding: 12px 20px;

    font-size: 15px;

    transition: var(--transicion);

}



.dropdown-item:hover {

    background-color: var(--blanco-hsm) !important;

    color: var(--morado-hsm) !important;

}



@media (min-width: 992px) {

    .nav-item.dropdown:hover > .dropdown-menu {

        display: block;

        margin-top: 0;

    }

}



/* 5. SECCIÓN DIRECTIVA E IMÁGENES */

.row-equipo {

    display: flex;

    flex-wrap: wrap;

    align-items: stretch;

}



.img-container {

    width: 100%;

    height: 100%;

    min-height: 250px;

}



.img-custom {

    width: 100%;

    height: 100%;

    object-fit: cover;

    object-position: center;

    border-radius: 8px;

    display: block;

}



/* 6. CLASES DE TEXTO Y UTILIDADES */

.moradoshsm {

    color: var(--morado-hsm);

    text-align: center;

    font-weight: bold;

    font-size: 16px;

    text-transform: uppercase;

}



.blancohsm {

    color: #000;

    text-align: center;

    font-weight: bold;

    font-size: 16px;

    text-transform: uppercase;

}



.hsmsnoticias {

    font-size: 30px;

    font-weight: bold;

    text-align: center;

    padding: 30px;

}



.hsmsplomo { background-color: var(--plomo-hsm); }

.hsmsmayusculas { text-transform: uppercase; }



/* 7. PIE DE PÁGINA (Footer) */

#hsmspie, #hsmsgranpie {

    background-color: var(--morado-hsm) !important;

    color: var(--blanco-hsm) !important;

    padding: 30px 0;

}



#hsmsgranpie .titulopart {

    font-size: 18px;

    font-weight: bold;

    color: var(--blanco-hsm) !important;

    display: block;

    margin-bottom: 15px;

}



/* Enlaces del pie restaurados: 16px y Blancos */

#hsmsgranpie a, 

#hsmsgranpie a:link, 

#hsmsgranpie a:visited,

#hsmsgranpie ul li {

    color: var(--blanco-hsm) !important;

    text-decoration: none !important;

    font-size: 16px !important;

    line-height: 1.8;

}



#hsmsgranpie a:hover {

    text-decoration: underline !important;

    color: var(--plomo-hsm) !important;

}



#hsmsgranpie ul {

    list-style: none;

    padding: 0;

    margin: 0;

}



/* Iconos en dropdown */

.dropdown-item i {

    margin-right: 10px;

}
.inicio {
  background-color: #3A326D;
  color: #fff;