/* Añadir al final de tu archivo styles.css */

/* Ajustes para el scroll suave */
html {
    scroll-behavior: smooth;
}

/* Estilos para el efecto parallax en el hero */

/*
.hero {
    position: relative;
    overflow: hidden;
    background-attachment: fixed;
}
*/


/* Ajuste para la transición del contenido del hero */
.hero-content {
    transition: transform 0.1s ease-out;
}

/* Mejoras adicionales para una experiencia más suave */
.navbar {
    transition: background-color 0.3s ease;
}

/* Efecto de navbar con fondo sólido al hacer scroll */
.navbar-scrolled {
    background-color: rgba(255, 255, 255, 0.98);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* Optimizaciones para dispositivos móviles */
@media screen and (max-width: 768px) {
    .hero {
        background-attachment: scroll; /* Mejor rendimiento en móviles */
    }
}