/* ==========================================================================
   Barra del menú y megamenú v2 (MegaMenuTienda, 07/11/2026; prototipos aprobados en
   scripts/tmp/prototipo-menu/). Dos estilos que elige cada tienda:
     .ec-mm--columnas       «Columnas con foto»: barra discreta del color de la cabecera,
                            panel a lo ancho con una columna por categoría y promo al costado.
     .ec-mm--departamentos  «Departamentos con precios»: botón «Categorías ☰», lista de
                            categorías con ícono y sus productos con precio.
   Colores y letras: variables --ecm-* (abajo los valores neutros, luego una clase por
   plantilla visual .ec-mm--tpl-{id}; el «Estilo general» del editor las pisa con un <style>
   en línea, MegaMenuTienda::cssEstilo). Va en la barra (.ec-nav-menu) y en el cajón del
   celular (.ec-mmenu) de TODAS las páginas de la tienda. Solo pisa a factustore.css dentro
   de .ec-mm (el menú viejo sigue igual para quien no lo cargue).
   ========================================================================== */

/* ── Tokens: estilo neutro (tienda sin plantilla visual), basado en --primary ── */
.ec-mm {
    --ecm-cabecera: var(--bg-white, #fff);
    --ecm-a-bar-bg: var(--ecm-cabecera);
    --ecm-a-bar-tinta: var(--ecm-tinta);
    --ecm-papel: #FFFFFF;
    --ecm-suave: #F6F7F9;
    --ecm-tinta: #111827;
    --ecm-tinta-titulo: var(--ecm-tinta);
    --ecm-gris: #4B5563;
    --ecm-gris-claro: #8A919C;
    --ecm-linea: #E5E7EB;
    --ecm-acento: var(--primary, #793FED);
    --ecm-sobre-acento: var(--ecm-sobre-primario, #fff);
    --ecm-subrayado: var(--primary, #793FED);
    --ecm-boton: var(--ecm-acento);
    --ecm-sobre-boton: var(--ecm-sobre-acento);
    --ecm-precio: var(--ecm-tinta);
    --ecm-f-nav: 'Inter', system-ui, -apple-system, sans-serif;
    --ecm-nav-size: 14px;
    --ecm-nav-peso: 600;
    --ecm-nav-ls: 0;
    --ecm-nav-tt: none;
    --ecm-f-titulo: 'Inter', system-ui, -apple-system, sans-serif;
    --ecm-titulo-size: 16px;
    --ecm-titulo-peso: 700;
    --ecm-titulo-tt: none;
    --ecm-titulo-ls: 0;
    --ecm-f-cuerpo: 'Inter', system-ui, -apple-system, sans-serif;
    --ecm-radio: 8px;
    --ecm-radio-img: 8px;
    --ecm-foto-ratio: 4 / 3;
    --ecm-prod-ratio: 1 / 1;
    --ecm-prod-fit: contain;
    --ecm-prod-bg: #F6F7F9;
    --ecm-sombra: rgba(17, 24, 39, .18);
    --ecm-velo: rgba(17, 24, 39, .28);
    /* Departamentos */
    --ecm-b-bar-bg: #F6F7F9;
    --ecm-b-bar-tinta: #111827;
    --ecm-b-bar-tinta-2: #4B5563;
    --ecm-b-bar-linea: #E5E7EB;
    --ecm-b-btn-bg: var(--primary, #793FED);
    --ecm-b-btn-tinta: var(--ecm-sobre-primario, #fff);
    --ecm-b-hover: rgba(17, 24, 39, .06);
    --ecm-b-oferta: var(--primary, #793FED);
    --ecm-b-item-size: 14px;
    --ecm-b-cols: 4;
}

/* ── Tokens por plantilla visual (sacados de css/plantillas/{id}.css y portada-visual.css) ── */
.ec-mm--tpl-ferreteria {
    --ecm-papel: #FFFFFF; --ecm-suave: #F2F0EB; --ecm-tinta: #17150F; --ecm-gris: #4C473F; --ecm-gris-claro: #8A8377;
    --ecm-linea: #DCD7CC; --ecm-acento: #FFC20E; --ecm-sobre-acento: #17150F; --ecm-subrayado: #FFC20E; --ecm-precio: #17150F;
    --ecm-f-nav: 'Barlow Condensed', 'Arial Narrow', sans-serif; --ecm-nav-size: 17px; --ecm-nav-peso: 700; --ecm-nav-ls: .035em; --ecm-nav-tt: uppercase;
    --ecm-f-titulo: 'Barlow Condensed', 'Arial Narrow', sans-serif; --ecm-titulo-size: 19px; --ecm-titulo-peso: 700; --ecm-titulo-tt: uppercase; --ecm-titulo-ls: .02em;
    --ecm-f-cuerpo: 'DM Sans', 'Inter', system-ui, sans-serif; --ecm-radio: 3px; --ecm-radio-img: 2px;
    --ecm-foto-ratio: 4 / 3; --ecm-prod-ratio: 1 / 1; --ecm-prod-fit: contain; --ecm-prod-bg: #F2F0EB; --ecm-sombra: rgba(20, 18, 14, .22); --ecm-velo: rgba(20, 18, 14, .32);
    --ecm-b-bar-bg: #17150F; --ecm-b-bar-tinta: #FFFFFF; --ecm-b-bar-tinta-2: #B9B3A8; --ecm-b-bar-linea: #17150F;
    --ecm-b-btn-bg: #FFC20E; --ecm-b-btn-tinta: #17150F; --ecm-b-hover: rgba(255, 255, 255, .1); --ecm-b-oferta: #FFC20E; --ecm-b-item-size: 16px; --ecm-b-cols: 4;
}
.ec-mm--tpl-moda {
    --ecm-papel: #FBF8F4; --ecm-suave: #F7F2EC; --ecm-tinta: #1B1815; --ecm-gris: #6B6157; --ecm-gris-claro: #9A8F84;
    --ecm-linea: rgba(27, 24, 21, .14); --ecm-acento: color-mix(in srgb, var(--primary, #793FED) 70%, #1B1815); --ecm-sobre-acento: #FBF8F4; --ecm-subrayado: #1B1815; --ecm-precio: #1B1815;
    --ecm-f-nav: 'Jost', 'Inter', system-ui, sans-serif; --ecm-nav-size: 12.5px; --ecm-nav-peso: 500; --ecm-nav-ls: .16em; --ecm-nav-tt: uppercase;
    --ecm-f-titulo: 'Cormorant Garamond', Georgia, serif; --ecm-titulo-size: 23px; --ecm-titulo-peso: 600; --ecm-titulo-tt: none; --ecm-titulo-ls: 0;
    --ecm-f-cuerpo: 'Jost', 'Inter', system-ui, sans-serif; --ecm-radio: 0px; --ecm-radio-img: 0px;
    --ecm-foto-ratio: 4 / 5; --ecm-prod-ratio: 4 / 5; --ecm-prod-fit: cover; --ecm-prod-bg: #ECE3D7; --ecm-sombra: rgba(20, 18, 14, .2); --ecm-velo: rgba(20, 18, 14, .32);
    --ecm-b-bar-bg: #F7F2EC; --ecm-b-bar-tinta: #1B1815; --ecm-b-bar-tinta-2: #6B6157; --ecm-b-bar-linea: rgba(27, 24, 21, .14);
    --ecm-b-btn-bg: #1B1815; --ecm-b-btn-tinta: #FBF8F4; --ecm-b-hover: #ECE3D7; --ecm-b-oferta: var(--ecm-acento); --ecm-b-item-size: 12px; --ecm-b-cols: 3;
}
.ec-mm--tpl-bodega {
    --ecm-papel: #FFFFFF; --ecm-suave: #FFF8EC; --ecm-tinta: #1D1A16; --ecm-gris: #57504A; --ecm-gris-claro: #8C847B;
    --ecm-linea: #EEE2CC; --ecm-acento: #FFD43B; --ecm-sobre-acento: #1D1A16; --ecm-subrayado: var(--primary, #793FED); --ecm-precio: #1D1A16;
    --ecm-f-nav: 'Rubik', 'Inter', system-ui, sans-serif; --ecm-nav-size: 15px; --ecm-nav-peso: 600; --ecm-nav-ls: 0; --ecm-nav-tt: none;
    --ecm-f-titulo: 'Rubik', 'Inter', system-ui, sans-serif; --ecm-titulo-size: 17px; --ecm-titulo-peso: 700; --ecm-titulo-tt: none; --ecm-titulo-ls: 0;
    --ecm-f-cuerpo: 'Inter', system-ui, sans-serif; --ecm-radio: 12px; --ecm-radio-img: 12px;
    --ecm-foto-ratio: 1 / 1; --ecm-prod-ratio: 1 / 1; --ecm-prod-fit: contain; --ecm-prod-bg: #FFF8EC;
    --ecm-b-bar-bg: #1D1A16; --ecm-b-bar-tinta: #FFFFFF; --ecm-b-bar-tinta-2: #CFC6BA; --ecm-b-bar-linea: #1D1A16;
    --ecm-b-btn-bg: #FFD43B; --ecm-b-btn-tinta: #1D1A16; --ecm-b-hover: rgba(255, 255, 255, .1); --ecm-b-oferta: #FFD43B; --ecm-b-item-size: 15px; --ecm-b-cols: 4;
}
.ec-mm--tpl-restaurante {
    --ecm-papel: #FFFCF7; --ecm-suave: #FBF3E7; --ecm-tinta: #241811; --ecm-gris: #6B5848; --ecm-gris-claro: #9A8777;
    --ecm-linea: rgba(36, 24, 17, .13); --ecm-acento: #F4B32A; --ecm-sobre-acento: #1B120D; --ecm-subrayado: #F4B32A; --ecm-precio: #241811;
    --ecm-f-nav: 'Barlow Condensed', 'Oswald', 'Arial Narrow', sans-serif; --ecm-nav-size: 17px; --ecm-nav-peso: 700; --ecm-nav-ls: .035em; --ecm-nav-tt: uppercase;
    --ecm-f-titulo: 'Fraunces', Georgia, serif; --ecm-titulo-size: 21px; --ecm-titulo-peso: 500; --ecm-titulo-tt: none; --ecm-titulo-ls: 0;
    --ecm-f-cuerpo: 'DM Sans', 'Inter', system-ui, sans-serif; --ecm-radio: 6px; --ecm-radio-img: 6px;
    --ecm-foto-ratio: 4 / 3; --ecm-prod-ratio: 4 / 3; --ecm-prod-fit: cover; --ecm-prod-bg: #EAD6BA; --ecm-sombra: rgba(27, 18, 13, .24); --ecm-velo: rgba(27, 18, 13, .34);
    --ecm-b-bar-bg: #1B120D; --ecm-b-bar-tinta: #FBF3E7; --ecm-b-bar-tinta-2: #CDB9A3; --ecm-b-bar-linea: #1B120D;
    --ecm-b-btn-bg: #F4B32A; --ecm-b-btn-tinta: #1B120D; --ecm-b-hover: rgba(246, 235, 221, .1); --ecm-b-oferta: #F4B32A; --ecm-b-item-size: 16px; --ecm-b-cols: 3;
}
.ec-mm--tpl-belleza {
    --ecm-papel: #FFFDFC; --ecm-suave: #FBF5F2; --ecm-tinta: #3A2A2F; --ecm-gris: #6C5960; --ecm-gris-claro: #9C8A90;
    --ecm-linea: rgba(58, 42, 47, .12); --ecm-acento: color-mix(in srgb, var(--primary, #793FED) 78%, #2D1F25); --ecm-sobre-acento: #FFFDFC; --ecm-subrayado: #3A2A2F; --ecm-precio: #3A2A2F;
    --ecm-f-nav: 'Outfit', 'Inter', system-ui, sans-serif; --ecm-nav-size: 13px; --ecm-nav-peso: 500; --ecm-nav-ls: .12em; --ecm-nav-tt: uppercase;
    --ecm-f-titulo: 'Playfair Display', Georgia, serif; --ecm-titulo-size: 21px; --ecm-titulo-peso: 500; --ecm-titulo-tt: none; --ecm-titulo-ls: 0;
    --ecm-f-cuerpo: 'Outfit', 'Inter', system-ui, sans-serif; --ecm-radio: 999px; --ecm-radio-img: 14px;
    --ecm-foto-ratio: 4 / 5; --ecm-prod-ratio: 4 / 5; --ecm-prod-fit: cover; --ecm-prod-bg: #F4E4DE;
    --ecm-b-bar-bg: #FBF5F2; --ecm-b-bar-tinta: #3A2A2F; --ecm-b-bar-tinta-2: #6C5960; --ecm-b-bar-linea: rgba(58, 42, 47, .12);
    --ecm-b-btn-bg: #2D1F25; --ecm-b-btn-tinta: #F8EEEA; --ecm-b-hover: #F4E4DE; --ecm-b-oferta: var(--ecm-acento); --ecm-b-item-size: 13px; --ecm-b-cols: 3;
}
.ec-mm--tpl-hogar {
    --ecm-papel: #FBF8F3; --ecm-suave: #F4EFE7; --ecm-tinta: #2A2520; --ecm-gris: #655A50; --ecm-gris-claro: #998C80;
    --ecm-linea: rgba(42, 37, 32, .13); --ecm-acento: color-mix(in srgb, var(--primary, #793FED) 58%, #1D1915); --ecm-sobre-acento: #FBF8F3; --ecm-subrayado: #2A2520; --ecm-precio: #2A2520;
    --ecm-f-nav: 'Manrope', 'Inter', system-ui, sans-serif; --ecm-nav-size: 14px; --ecm-nav-peso: 600; --ecm-nav-ls: .01em; --ecm-nav-tt: none;
    --ecm-f-titulo: 'Fraunces', Georgia, serif; --ecm-titulo-size: 21px; --ecm-titulo-peso: 500; --ecm-titulo-tt: none; --ecm-titulo-ls: 0;
    --ecm-f-cuerpo: 'Manrope', 'Inter', system-ui, sans-serif; --ecm-radio: 12px; --ecm-radio-img: 16px;
    --ecm-foto-ratio: 4 / 5; --ecm-prod-ratio: 1 / 1; --ecm-prod-fit: cover; --ecm-prod-bg: #E9E1D4;
    --ecm-b-bar-bg: #F4EFE7; --ecm-b-bar-tinta: #2A2520; --ecm-b-bar-tinta-2: #655A50; --ecm-b-bar-linea: rgba(42, 37, 32, .13);
    --ecm-b-btn-bg: #2B2722; --ecm-b-btn-tinta: #F4EFE7; --ecm-b-hover: #E9E1D4; --ecm-b-oferta: var(--ecm-acento); --ecm-b-item-size: 14px; --ecm-b-cols: 3;
}
.ec-mm--tpl-tecnologia {
    --ecm-a-bar-bg: #0A0C10; --ecm-a-bar-tinta: #EEF1F6;
    --ecm-papel: #12151B; --ecm-suave: #0E1116; --ecm-tinta: #EEF1F6; --ecm-gris: #A7AFBC; --ecm-gris-claro: #8A93A3;
    --ecm-linea: rgba(255, 255, 255, .1); --ecm-acento: var(--primary, #793FED); --ecm-subrayado: color-mix(in srgb, var(--primary, #793FED) 52%, #fff); --ecm-precio: #EEF1F6;
    --ecm-f-nav: 'Sora', 'Inter', system-ui, sans-serif; --ecm-nav-size: 14px; --ecm-nav-peso: 600; --ecm-nav-ls: 0; --ecm-nav-tt: none;
    --ecm-f-titulo: 'Sora', 'Inter', system-ui, sans-serif; --ecm-titulo-size: 16px; --ecm-titulo-peso: 600; --ecm-titulo-tt: none; --ecm-titulo-ls: -.01em;
    --ecm-f-cuerpo: 'Inter', system-ui, sans-serif; --ecm-radio: 10px; --ecm-radio-img: 10px;
    --ecm-foto-ratio: 4 / 3; --ecm-prod-ratio: 1 / 1; --ecm-prod-fit: contain; --ecm-prod-bg: #E7EAEE; --ecm-sombra: rgba(0, 0, 0, .5); --ecm-velo: rgba(0, 0, 0, .45);
    --ecm-b-bar-bg: #0A0C10; --ecm-b-bar-tinta: #EEF1F6; --ecm-b-bar-tinta-2: #A7AFBC; --ecm-b-bar-linea: #0A0C10;
    --ecm-b-hover: rgba(255, 255, 255, .08); --ecm-b-oferta: color-mix(in srgb, var(--primary, #793FED) 52%, #fff); --ecm-b-item-size: 14px; --ecm-b-cols: 4;
}
.ec-mm--tpl-general {
    --ecm-papel: #FFFFFF; --ecm-suave: #F4F5F7; --ecm-tinta: #12141A; --ecm-gris: #4A5060; --ecm-gris-claro: #858B99; --ecm-linea: #E4E6EB;
    --ecm-f-nav: 'Outfit', 'Inter', system-ui, sans-serif; --ecm-nav-size: 15px; --ecm-nav-peso: 600;
    --ecm-f-titulo: 'Outfit', 'Inter', system-ui, sans-serif; --ecm-titulo-size: 17px; --ecm-titulo-peso: 700;
    --ecm-f-cuerpo: 'DM Sans', 'Inter', system-ui, sans-serif; --ecm-radio: 10px; --ecm-radio-img: 10px; --ecm-prod-bg: #F4F5F7;
    --ecm-b-bar-bg: #F4F5F7; --ecm-b-bar-tinta: #12141A; --ecm-b-bar-tinta-2: #4A5060; --ecm-b-bar-linea: #E4E6EB; --ecm-b-hover: rgba(18, 20, 26, .06);
}

/* Modo oscuro: superficies y tintas oscuras (el acento y las fotos se quedan). */
.ec-dark .ec-mm, html.dark .ec-mm {
    --ecm-cabecera: #111827; --ecm-papel: #161B26; --ecm-suave: #1E2533; --ecm-tinta: #F3F4F6; --ecm-tinta-titulo: #F3F4F6;
    --ecm-gris: #C3C8D1; --ecm-gris-claro: #8C94A2; --ecm-linea: rgba(255, 255, 255, .12); --ecm-precio: #F3F4F6;
    --ecm-sombra: rgba(0, 0, 0, .5); --ecm-velo: rgba(0, 0, 0, .5);
    --ecm-a-bar-bg: #111827; --ecm-a-bar-tinta: #F3F4F6; --ecm-subrayado: var(--ecm-acento);
}
.ec-dark .ec-mm:not(.ec-mm--tpl-ferreteria):not(.ec-mm--tpl-bodega):not(.ec-mm--tpl-restaurante):not(.ec-mm--tpl-tecnologia),
html.dark .ec-mm:not(.ec-mm--tpl-ferreteria):not(.ec-mm--tpl-bodega):not(.ec-mm--tpl-restaurante):not(.ec-mm--tpl-tecnologia) {
    --ecm-b-bar-bg: #0F1420; --ecm-b-bar-tinta: #F3F4F6; --ecm-b-bar-tinta-2: #C3C8D1; --ecm-b-bar-linea: rgba(255, 255, 255, .08); --ecm-b-hover: rgba(255, 255, 255, .08);
    --ecm-acento: color-mix(in srgb, var(--primary, #793FED) 70%, #fff); --ecm-sobre-acento: #111827;
}
.ec-dark .ec-mm--tpl-moda, html.dark .ec-mm--tpl-moda,
.ec-dark .ec-mm--tpl-belleza, html.dark .ec-mm--tpl-belleza,
.ec-dark .ec-mm--tpl-hogar, html.dark .ec-mm--tpl-hogar { --ecm-b-btn-bg: #F3F4F6; --ecm-b-btn-tinta: #111827; }

/* ══ Barra (computadora) ═══════════════════════════════════════════════════════ */
.ec-nav-menu.ec-mm {
    background: var(--ecm-a-bar-bg);
    border-bottom: 1px solid var(--ecm-linea);
    font-family: var(--ecm-f-cuerpo);
}
.ec-mm .ec-nav-menu__inner {
    max-width: 1400px; /* el mismo contenedor que la cabecera (.ec-header__inner) */
    padding: 0 24px;
    gap: 4px;
    align-items: stretch;
    box-sizing: border-box;
}
.ec-mm .ec-nav-menu__inner > .ec-nav-menu__item:first-child { margin-left: -12px; }
.ec-mm .ec-nav-menu__link {
    position: relative;
    height: 48px;
    padding: 0 12px;
    background: none;
    color: var(--ecm-a-bar-tinta);
    font-family: var(--ecm-f-nav);
    font-size: var(--ecm-nav-size);
    font-weight: var(--ecm-nav-peso);
    letter-spacing: var(--ecm-nav-ls);
    text-transform: var(--ecm-nav-tt);
    line-height: 1;
}
.ec-mm .ec-nav-menu__link::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: -1px;
    height: 3px;
    background: var(--ecm-subrayado);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .18s ease;
}
.ec-mm--tpl-moda .ec-nav-menu__link::after, .ec-mm--tpl-belleza .ec-nav-menu__link::after, .ec-mm--tpl-hogar .ec-nav-menu__link::after { height: 1px; bottom: 12px; }
.ec-mm .ec-nav-menu__link:hover,
.ec-mm .ec-nav-menu__item.is-active > .ec-nav-menu__link,
.ec-mm .ec-nav-menu__item.is-open > .ec-nav-menu__link,
.ec-mm .ec-nav-menu__item--mega.is-open > .ec-nav-menu__link,
.ec-mm .ec-nav-menu__item--mas.is-open > .ec-nav-menu__mas-btn { background: none; color: var(--ecm-a-bar-tinta); }
.ec-mm .ec-nav-menu__link:hover::after,
.ec-mm .ec-nav-menu__link:focus-visible::after,
.ec-mm .ec-nav-menu__item.is-active > .ec-nav-menu__link::after,
.ec-mm .ec-nav-menu__item.is-open > .ec-nav-menu__link::after,
.ec-mm .ec-nav-menu__item.has-dropdown:hover > .ec-nav-menu__link::after { transform: scaleX(1); }
.ec-mm .ec-nav-menu__link:focus-visible { outline: 2px solid var(--ecm-a-bar-tinta); outline-offset: -4px; border-radius: var(--ecm-radio); }
.ec-mm .ec-nav-menu__arrow { width: 14px; height: 14px; opacity: .8; }
/* En la barra, solo el texto (como en los prototipos aprobados); los íconos siguen en los
   desplegables, en «Más» y en el celular. */
.ec-mm .ec-nav-menu__inner > .ec-nav-menu__item > .ec-nav-menu__link > .ec-ic,
.ec-mm .ec-nav-menu__inner > .ec-nav-menu__item > .ec-nav-menu__link > i,
.ec-mm .ec-nav-menu__inner > .ec-nav-menu__item > .ec-nav-menu__link > span[aria-hidden="true"] { display: none; }
.ec-mm.ec-mm--columnas .ec-nav-menu__inner > .ec-nav-menu__item--mega > .ec-nav-menu__link > .ec-ic { display: inline-flex; width: 17px; height: 17px; flex: none; }
/* La barra ya tiene su borde: sin el hueco blanco de 7 px que dejaba la barra vieja. */
@media (min-width: 768px) { .ec-nav-menu.ec-mm.ec-nav-menu--on ~ .ec-main { padding-top: 0; } }
/* «Ofertas» a la derecha y destacado */
.ec-mm .ec-nav-menu__item--oferta { margin-left: auto; display: flex; align-items: center; order: 2; }
.ec-mm .ec-nav-menu__item--mas { order: 1; }
.ec-mm .ec-nav-menu__item--oferta > .ec-nav-menu__link {
    height: 30px;
    padding: 0 12px;
    border-radius: var(--ecm-radio);
    background: var(--ecm-acento);
    color: var(--ecm-sobre-acento);
}
.ec-mm .ec-nav-menu__item--oferta > .ec-nav-menu__link::after { display: none; }
.ec-mm .ec-nav-menu__item--oferta > .ec-nav-menu__link:hover { background: var(--ecm-acento); color: var(--ecm-sobre-acento); filter: brightness(.95); }
.ec-mm--tpl-moda .ec-nav-menu__item--oferta > .ec-nav-menu__link,
.ec-mm--tpl-belleza .ec-nav-menu__item--oferta > .ec-nav-menu__link,
.ec-mm--tpl-hogar .ec-nav-menu__item--oferta > .ec-nav-menu__link {
    height: auto; padding: 0 0 3px; margin: 0 0 0 12px; background: transparent; color: var(--ecm-acento); border-bottom: 1px solid currentColor; border-radius: 0;
}
/* Desplegables normales y «Más» con los colores de la tienda */
.ec-mm .ec-nav-menu__dropdown, .ec-mm .ec-nav-menu__flyout {
    background: var(--ecm-papel);
    border: 1px solid var(--ecm-linea);
    border-radius: var(--ecm-radio);
    box-shadow: 0 16px 32px var(--ecm-sombra);
    padding: 6px;
}
.ec-mm .ec-nav-menu__dropdown { top: 100%; }
.ec-mm--tpl-belleza .ec-nav-menu__dropdown, .ec-mm--tpl-belleza .ec-nav-menu__flyout { border-radius: 14px; }
.ec-mm .ec-nav-menu__dropdown-link {
    padding: 10px 12px;
    border-radius: var(--ecm-radio);
    color: var(--ecm-tinta);
    font-family: var(--ecm-f-cuerpo);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
}
.ec-mm--tpl-belleza .ec-nav-menu__dropdown-link { border-radius: 10px; }
.ec-mm .ec-nav-menu__dropdown-link:hover,
.ec-mm .ec-nav-menu__sub.has-flyout:hover > .ec-nav-menu__dropdown-link,
.ec-mm .ec-nav-menu__mas-lista .ec-nav-menu__dropdown-link:hover,
.ec-mm .ec-nav-menu__mas-lista .ec-nav-menu__sub.has-flyout:focus-within > .ec-nav-menu__dropdown-link { background: var(--ecm-suave); color: var(--ecm-tinta); }
.ec-mm .ec-nav-menu__dropdown-link:focus-visible { outline: 2px solid var(--ecm-tinta); outline-offset: -2px; }
.ec-mm .ec-nav-menu__flyout { top: -7px; }

/* ── Velo detrás del megamenú abierto (sombra recortada: no oscurece la barra ni la cabecera) ── */
.ec-mm .ec-mega {
    box-shadow: 0 24px 40px -12px var(--ecm-sombra), 0 0 0 100vmax var(--ecm-velo);
    clip-path: inset(0 -100vmax -100vmax -100vmax);
}

/* ══ Estilo «Columnas con foto» ═══════════════════════════════════════════════ */
.ec-mm .ec-mega.ec-mma {
    background: var(--ecm-papel);
    border-top: 1px solid var(--ecm-linea);
    border-bottom: 1px solid var(--ecm-linea);
    color: var(--ecm-tinta);
    font-family: var(--ecm-f-cuerpo);
    max-height: calc(100vh - var(--header-h, 73px) - 48px);
    white-space: normal;
}
.ec-mma__grid {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 264px;
    gap: 24px;
    box-sizing: border-box;
}
.ec-mma__grid--sin-promo { grid-template-columns: minmax(0, 1fr); }
.ec-mma__cols {
    display: grid;
    grid-template-columns: repeat(var(--ec-mma-cols, 6), minmax(0, 1fr));
    gap: 28px 24px;
    align-items: start;
}
.ec-mma__col { min-width: 0; display: flex; flex-direction: column; height: 100%; }
.ec-mma__foto {
    display: block;
    overflow: hidden;
    border-radius: var(--ecm-radio-img);
    background: var(--ecm-suave);
    aspect-ratio: var(--ecm-foto-ratio);
}
.ec-mma__foto img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.ec-mma__col:hover .ec-mma__foto img { transform: scale(1.04); }
.ec-mma__titulo {
    display: block;
    margin: 12px 0 8px;
    color: var(--ecm-tinta-titulo);
    font-family: var(--ecm-f-titulo);
    font-size: var(--ecm-titulo-size);
    font-weight: var(--ecm-titulo-peso);
    line-height: 1.08;
    letter-spacing: var(--ecm-titulo-ls);
    text-transform: var(--ecm-titulo-tt);
    text-decoration: none;
}
a.ec-mma__titulo:hover { color: var(--ecm-tinta-titulo); text-decoration: underline; text-decoration-color: var(--ecm-subrayado); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.ec-mm--tpl-moda a.ec-mma__titulo:hover, .ec-mm--tpl-belleza a.ec-mma__titulo:hover, .ec-mm--tpl-hogar a.ec-mma__titulo:hover { text-decoration-thickness: 1px; }
ul.ec-mma__lista { list-style: none; margin: 0 0 10px; padding: 0; }
.ec-mma__lista a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    padding: 4px 0;
    color: var(--ecm-gris);
    font: 400 13.5px/1.4 var(--ecm-f-cuerpo);
    text-decoration: none;
}
.ec-mma__lista a:hover { color: var(--ecm-tinta); text-decoration: underline; text-underline-offset: 3px; }
.ec-mma__todo, .ec-mmb__todo {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    padding-top: 4px;
    color: var(--ecm-tinta);
    font: 600 13px/1.2 var(--ecm-f-cuerpo);
    text-decoration: none;
    align-self: flex-start;
}
.ec-mma__todo:hover, .ec-mmb__todo:hover { color: var(--ecm-tinta); text-decoration: none; }
.ec-mma__todo svg, .ec-mmb__todo svg { width: 15px; height: 15px; flex: none; transition: transform .15s; }
.ec-mma__todo:hover svg, .ec-mmb__todo:hover svg { transform: translateX(3px); }
.ec-mm--tpl-moda .ec-mma__todo, .ec-mm--tpl-moda .ec-mmb__todo,
.ec-mm--tpl-belleza .ec-mma__todo, .ec-mm--tpl-belleza .ec-mmb__todo { font-size: 11.5px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; }

/* Promo: «fuerte» (foto con velo y texto blanco) por defecto; «editorial» (foto arriba y texto
   debajo) en moda, belleza, hogar y la tienda sin plantilla. */
.ec-mm-promo {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 100%;
    overflow: hidden;
    border-radius: var(--ecm-radio-img);
    background: #222;
    color: #fff;
    text-decoration: none;
    isolation: isolate;
}
a.ec-mm-promo:hover { color: #fff; text-decoration: none; }
.ec-mm-promo__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .4s ease; }
a.ec-mm-promo:hover .ec-mm-promo__img { transform: scale(1.03); }
.ec-mm-promo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(20, 18, 14, 0) 30%, rgba(20, 18, 14, .86) 100%); }
.ec-mm-promo__cuerpo { padding: 20px; }
.ec-mm-promo__sello {
    display: inline-block;
    margin-bottom: 10px;
    padding: 5px 9px;
    border-radius: var(--ecm-radio);
    background: var(--ecm-acento);
    color: var(--ecm-sobre-acento);
    font: 700 12px/1 var(--ecm-f-cuerpo);
    letter-spacing: .08em;
    text-transform: uppercase;
}
.ec-mm--tpl-ferreteria .ec-mm-promo__sello, .ec-mm--tpl-restaurante .ec-mm-promo__sello { font: 700 13px/1 var(--ecm-f-nav); }
.ec-mm-promo__titulo {
    display: block;
    margin: 0 0 6px;
    font-family: var(--ecm-f-titulo);
    font-size: 24px;
    font-weight: 800;
    line-height: 1.02;
    text-transform: var(--ecm-titulo-tt);
    letter-spacing: var(--ecm-titulo-ls);
}
.ec-mm--tpl-ferreteria .ec-mm-promo__titulo { font-size: 26px; line-height: .98; }
.ec-mm-promo__texto { display: block; margin: 0 0 14px; font: 400 13px/1.45 var(--ecm-f-cuerpo); color: rgba(255, 255, 255, .86); }
.ec-mm-promo__btn {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 8px;
    min-height: 40px;
    padding: 0 16px;
    border-radius: var(--ecm-radio);
    background: var(--ecm-boton);
    color: var(--ecm-sobre-boton);
    font: 700 14px/1 var(--ecm-f-cuerpo);
    letter-spacing: .04em;
    text-transform: uppercase;
}
.ec-mm--tpl-ferreteria .ec-mm-promo__btn, .ec-mm--tpl-restaurante .ec-mm-promo__btn { font: 700 15px/1 var(--ecm-f-nav); letter-spacing: .06em; }
.ec-mm-promo__btn svg { width: 16px; height: 16px; }
.ec-mm-promo__cuerpo { display: flex; flex-direction: column; align-items: flex-start; }
/* Editorial */
.ec-mm--neutro .ec-mma .ec-mm-promo, .ec-mm--tpl-moda .ec-mma .ec-mm-promo, .ec-mm--tpl-belleza .ec-mma .ec-mm-promo, .ec-mm--tpl-hogar .ec-mma .ec-mm-promo {
    justify-content: flex-start; background: none; color: var(--ecm-tinta); min-height: 0;
}
.ec-mm--neutro .ec-mma .ec-mm-promo::before, .ec-mm--tpl-moda .ec-mma .ec-mm-promo::before, .ec-mm--tpl-belleza .ec-mma .ec-mm-promo::before, .ec-mm--tpl-hogar .ec-mma .ec-mm-promo::before { display: none; }
.ec-mm--neutro .ec-mma .ec-mm-promo__img, .ec-mm--tpl-moda .ec-mma .ec-mm-promo__img, .ec-mm--tpl-belleza .ec-mma .ec-mm-promo__img, .ec-mm--tpl-hogar .ec-mma .ec-mm-promo__img {
    position: static; display: block; height: 190px; z-index: auto; border-radius: var(--ecm-radio-img);
}
.ec-mm--neutro .ec-mma .ec-mm-promo__cuerpo, .ec-mm--tpl-moda .ec-mma .ec-mm-promo__cuerpo, .ec-mm--tpl-belleza .ec-mma .ec-mm-promo__cuerpo, .ec-mm--tpl-hogar .ec-mma .ec-mm-promo__cuerpo { padding: 14px 0 0; }
.ec-mm--neutro .ec-mma .ec-mm-promo__texto, .ec-mm--tpl-moda .ec-mma .ec-mm-promo__texto, .ec-mm--tpl-belleza .ec-mma .ec-mm-promo__texto, .ec-mm--tpl-hogar .ec-mma .ec-mm-promo__texto { color: var(--ecm-gris); margin-bottom: 10px; }
a.ec-mm-promo:is(.ec-mm--neutro *, .ec-mm--tpl-moda *, .ec-mm--tpl-belleza *, .ec-mm--tpl-hogar *):hover { color: var(--ecm-tinta); }
.ec-mm--tpl-moda .ec-mm-promo__sello, .ec-mm--tpl-belleza .ec-mm-promo__sello, .ec-mm--tpl-hogar .ec-mm-promo__sello {
    background: none; padding: 0; margin-bottom: 6px; color: var(--ecm-gris); font: 500 11px/1 var(--ecm-f-cuerpo); letter-spacing: .18em;
}
.ec-mm--tpl-moda .ec-mm-promo .ec-mm-promo__titulo, .ec-mm--tpl-belleza .ec-mm-promo .ec-mm-promo__titulo, .ec-mm--tpl-hogar .ec-mm-promo .ec-mm-promo__titulo {
    font-style: italic; font-weight: 500; font-size: 26px; line-height: 1.05; text-transform: none; margin-bottom: 8px;
}
.ec-mm--tpl-moda .ec-mm-promo__btn, .ec-mm--tpl-belleza .ec-mma .ec-mm-promo__btn, .ec-mm--tpl-hogar .ec-mma .ec-mm-promo__btn {
    min-height: 0; padding: 0 0 3px; background: none; color: var(--ecm-tinta); border-bottom: 1px solid currentColor; border-radius: 0;
    font: 500 11.5px/1 var(--ecm-f-cuerpo); letter-spacing: .16em;
}
.ec-mm--neutro .ec-mma .ec-mm-promo__titulo { font-size: 20px; font-weight: 700; }
.ec-mm--neutro .ec-mma .ec-mm-promo__btn { min-height: 36px; font-size: 13px; text-transform: none; letter-spacing: 0; }

.ec-mma__pie { border-top: 1px solid var(--ecm-linea); background: var(--ecm-suave); }
.ec-mma__pie-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 44px;
    box-sizing: border-box;
    font: 500 13px/1.2 var(--ecm-f-cuerpo);
    color: var(--ecm-gris);
}
.ec-mma__pie a { display: inline-flex; align-items: center; gap: 6px; color: var(--ecm-tinta); font-weight: 600; text-decoration: none; }
.ec-mma__pie a:hover { color: var(--ecm-tinta); text-decoration: underline; text-underline-offset: 3px; }
.ec-mma__pie svg { width: 16px; height: 16px; }
.ec-mm .ec-mega a:focus-visible, .ec-mmb__cat:focus-visible { outline: 2px solid var(--ecm-tinta); outline-offset: 2px; border-radius: var(--ecm-radio); }

@media (min-width: 768px) and (max-width: 1199px) {
    .ec-mma__grid { grid-template-columns: minmax(0, 1fr) 220px; gap: 20px; padding: 20px 24px; }
    .ec-mma__cols { grid-template-columns: repeat(min(var(--ec-mma-cols, 6), 4), minmax(0, 1fr)); gap: 22px 18px; }
}
@media (min-width: 768px) and (max-width: 959px) {
    .ec-mma__grid { grid-template-columns: minmax(0, 1fr); }
    .ec-mma__grid > .ec-mm-promo { display: none; }
    .ec-mma__cols { grid-template-columns: repeat(min(var(--ec-mma-cols, 6), 3), minmax(0, 1fr)); }
}

/* ══ Estilo «Departamentos con precios» ═══════════════════════════════════════ */
.ec-nav-menu.ec-mm--departamentos { background: var(--ecm-b-bar-bg); border-bottom-color: var(--ecm-b-bar-linea); }
.ec-mm--departamentos .ec-nav-menu__inner { position: relative; align-items: center; min-height: 52px; gap: 2px; }
.ec-mm--departamentos .ec-nav-menu__inner > .ec-nav-menu__item:first-child { margin-left: 0; }
.ec-mm--departamentos .ec-nav-menu__item { display: flex; align-items: center; }
.ec-mm--departamentos .ec-nav-menu__link {
    height: 40px;
    border-radius: var(--ecm-radio);
    color: var(--ecm-b-bar-tinta);
    font-size: var(--ecm-b-item-size);
}
.ec-mm--departamentos .ec-nav-menu__link::after { display: none; }
.ec-mm--departamentos .ec-nav-menu__link:hover,
.ec-mm--departamentos .ec-nav-menu__item.is-active > .ec-nav-menu__link,
.ec-mm--departamentos .ec-nav-menu__item.has-dropdown:hover > .ec-nav-menu__link,
.ec-mm--departamentos .ec-nav-menu__item--mas.is-open > .ec-nav-menu__mas-btn { background: var(--ecm-b-hover); color: var(--ecm-b-bar-tinta); }
.ec-mm--departamentos .ec-nav-menu__link:focus-visible { outline-color: var(--ecm-b-bar-tinta); outline-offset: -2px; }
.ec-mm--departamentos .ec-nav-menu__item--oferta { margin-left: 0; order: 0; }
.ec-mm--departamentos .ec-nav-menu__item--oferta > .ec-nav-menu__link,
.ec-mm--departamentos.ec-mm--tpl-moda .ec-nav-menu__item--oferta > .ec-nav-menu__link,
.ec-mm--departamentos.ec-mm--tpl-belleza .ec-nav-menu__item--oferta > .ec-nav-menu__link,
.ec-mm--departamentos.ec-mm--tpl-hogar .ec-nav-menu__item--oferta > .ec-nav-menu__link {
    height: 40px; padding: 0 12px; margin: 0; border: 0; border-radius: var(--ecm-radio); background: none; color: var(--ecm-b-oferta);
}
.ec-mm--departamentos .ec-nav-menu__item--oferta > .ec-nav-menu__link:hover { background: var(--ecm-b-hover); color: var(--ecm-b-oferta); filter: none; }
.ec-mm--departamentos .ec-nav-menu__item--mas { order: 0; }
.ec-mm--departamentos .ec-nav-menu__mas-btn { height: 40px; }

/* Botón «Categorías ☰» */
.ec-mm .ec-mmb-dep { position: static; margin-right: 8px; }
.ec-mm .ec-nav-menu__inner > .ec-mmb-dep > .ec-nav-menu__link,
.ec-mm .ec-nav-menu__inner > .ec-mmb-dep > .ec-nav-menu__link:hover,
.ec-mm .ec-nav-menu__inner > .ec-mmb-dep.is-active > .ec-nav-menu__link,
.ec-mm .ec-nav-menu__inner > .ec-mmb-dep.is-open > .ec-nav-menu__link {
    gap: 10px;
    padding: 0 16px;
    background: var(--ecm-b-btn-bg);
    color: var(--ecm-b-btn-tinta);
    font-size: var(--ecm-nav-size);
}
.ec-mm .ec-mmb-dep > .ec-nav-menu__link:hover { filter: brightness(.96); }
.ec-mm .ec-mmb-dep > .ec-nav-menu__link .ec-mmb-dep__ic { width: 18px; height: 18px; flex: none; }
.ec-mm .ec-mmb-dep > .ec-nav-menu__link:focus-visible { outline: 2px solid var(--ecm-b-bar-tinta); outline-offset: 2px; }

/* Panel */
.ec-mm .ec-mega.ec-mmb {
    left: 24px;
    right: 24px;
    top: 100%;
    overflow: hidden;
    border: 1px solid var(--ecm-linea);
    border-radius: var(--ecm-radio);
    background: var(--ecm-papel);
    color: var(--ecm-tinta);
    font-family: var(--ecm-f-cuerpo);
    white-space: normal;
    max-height: none;
    clip-path: inset(-1px -100vmax -100vmax -100vmax);
}
.ec-mm--tpl-belleza .ec-mega.ec-mmb { border-radius: 18px; }
.ec-mm .ec-nav-menu__item--mega.is-open > .ec-mmb,
.ec-nav-menu.ec-mm:not(.ec-mega-js) .ec-nav-menu__item--mega:hover > .ec-mmb,
.ec-nav-menu.ec-mm:not(.ec-mega-js) .ec-nav-menu__item--mega:focus-within > .ec-mmb { display: grid; }
.ec-mmb { grid-template-columns: 272px minmax(0, 1fr) 248px; }
.ec-mmb--sin-promo { grid-template-columns: 272px minmax(0, 1fr); }
ul.ec-mmb__cats {
    margin: 0;
    padding: 8px;
    list-style: none;
    background: var(--ecm-suave);
    border-right: 1px solid var(--ecm-linea);
    max-height: min(520px, calc(100vh - var(--header-h, 73px) - 80px));
    overflow-y: auto;
    overscroll-behavior: contain;
}
.ec-mmb__cat {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 48px;
    padding: 0 12px;
    border-radius: var(--ecm-radio);
    color: var(--ecm-tinta);
    font: 500 14.5px/1.25 var(--ecm-f-cuerpo);
    text-decoration: none;
    box-sizing: border-box;
}
.ec-mm--tpl-belleza .ec-mmb__cat { border-radius: 12px; }
.ec-mmb__cat:hover { color: var(--ecm-tinta); text-decoration: none; background: color-mix(in srgb, var(--ecm-tinta) 5%, transparent); }
.ec-mmb__cat-ic { display: inline-flex; width: 20px; height: 20px; flex: none; color: var(--ecm-gris); }
.ec-mmb__cat-ic svg, .ec-mmb__cat-ic .ec-ic { width: 20px; height: 20px; }
.ec-mmb__cat-txt { flex: 1; min-width: 0; }
.ec-mmb__cat-flecha { width: 16px; height: 16px; flex: none; color: var(--ecm-gris-claro); }
.ec-mmb__cat[aria-selected="true"] {
    background: var(--ecm-papel);
    font-weight: 700;
    box-shadow: inset 3px 0 0 var(--ecm-acento), 0 1px 2px rgba(0, 0, 0, .05);
}
.ec-mm--tpl-moda .ec-mmb__cat[aria-selected="true"], .ec-mm--tpl-belleza .ec-mmb__cat[aria-selected="true"], .ec-mm--tpl-hogar .ec-mmb__cat[aria-selected="true"] { box-shadow: inset 3px 0 0 var(--ecm-tinta), 0 1px 2px rgba(0, 0, 0, .05); }
.ec-mmb__cat[aria-selected="true"] .ec-mmb__cat-ic, .ec-mmb__cat[aria-selected="true"] .ec-mmb__cat-flecha { color: var(--ecm-tinta); }
.ec-mmb__vista { min-width: 0; padding: 20px 24px 24px; }
.ec-mmb__vista[hidden] { display: none; }
.ec-mmb__cab { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.ec-mmb__titulo {
    margin: 0;
    color: var(--ecm-tinta-titulo);
    font-family: var(--ecm-f-titulo);
    font-size: calc(var(--ecm-titulo-size) + 7px);
    font-weight: var(--ecm-titulo-peso);
    line-height: 1;
    letter-spacing: var(--ecm-titulo-ls);
    text-transform: var(--ecm-titulo-tt);
}
.ec-mmb__todo { flex: none; margin: 0; padding: 0 0 3px; border-bottom: 2px solid var(--ecm-subrayado); align-self: auto; }
.ec-mm--tpl-moda .ec-mmb__todo, .ec-mm--tpl-belleza .ec-mmb__todo, .ec-mm--tpl-hogar .ec-mmb__todo { border-bottom-width: 1px; }
.ec-mmb__cards { display: grid; grid-template-columns: repeat(var(--ecm-b-cols), minmax(0, 1fr)); gap: 16px; }
.ec-mm--tpl-moda .ec-mmb__card:nth-child(n+4), .ec-mm--tpl-belleza .ec-mmb__card:nth-child(n+4),
.ec-mm--tpl-hogar .ec-mmb__card:nth-child(n+4), .ec-mm--tpl-restaurante .ec-mmb__card:nth-child(n+4) { display: none; }

/* Tarjeta de producto (computadora y celular) */
.ec-mmb__card { display: flex; flex-direction: column; min-width: 0; color: var(--ecm-tinta); text-decoration: none; }
.ec-mmb__card:hover { color: var(--ecm-tinta); text-decoration: none; }
.ec-mmb__img { position: relative; display: block; aspect-ratio: var(--ecm-prod-ratio); background: var(--ecm-prod-bg); border-radius: var(--ecm-radio-img); overflow: hidden; }
.ec-mmb__img img { display: block; width: 100%; height: 100%; object-fit: var(--ecm-prod-fit); mix-blend-mode: multiply; transition: transform .3s; }
.ec-mm--tpl-moda .ec-mmb__img img, .ec-mm--tpl-belleza .ec-mmb__img img, .ec-mm--tpl-hogar .ec-mmb__img img, .ec-mm--tpl-restaurante .ec-mmb__img img, .ec-mmb__card--cat .ec-mmb__img img { mix-blend-mode: normal; object-fit: cover; }
.ec-mmb__card:hover .ec-mmb__img img { transform: scale(1.04); }
.ec-mmb__nombre {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.7em;
    margin-top: 10px;
    font: 500 13.5px/1.35 var(--ecm-f-cuerpo);
}
.ec-mmb__card:hover .ec-mmb__nombre { text-decoration: underline; text-underline-offset: 3px; }
.ec-mm-precio { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; margin-top: 6px; }
.ec-mm-precio b { font: 700 16px/1.1 var(--ecm-f-cuerpo); color: var(--ecm-precio); }
.ec-mm--tpl-moda .ec-mm-precio b, .ec-mm--tpl-belleza .ec-mm-precio b, .ec-mm--tpl-hogar .ec-mm-precio b { font-weight: 500; }
.ec-mm-precio s { font: 400 12.5px/1.1 var(--ecm-f-cuerpo); color: var(--ecm-gris-claro); }
.ec-mm-dcto {
    position: absolute;
    left: 8px;
    top: 8px;
    padding: 3px 7px;
    border-radius: var(--ecm-radio);
    background: var(--ecm-acento);
    color: var(--ecm-sobre-acento);
    font: 700 11.5px/1 var(--ecm-f-cuerpo);
}
.ec-mm--tpl-belleza .ec-mm-dcto { border-radius: 999px; }
.ec-mmb__vacio { grid-column: 1 / -1; padding: 24px; border: 1px dashed var(--ecm-linea); border-radius: var(--ecm-radio); color: var(--ecm-gris); font: 400 14px/1.45 var(--ecm-f-cuerpo); }
.ec-mmb .ec-mm-promo { margin: 12px 12px 12px 0; min-height: 0; }
.ec-mmb .ec-mm-promo__titulo { font-size: 24px; }
.ec-mm--tpl-moda .ec-mmb .ec-mm-promo__btn, .ec-mm--tpl-belleza .ec-mmb .ec-mm-promo__btn, .ec-mm--tpl-hogar .ec-mmb .ec-mm-promo__btn {
    min-height: 36px; padding: 0 14px; border: 0; border-radius: var(--ecm-radio); background: var(--ecm-papel); color: var(--ecm-tinta); font: 500 11px/1 var(--ecm-f-cuerpo); letter-spacing: .16em;
}
.ec-mm--tpl-moda .ec-mmb .ec-mm-promo__sello, .ec-mm--tpl-belleza .ec-mmb .ec-mm-promo__sello, .ec-mm--tpl-hogar .ec-mmb .ec-mm-promo__sello { color: rgba(255, 255, 255, .85); }
.ec-mm--tpl-moda .ec-mmb .ec-mm-promo__titulo, .ec-mm--tpl-belleza .ec-mmb .ec-mm-promo__titulo, .ec-mm--tpl-hogar .ec-mmb .ec-mm-promo__titulo { font-style: italic; font-weight: 500; font-size: 26px; text-transform: none; }
@media (min-width: 768px) and (max-width: 1199px) {
    .ec-mmb { grid-template-columns: 236px minmax(0, 1fr) 200px; }
    .ec-mmb--sin-promo { grid-template-columns: 236px minmax(0, 1fr); }
    .ec-mmb__cards { grid-template-columns: repeat(min(var(--ecm-b-cols), 3), minmax(0, 1fr)); }
    .ec-mmb__card:nth-child(n+4) { display: none; }
}
@media (min-width: 768px) and (max-width: 959px) {
    .ec-mmb, .ec-mmb--sin-promo { grid-template-columns: 220px minmax(0, 1fr); }
    .ec-mmb > .ec-mm-promo { display: none; }
}

/* ══ Celular: cajón del menú (.ec-mmenu) ═════════════════════════════════════ */
.ec-mmenu.ec-mm { background: var(--ecm-papel); color: var(--ecm-tinta); font-family: var(--ecm-f-cuerpo); position: relative; }
.ec-mmenu.ec-mm .ec-mmenu__link, .ec-mmenu.ec-mm .ec-mmenu__subaccordion-trigger, .ec-mmenu.ec-mm .ec-mmenu__sublink { color: var(--ecm-tinta); }
.ec-mmenu.ec-mm .ec-mmenu__header { border-bottom-color: var(--ecm-linea); }
.ec-mm-m__seccion { padding: 16px 16px 8px; color: var(--ecm-gris); font: 600 11.5px/1 var(--ecm-f-cuerpo); letter-spacing: .12em; text-transform: uppercase; }
/* Columnas con foto: acordeón con miniatura */
.ec-mma-m { border-bottom: 1px solid var(--ecm-linea); }
.ec-mma-m > .ec-mma-m__btn {
    display: flex; align-items: center; gap: 12px; width: 100%; min-height: 60px; padding: 8px 16px;
    border: 0; background: transparent; color: var(--ecm-tinta-titulo); text-align: left; cursor: pointer;
    font-family: var(--ecm-f-titulo); font-size: calc(var(--ecm-titulo-size) - 2px); font-weight: var(--ecm-titulo-peso);
    letter-spacing: var(--ecm-titulo-ls); text-transform: var(--ecm-titulo-tt); line-height: 1.1; text-decoration: none;
}
.ec-mm--neutro .ec-mma-m > .ec-mma-m__btn, .ec-mm--tpl-general .ec-mma-m > .ec-mma-m__btn { font-size: 15px; font-weight: 600; }
.ec-mma-m__mini { width: 44px; height: 44px; object-fit: cover; border-radius: var(--ecm-radio-img); flex: none; background: var(--ecm-suave); }
.ec-mma-m__txt { flex: 1; min-width: 0; }
.ec-mma-m__chev { width: 18px; height: 18px; flex: none; color: var(--ecm-gris); transition: transform .18s; }
.ec-mma-m.is-open .ec-mma-m__chev { transform: rotate(180deg); }
.ec-mma-m > .ec-mmenu__subaccordion-body { background: transparent; }
.ec-mma-m__panel { padding: 0 16px 14px 72px; }
.ec-mma-m__panel a { display: block; padding: 8px 0; color: var(--ecm-gris); font: 400 14.5px/1.35 var(--ecm-f-cuerpo); text-decoration: none; }
.ec-mma-m__panel a.ec-mma-m__todo { display: inline-flex; align-items: center; gap: 6px; color: var(--ecm-tinta); font-weight: 600; }
.ec-mm--tpl-moda .ec-mma-m__todo, .ec-mm--tpl-belleza .ec-mma-m__todo { font-size: 12px !important; letter-spacing: .14em; text-transform: uppercase; font-weight: 500 !important; }
.ec-mma-m__todo svg { width: 15px; height: 15px; }
/* Departamentos: lista con íconos → pantalla de la categoría con productos */
.ec-mmb-m__cat {
    display: flex; align-items: center; gap: 14px; width: 100%; min-height: 52px; padding: 0 16px;
    border: 0; border-bottom: 1px solid var(--ecm-linea); background: transparent; color: var(--ecm-tinta);
    font: 500 15px/1.25 var(--ecm-f-cuerpo); text-align: left; cursor: pointer;
}
.ec-mmb-m__cat .ec-mmb__cat-ic { color: var(--ecm-gris); }
.ec-mmb-m__cat .ec-mmb__cat-flecha { margin-left: auto; }
.ec-mmb-m__pantalla {
    position: absolute; inset: 0; z-index: 5; display: flex; flex-direction: column;
    background: var(--ecm-papel); color: var(--ecm-tinta); overflow-y: auto; overscroll-behavior: contain;
}
.ec-mmb-m__pantalla[hidden] { display: none; }
.ec-mmb-m__top { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--ecm-linea); position: sticky; top: 0; background: var(--ecm-papel); z-index: 1; }
.ec-mmb-m__volver { display: inline-flex; align-items: center; gap: 4px; height: 40px; padding: 0 8px 0 0; border: 0; background: transparent; color: var(--ecm-tinta); font: 600 14px/1 var(--ecm-f-cuerpo); cursor: pointer; }
.ec-mmb-m__volver svg { width: 18px; height: 18px; }
.ec-mmb-m__top .mobile-menu-close { margin-left: auto; color: var(--ecm-tinta); }
.ec-mmb-m__titulo { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 16px 16px 12px; }
.ec-mmb-m__titulo h2 {
    margin: 0; color: var(--ecm-tinta-titulo); font-family: var(--ecm-f-titulo); font-size: calc(var(--ecm-titulo-size) + 5px);
    font-weight: var(--ecm-titulo-peso); letter-spacing: var(--ecm-titulo-ls); text-transform: var(--ecm-titulo-tt); line-height: 1.05;
}
.ec-mmb-m__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 12px; padding: 0 16px 16px; }
.ec-mmb-m__cards .ec-mmb__card { display: flex !important; }
.ec-mmb-m__cards .ec-mmb__nombre { font-size: 13px; }
.ec-mmb-m__promo.ec-mm-promo { margin: 0 16px 16px; min-height: 140px; }
.ec-mmb-m__promo .ec-mm-promo__texto { display: none; }
.ec-mmb-m__promo .ec-mm-promo__titulo { font-size: 22px; }
.ec-mm--tpl-moda .ec-mmb-m__promo .ec-mm-promo__btn, .ec-mm--tpl-belleza .ec-mmb-m__promo .ec-mm-promo__btn, .ec-mm--tpl-hogar .ec-mmb-m__promo .ec-mm-promo__btn {
    min-height: 36px; padding: 0 14px; border: 0; border-radius: var(--ecm-radio); background: var(--ecm-papel); color: var(--ecm-tinta);
}
.ec-mmb-m__cat:focus-visible, .ec-mmb-m__volver:focus-visible, .ec-mma-m__btn:focus-visible { outline: 2px solid var(--ecm-tinta); outline-offset: -2px; }

@media (prefers-reduced-motion: reduce) {
    .ec-mm *, .ec-mm *::before, .ec-mm *::after { transition: none !important; animation: none !important; }
}
