/* --- MENÚ LATERAL Y ACORDEÓN --- */
.side-menu {
    position: fixed; top: 0; left: -320px;
    width: 310px; height: 100%;
    background: var(--bg-fresco-blanco);
    z-index: 1000;
    box-shadow: 5px 0 15px rgba(0,0,0,0.3);
    transition: left 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto; color: var(--text-principal);
}

.side-menu.active { left: 0; }

.side-menu-header { padding: 20px; background: var(--color-andina-cian); color: white; }

.btn-close {
    background: rgba(0,0,0,0.2); border: none; color: white;
    padding: 8px 15px; border-radius: 5px; cursor: pointer; font-weight: bold;
}

.overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.6); display: none; z-index: 999;
}

.menu-title.main {
    font-size: 1rem; color: var(--color-andina-cian);
    padding: 20px 20px 10px 20px; margin: 0; font-weight: bold;
    text-transform: uppercase; background-color: var(--bg-fresco-gris);
}

.acc-btn {
    width: 100%; text-align: left; padding: 15px 20px; background: white;
    border: none; border-bottom: 1px solid var(--borde-suave); font-size: 1rem;
    cursor: pointer; font-weight: 600; color: var(--text-principal);
    display: flex; justify-content: space-between; transition: background 0.3s;
}

.acc-panel { background: #fdfdfd; max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; }
.acc-panel a { display: block; padding: 12px 40px; text-decoration: none; color: var(--text-secundario); font-size: 0.95rem; border-bottom: 1px solid #f9f9f9; }

.main-title-btn {
    background-color: var(--bg-fresco-gris) !important; color: var(--color-andina-cian) !important;
    font-weight: bold !important; text-transform: uppercase; font-size: 1rem !important; border-bottom: 2px solid var(--borde-suave) !important;
}
.main-title-btn::after { content: '▼'; font-size: 0.7rem; color: var(--color-andina-cian); margin-left: auto; }