#contenedor-buscador { padding-right: 3.5rem; }

#toggle-menu-movil {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 50;
}

#menu-lateral {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: min(85vw, 320px);
    background: #ffffff;
    z-index: 70;
    transform: translateX(-105%);
    transition: transform 0.3s ease;
    overflow-y: auto;
}
body.menu-abierto #menu-lateral {
    transform: translateX(0);
    box-shadow: 0 0 45px rgba(0, 0, 0, 0.25);
}

#menu-lateral .menu-card {
    position: static;
    height: 100%;
    border: none;
    border-radius: 0;
    box-shadow: none;
}
#menu-lateral .menu-card h2 { padding-right: 2.75rem; }

#cerrar-menu-movil {
    position: absolute;
    top: 1rem;
    right: 1rem;
    display: flex;
    z-index: 80;
}

#overlay-menu {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    z-index: 65;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}
body.menu-abierto #overlay-menu {
    opacity: 1;
    pointer-events: auto;
}

/* =====================================================
   ESCRITORIO Y TABLET EN HORIZONTAL: diseño original intacto
   ===================================================== */
@media (min-width: 1000px) and (orientation: landscape) {
    #contenedor-buscador { padding-right: 0; }
    #toggle-menu-movil, #cerrar-menu-movil { display: none !important; }
    #overlay-menu { display: none !important; }

    #layout-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

    #menu-lateral {
        position: static;
        transform: none;
        width: auto;
        background: transparent;
        overflow: visible;
        transition: none;
        box-shadow: none;
        grid-column: span 1 / span 1;
    }
    #menu-lateral .menu-card {
        position: sticky;
        top: 6rem;
        height: auto;
        border: 1px solid #e2e8f0;
        border-radius: 1rem;
        box-shadow: 0 1px 2px rgb(0 0 0 / 0.05);
    }
    #menu-lateral .menu-card h2 { padding-right: 0; }
    #main-productos { grid-column: span 3 / span 3; }

    /* Seguridad: nunca quedar bloqueado en escritorio */
    body.menu-abierto { overflow: auto !important; }
    body.menu-abierto #menu-lateral { box-shadow: none; }
}