/* ===================
   HEADER AMPLIADO - LOGO MÁS GRANDE
====================== */

/* Override para desktop - header más alto para logo más grande */
body {
    padding-top: 100px !important; /* Aumentado para el header más grande */
}

body.logged-in {
    padding-top: 100px !important;
}

/* Header desktop ampliado */
.modern-header {
    min-height: 100px !important;
    padding: 20px 0 !important;
}

.modern-header.scrolled {
    min-height: 85px !important;
    padding: 15px 0 !important;
}

/* Logo más grande para desktop */
.site-logo {
    height: 95px !important;
    max-height: none !important;
    width: auto !important;
}

.scrolled .site-logo {
    height: 75px !important;
}

/* Asegurar que el navbar contenga el logo sin desbordamiento */
.modern-navbar .container {
    align-items: center !important;
    min-height: 60px !important;
}

.navbar-brand {
    padding: 0 !important;
    margin: 0 !important;
}

/* Hero section ajustada al header más grande */
.hero-section {
    min-height: calc(130vh - 100px) !important; /* Aumentado significativamente la altura */
    padding-top: 60px !important; /* Agregado padding-top para separar del header */
    margin-top: 0px !important; /* Sin margen superior */
}

/* Específico para desktop - altura aumentada */
@media (min-width: 1200px) {
    .hero-section {
        min-height: calc(160vh - 100px) !important; /* Aún más alto en pantallas grandes */
        padding-top: 80px !important; /* Más separación del header en desktop */
        padding-bottom: 80px !important; /* Más espacio en desktop */
    }
}

/* Específico para vista normal (desktop) - override de mobile fixes */
@media (min-width: 992px) {
    .hero-section {
        min-height: calc(150vh - 100px) !important; /* Mayor altura que 100vh */
        padding-top: 60px !important; /* Separación del header */
        padding-bottom: 60px !important; /* Espacio inferior */
    }
}

/* ===================
   MOBILE RESPONSIVE AJUSTADO
====================== */

/* Tablet y mobile grande */
@media (max-width: 991.98px) {
    body,
    body.logged-in {
        padding-top: 85px !important;
    }
    
    .modern-header {
        min-height: 85px !important;
        padding: 15px 0 !important;
    }
    
    .modern-header.scrolled {
        min-height: 75px !important;
        padding: 12px 0 !important;
    }
    
    .site-logo {
        height: 70px !important;
    }
    
    .scrolled .site-logo {
        height: 60px !important;
    }
    
    .hero-section {
        min-height: calc(100vh - 85px) !important;
        padding-top: 0px !important; /* Sin padding superior */
        margin-top: 0px !important; /* Sin margen superior */
    }
}

/* Mobile */
@media (max-width: 768px) {
    body,
    body.logged-in {
        padding-top: 80px !important;
    }
    
    .modern-header {
        min-height: 80px !important;
        padding: 12px 0 !important;
    }
    
    .modern-header.scrolled {
        min-height: 70px !important;
        padding: 10px 0 !important;
    }
    
    .site-logo {
        height: 65px !important;
    }
    
    .scrolled .site-logo {
        height: 55px !important;
    }
    
    .hero-section {
        min-height: calc(100vh - 80px) !important;
        padding-top: 0px !important; /* Sin padding superior */
        margin-top: 0px !important; /* Sin margen superior */
    }
}

/* Mobile pequeño */
@media (max-width: 576px) {
    body,
    body.logged-in {
        padding-top: 75px !important;
    }
    
    .modern-header {
        min-height: 75px !important;
        padding: 10px 0 !important;
    }
    
    .modern-header.scrolled {
        min-height: 65px !important;
        padding: 8px 0 !important;
    }
    
    .site-logo {
        height: 60px !important;
    }
    
    .scrolled .site-logo {
        height: 50px !important;
    }
    
    .hero-section {
        min-height: calc(100vh - 75px) !important;
        padding-top: 0px !important; /* Sin padding superior */
        margin-top: 0px !important; /* Sin margen superior */
    }
}

/* ===================
   NAVEGACIÓN MEJORADA
====================== */

/* Asegurar que los elementos de navegación estén centrados verticalmente */
.navbar-nav {
    align-items: center !important;
}

.navbar-nav .nav-link {
    padding: 8px 15px !important;
}

/* Botón hamburguesa centrado en mobile */
.navbar-toggler {
    align-self: center !important;
    margin: 0 !important;
}

/* ===================
   OVERRIDE FINAL
====================== */

/* Asegurar que estos estilos tengan prioridad máxima */
.modern-header {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
}

.modern-header .container {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
}