/* ===================
   EFECTOS VISUALES NAVBAR Y HERO - FUERZA MÁXIMA
====================== */

/* ===================
   TRANSPARENCIA NAVBAR EN SCROLL - OVERRIDE FUERTE
====================== */

/* Navbar normal - fondo base con transparencia */
header.modern-header.fixed-top {
    transition: all 0.4s ease !important;
    background: rgba(0, 0, 0, 0.9) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

/* Navbar cuando se scrollea - más transparente */
header.modern-header.fixed-top.scrolled {
    background: rgba(0, 0, 0, 0.7) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.4) !important;
}

/* ===================
   REDUCIR ESPACIO ENTRE TÍTULO Y NAVBAR
====================== */

/* Desktop - reducir padding-top del hero */
@media (min-width: 992px) {
    section#inicio.hero-section {
        padding-top: 25px !important;
    }
}

@media (min-width: 1200px) {
    section#inicio.hero-section {
        padding-top: 35px !important;
    }
}

/* ===================
   CONTENEDOR HERO - CONFIG BÁSICA
====================== */

/* Configuración base del contenedor hero sin efectos de lucecitas */
section#inicio.hero-section {
    position: relative !important;
    overflow: hidden !important;
}

/* Asegurar que el contenido del hero esté correctamente posicionado */
section#inicio.hero-section .container,
section#inicio.hero-section .row,
section#inicio.hero-section .col-md-6,
section#inicio.hero-section h1,
section#inicio.hero-section p,
section#inicio.hero-section .btn {
    position: relative !important;
    z-index: 2 !important;
}

/* ===================
   MOBILE RESPONSIVE - SÓLO NAVBAR TRANSPARENTE
====================== */

/* En mobile, efectos navbar */
@media (max-width: 768px) {
    header.modern-header.fixed-top {
        backdrop-filter: blur(4px) !important;
        -webkit-backdrop-filter: blur(4px) !important;
    }
    
    header.modern-header.fixed-top.scrolled {
        backdrop-filter: blur(6px) !important;
        -webkit-backdrop-filter: blur(6px) !important;
    }
}

/* Tablets */
@media (max-width: 991.98px) and (min-width: 769px) {
    /* Sin efectos adicionales */
}