/* Fix para el problema de z-index en la navegación */

/* Asegurar que la barra de navegación esté siempre por encima de todo */
.grax_tm_topbar {
    z-index: 9999 !important;
    position: fixed !important;
}

/* Asegurar que el menú móvil también esté por encima */
.grax_tm_mobile_menu {
    z-index: 9999 !important;
}

/* Asegurar que el dropdown del menú móvil esté por encima */
.grax_tm_mobile_menu .dropdown {
    z-index: 10000 !important;
}

/* Asegurar que los elementos del hero no se superpongan a la navegación */
.grax_tm_hero {
    z-index: 1 !important;
    position: relative !important;
}

.grax_tm_hero .content {
    z-index: 2 !important;
    position: relative !important;
}

.grax_tm_hero .details {
    z-index: 3 !important;
    position: relative !important;
}

/* Asegurar que los botones del hero no se superpongan */
.grax_tm_hero .buttons_wrapper {
    z-index: 3 !important;
    position: relative !important;
}

.grax_tm_hero .grax_tm_button_hero {
    z-index: 3 !important;
    position: relative !important;
}

/* Asegurar que el logo del hero no se superponga */
.grax_tm_hero .logo-chaignal {
    z-index: 3 !important;
    position: relative !important;
}

/* Asegurar que el overlay del hero esté por debajo del contenido */
.grax_tm_hero .bg .overlay {
    z-index: 1 !important;
}

/* Asegurar que la imagen de fondo esté por debajo de todo */
.grax_tm_hero .bg .image {
    z-index: 0 !important;
}

/* Asegurar que el scroll down button esté por debajo de la navegación */
.grax_tm_hero .grax_tm_down {
    z-index: 3 !important;
    position: relative !important;
}

/* Asegurar que el shape del hero esté por debajo del contenido */
.grax_tm_hero .my_shape {
    z-index: 0 !important;
}

/* Asegurar que las partículas estén por debajo del contenido */
.grax_tm_hero .particle_wrapper {
    z-index: 1 !important;
}

/* Asegurar que los efectos de glitch estén por debajo del contenido */
.grax_tm_hero .glitch_wrap {
    z-index: 1 !important;
}

/* Asegurar que los efectos de ripple estén por debajo del contenido */
.grax_tm_hero .ripple {
    z-index: 1 !important;
}

/* Asegurar que el botón de WhatsApp esté por debajo de la navegación */
.whatsapp-button {
    z-index: 999 !important;
}

/* Asegurar que el preloader esté por encima de todo */
#preloader {
    z-index: 99999 !important;
}

/* Asegurar que los modales estén por encima de la navegación */
.modal {
    z-index: 10000 !important;
}

/* Asegurar que el cursor personalizado esté por encima de todo */
.mouse-cursor {
    z-index: 99999 !important;
}

/* Asegurar que todos los elementos de navegación estén por encima */
.grax_tm_topbar .topbar_inner {
    z-index: 9999 !important;
    position: relative !important;
}

.grax_tm_topbar .logo {
    z-index: 9999 !important;
    position: relative !important;
}

.grax_tm_topbar .menu {
    z-index: 9999 !important;
    position: relative !important;
}

.grax_tm_topbar .menu ul {
    z-index: 9999 !important;
    position: relative !important;
}

.grax_tm_topbar .menu ul li {
    z-index: 9999 !important;
    position: relative !important;
}

.grax_tm_topbar .menu ul li a {
    z-index: 9999 !important;
    position: relative !important;
}

/* Asegurar que cuando la navegación tiene la clase animate, mantenga su z-index */
.grax_tm_topbar.animate {
    z-index: 9999 !important;
}

/* Asegurar que cuando la navegación está abierta, mantenga su z-index */
.grax_tm_topbar.opened {
    z-index: 9999 !important;
}

/* Asegurar que todos los elementos del hero tengan position relative para que el z-index funcione */
.grax_tm_hero * {
    position: relative;
}

/* Excepción para elementos que deben mantener position absolute */
.grax_tm_hero .bg,
.grax_tm_hero .bg .image,
.grax_tm_hero .bg .overlay,
.grax_tm_hero .my_shape {
    position: absolute !important;
}

/* Asegurar que el contenido del hero mantenga su position absolute */
.grax_tm_hero .details {
    position: absolute !important;
}

/* Asegurar que el contenido del hero mantenga su position relative */
.grax_tm_hero .content {
    position: relative !important;
}
