/* Correcciones para cabecera en móvil */

/* Ajustes para el logo y header */
@media (max-width: 768px) {
    /* Reducir padding del header */
    .header {
        padding: 10px 0;
    }
    
    /* Ajustar logo */
    .logo-container {
        max-width: 170px;
    }
    
    .logo {
        height: auto;
        width: 100%;
    }
    
    /* Posicionamiento del botón de menú */
    .mobile-menu-toggle {
        position: absolute;
        right: 20px;
        top: 50%;
        transform: translateY(-50%);
    }
    
    /* Asegurar que el logo no sea demasiado grande */
    .header .container {
        position: relative;
        justify-content: flex-start;
    }
}

/* Ajustes adicionales para móviles pequeños */
@media (max-width: 576px) {
    .logo-container {
        max-width: 150px;
    }
    
    .header.scrolled {
        padding: 5px 0;
    }
}