/*
 * ==================================================================
 * == CORRECCIÓN PARA SCROLL HORIZONTAL EN MÓVILES
 * ==================================================================
 * Estas reglas evitan que los elementos se desborden y causen
 * un scroll horizontal no deseado en pantallas pequeñas.
*/

html,
body {
    overflow-x: hidden; /* Evita el desbordamiento en el eje X */
    width: 100%;
}

.wrapper,
.kf-header,
.kf-footer {
    width: 100%;
    max-width: 100%; /* Asegura que no excedan el ancho de la pantalla */
    overflow-x: hidden; /* Aplica la corrección a los contenedores principales */
}

/*
 * Ajuste para el menú de navegación para asegurar
 * que el botón de hamburguesa sea siempre visible.
*/
.kf-header .navigation {
    position: relative; /* Asegura el contexto de posicionamiento */
    width: 100%;
}