/* 
    ntv.css 
    Optimizaciones y estilos personalizados para NTV2026 
*/

/* 1. Hero Responsivo (Art Direction) */
.hero {
    background-image: url('../images/ntv/ntv2026_full.webp') !important;
}

@media (max-width: 767px) {
    .hero {
        background-image: url('../images/ntv/ntv2026_mobile.webp') !important;
    }
}

/* Reset de márgenes y corrección de scroll para el menú fijo */
html {
    scroll-padding-top: 90px;
}

body {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 2. Menú Dinámico (Sticky Header Premium) */
header.main-header {
    position: fixed !important;
    top: 0 !important;
    left: 0;
    width: 100%;
    z-index: 9999;
    padding: 0 !important; /* Eliminamos el padding que lo separaba del borde */
    background-color: transparent; 
    transition: all 0.4s ease-in-out;
    border: none !important;
}

/* Limpiar posibles fondos del contenedor interno del tema */
header.main-header .header-sticky {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Estado cuando se hace scroll */
header.main-header.scrolled {
    padding: 10px 0; /* Se afina la barra */
    background-color: rgba(17, 17, 17, 0.98); /* Negro casi sólido */
    box-shadow: 0 4px 20px rgba(0,0,0,0.5);
}

/* Reducción del logo */
header.main-header .navbar-brand img {
    max-height: 100px; /* Límite generoso para el inicio */
    width: auto;
    transition: all 0.4s ease-in-out;
}

header.main-header.scrolled .navbar-brand img {
    max-height: 50px; /* Se reduce el logo al hacer scroll */
}

/* Eliminar bordes y paddings molestos en móvil */
@media (max-width: 991px) {
    header.main-header {
        padding: 0 !important; /* Sin padding en móvil */
    }
    
    header.main-header.scrolled {
        padding: 0 !important;
    }

    .navbar-collapse {
        background: #111;
        border: none !important;
        box-shadow: none !important;
    }

    /* Estilizar SlickNav para que sea invisible y elegante */
    .slicknav_menu {
        display: block !important;
        background: transparent !important; /* Adiós al gris */
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .slicknav_btn {
        background: transparent !important; /* Botón transparente */
        text-shadow: none !important;
        margin: 10px 15px !important;
    }
    
    .slicknav_nav {
        background: #111 !important; /* El menú desplegado sí debe ser oscuro */
        border-radius: 0 0 10px 10px;
        margin-top: -2px !important; /* Cerrar el hueco de 5px */
        padding: 10px 0 !important;
    }

    .slicknav_nav ul {
        margin: 0 !important; /* Eliminar el margen de 5px que creaba el hueco */
        padding: 0 !important;
    }

    /* Estilo para los ítems de idiomas y botón dentro de SlickNav */
    .slicknav_nav .nav-link {
        padding: 12px 20px !important;
        color: #fff !important;
        display: block;
    }

    /* Selector de idiomas compacto y sin padding excesivo */
    .slicknav_nav .nav-item div.nav-link {
        gap: 8px !important;
        display: flex !important;
        align-items: center;
        justify-content: flex-start;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }

    .slicknav_nav .nav-item div.nav-link a {
        padding: 0 !important;
        display: inline !important;
    }

    /* Botón de inscripción básico en móvil */
    .slicknav_nav a[href*="#contacto"] {
        color: #fff !important;
        border-top: 1px solid rgba(255,255,255,0.1);
        margin-top: 5px;
        text-transform: none !important; /* Quitar capitalización automática */
    }

    .slicknav_icon-bar {
        background-color: #fff !important; /* Barras del menú en blanco */
        box-shadow: none !important;
    }

    /* Compensación extra de scroll para el cierre del menú móvil */
    html {
        scroll-padding-top: 95px !important; 
    }
}

/* 3. Estabilidad y Otros */
#logos-container {
    min-height: 800px;
}

.h3-style {
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0;
}
