/* Inicio estilo Mercado Libre (2026-10-12) — vista el_rey.inicio_ml · marca: amarillo #FFD426, morado #490AA0/#2E0668, blanco.
   Plano, sin degradados. Títulos Archivo Black en mayúsculas; texto Inter. */
#wrapwrap.er-ml-home{background:#EDEBF1;}
.er-ml{--am:#FFD426;--m:#490AA0;--mh:#2E0668;--tx:#141018;--gr:#6E667A;--ln:#E4E0EA;--fd:#EDEBF1;
  font-family:Inter,system-ui,sans-serif;color:var(--tx);background:var(--fd);padding-bottom:4px;}
.er-ml *{box-sizing:border-box;}
.er-ml a{text-decoration:none;}

/* cabecera amarilla solo en este inicio */
#wrapwrap.er-ml-home header#top nav.navbar,#wrapwrap.er-ml-home header#top .navbar{background:var(--am,#FFD426) !important;box-shadow:none !important;border:0 !important;}
#wrapwrap.er-ml-home header#top form.er_buscar input{background:#fff !important;box-shadow:0 1px 3px rgba(46,6,104,.12) !important;border-color:transparent !important;}
#wrapwrap.er-ml-home header#top .er_cab_acc a,#wrapwrap.er-ml-home header#top .o_wsale_my_cart>a,
#wrapwrap.er-ml-home header#top .o_wsale_my_wish>a{background:#fff !important;}

/* franja amarilla: departamentos como pestañas; debajo, cada vista empieza con su banner que «cae» sobre el gris */
.er-ml-amarillo{background:var(--am);padding:0;}
.er-ml-hero{background:linear-gradient(var(--am) 0,var(--am) 58%,var(--fd) 58%);padding:10px 0 4px;}
.er-ml-hero .er-ml-banner{margin-top:0;}
.er-ml-tabs{display:flex;gap:22px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px 16px 0;margin:0;}
.er-ml-tabs::-webkit-scrollbar{display:none;}
.er-ml-tabs a{flex:none;font:500 15px/1 Inter,system-ui,sans-serif;color:#2B2433 !important;padding:10px 0 11px;border-bottom:3px solid transparent;white-space:nowrap;}
.er-ml-tabs a.on{font-weight:700;color:var(--tx) !important;border-bottom-color:var(--tx);}
/* en computadora también (2026-10-13): mismas pestañas, centradas al ancho del banner */
@media (min-width:992px){.er-ml-tabs{max-width:1200px;margin:0 auto;padding:8px 14px 0;gap:28px;}.er-ml-tabs a{font-size:15.5px;}}

.er-ml-banner{position:relative;max-width:1200px;margin:10px auto 0;padding:0 12px;}
.er-ml-pista{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;border-radius:14px;clip-path:inset(0 1px 0 0 round 14px);}   /* con anchos de medio píxel asomaba la orilla de la siguiente */
.er-ml-pista::-webkit-scrollbar{display:none;}
.er-ml-dia{position:relative;flex:0 0 100%;scroll-snap-align:center;aspect-ratio:16/9;overflow:hidden;border-radius:14px;background:var(--mh);display:block;color:#fff !important;}
.er-ml-dia picture,.er-ml-dia img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.er-ml-dia::after{content:"";position:absolute;inset:0;background:rgba(20,8,40,.42);}
.er-ml-dia-txt{position:absolute;z-index:1;left:16px;right:16px;bottom:14px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;}
.er-ml-dia-txt small{font:800 11px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--am);}
.er-ml-dia-txt b{font:400 clamp(20px,6vw,40px)/1.02 'Archivo Black',Inter,sans-serif;text-transform:uppercase;color:#fff;max-width:92%;}
.er-ml-dia-txt b em{font-style:normal;color:var(--am);}
.er-ml-dia-txt span{display:inline-flex;align-items:center;height:32px;padding:0 14px;border-radius:999px;background:var(--am);color:var(--mh);font:800 13px/1 Inter,system-ui,sans-serif;}
.er-ml-puntos{display:flex;justify-content:center;gap:6px;margin-top:8px;}
.er-ml-puntos i{width:6px;height:6px;border-radius:99px;background:#C9C2D6;transition:width .2s;}
.er-ml-puntos i.on{width:18px;background:var(--m);}
@media (min-width:992px){
  .er-ml-hero{padding-top:14px;}
  .er-ml-dia{aspect-ratio:1200/360;}
  .er-ml-dia-txt{left:48px;bottom:auto;top:50%;transform:translateY(-50%);gap:10px;max-width:560px;}
  .er-ml-dia-txt b{font-size:44px;}
  .er-ml-dia-txt span{height:40px;padding:0 20px;font-size:15px;}
}

/* franja de Socio Mayoreo (2026-10-13, 2.ª versión — Miguel: «no me gustó, rediséñalo y agrégale algo como hazte socio
   mayoreo y empieza a ahorrar»): bloque MORADO plano (anuncio), titular Archivo Black con la promesa del programa, la
   escalera Bronce → Plata → Oro (subes de nivel solo) y el botón amarillo. Textos aprobados de /socio-mayoreo: sin «2%»
   del Oro ni nada que el programa no haga. */
.er-ml-socio{max-width:1200px;margin:12px auto 0;padding:0 12px;}
.er-ml-socio a{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:18px 32px;
  background:#490AA0;color:#fff !important;border-radius:16px;padding:20px 26px;text-decoration:none !important;
  font-family:Inter,system-ui,sans-serif;}
.er-ml-socio-tx{display:flex;flex-direction:column;gap:6px;min-width:0;}
.er-ml-socio-tx small{font:800 11.5px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#FFD426;}
.er-ml-socio-tx b{font:400 clamp(21px,2.3vw,29px)/1.06 'Archivo Black',Inter,sans-serif;text-transform:uppercase;color:#fff;}
.er-ml-socio-tx b em{font-style:normal;color:#FFD426;}
.er-ml-socio-tx i{font-style:normal;font-size:14px;font-weight:500;line-height:1.4;color:#E4DAF5;}
/* la escalera: cada nivel un escalón más alto, la condición abajo */
.er-ml-socio-esc{display:grid;grid-template-columns:repeat(3,96px);gap:8px;align-items:end;}
.er-ml-socio-esc > span{display:flex;flex-direction:column;gap:6px;min-width:0;}
.er-ml-socio-esc em{display:flex;align-items:flex-start;justify-content:center;padding-top:9px;border-radius:10px 10px 4px 4px;
  font:400 12px/1 'Archivo Black',Inter,sans-serif;font-style:normal;letter-spacing:.06em;text-transform:uppercase;}
.er-ml-socio-esc .bronce em{height:36px;background:#9C5B27;color:#fff;}
.er-ml-socio-esc .plata em{height:52px;background:#BFC5CC;color:#2E0668;}
.er-ml-socio-esc .oro em{height:68px;background:#FFD426;color:#490AA0;}
.er-ml-socio-esc small{font-size:12px;font-weight:600;line-height:1.2;color:#E4DAF5;text-align:center;white-space:nowrap;}
.er-ml-socio-cta{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:#FFD426;color:#490AA0;
  border-radius:10px;padding:14px 18px;font:800 15px/1.15 Inter,system-ui,sans-serif;white-space:nowrap;}
.er-ml-socio a:hover .er-ml-socio-cta{background:#FDB913;}
.er-ml-socio a:focus-visible{outline:3px solid #FFD426;outline-offset:3px;}
@media (max-width:980px){
  .er-ml-socio a{grid-template-columns:minmax(0,1fr) auto;}
  .er-ml-socio-cta{grid-column:1 / -1;}
}
@media (max-width:640px){
  .er-ml-socio a{grid-template-columns:minmax(0,1fr);gap:14px;padding:18px 16px;}
  .er-ml-socio-tx b{font-size:22px;}
  .er-ml-socio-tx i{font-size:13.5px;}
  .er-ml-socio-esc{grid-template-columns:repeat(3,minmax(0,1fr));}
  .er-ml-socio-esc .bronce em{height:30px;}
  .er-ml-socio-esc .plata em{height:42px;}
  .er-ml-socio-esc .oro em{height:54px;}
  .er-ml-socio-cta{width:100%;}
}

/* atajos: departamentos en círculo */
.er-ml-atajos{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;max-width:1200px;margin:14px auto 0;padding:4px 12px 6px;}
.er-ml-atajos::-webkit-scrollbar{display:none;}
.er-ml-atajo{flex:0 0 84px;display:flex;flex-direction:column;align-items:center;gap:7px;color:var(--tx) !important;text-align:center;}
.er-ml-atajo span{width:64px;height:64px;border-radius:50%;overflow:hidden;background:#fff;box-shadow:0 2px 6px rgba(46,6,104,.12);display:block;}
.er-ml-atajo img{width:100%;height:100%;object-fit:cover;display:block;}
.er-ml-atajo small{font:500 12px/1.2 Inter,system-ui,sans-serif;color:#2B2433;}
@media (min-width:992px){.er-ml-atajos{justify-content:center;gap:18px;}.er-ml-atajo{flex-basis:104px;}.er-ml-atajo span{width:80px;height:80px;}.er-ml-atajo small{font-size:13px;}}

/* el muro de productos: rejilla con filas parejas (antes columnas sueltas que dejaban las tarjetas en desnivel, 2026-10-16) */
.er-ml-muro{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense;gap:10px;max-width:1200px;margin:14px auto 0;padding:0 10px;}
.er-ml-muro > .er-ml-lista{grid-row:span 2;}
@media (min-width:620px){.er-ml-muro{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media (min-width:880px){.er-ml-muro{grid-template-columns:repeat(4,minmax(0,1fr));}}
@media (min-width:1120px){.er-ml-muro{grid-template-columns:repeat(5,minmax(0,1fr));}}
.er-ml-cargando{max-width:1200px;margin:20px auto;padding:0 16px;color:var(--gr);text-align:center;}

.er-ml-sello{position:absolute;left:8px;top:8px;z-index:1;background:var(--am);color:var(--mh);border-radius:6px;padding:4px 7px;font:800 11px/1 Inter,system-ui,sans-serif;}

/* tarjetas-lista: «Ahorra por volumen» y «Vuelve a pedir» (como «Ofertas relámpago») */
.er-ml-lista{background:var(--am);border-radius:12px;padding:12px 8px 8px;}
.er-ml-lista.morada{background:var(--m);}
.er-ml-lista h2{margin:0 6px 10px;font:400 clamp(18px,4.8vw,22px)/1.05 'Archivo Black',Inter,sans-serif;text-transform:uppercase;color:var(--mh);}
.er-ml-lista.morada h2{color:#fff;}
.er-ml-lista h2 small{display:block;margin-top:5px;font:600 12px/1.25 Inter,system-ui,sans-serif;text-transform:none;letter-spacing:0;color:#4A3C1A;}
.er-ml-lista.morada h2 small{color:#E4D9F7;}
.er-ml-filas{background:#fff;border-radius:10px;overflow:hidden;}
.er-ml-fila{display:flex;gap:10px;padding:10px;color:var(--tx) !important;border-top:1px solid #F1EEF5;align-items:center;}
.er-ml-fila:first-child{border-top:0;}
.er-ml-fila img{flex:none;width:76px;height:76px;object-fit:contain;border-radius:8px;background:#fff;}
.er-ml-fila div{min-width:0;display:flex;flex-direction:column;gap:3px;}
.er-ml-fila .er-ml-sello{position:static;align-self:flex-start;}
.er-ml-fila s{font:400 12.5px/1 Inter,system-ui,sans-serif;color:var(--gr);}
.er-ml-fila b{font:400 18px/1.1 Inter,system-ui,sans-serif;color:var(--tx);}
.er-ml-fila em{font:500 11.5px/1.25 Inter,system-ui,sans-serif;font-style:normal;color:var(--gr);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* recién llegados: la fila deslizable es .er-tj-fila (global.css), la misma del resto del sitio */
.er-ml-sec{max-width:1200px;margin:18px auto 0;padding:0 10px;}
.er-ml-sec-h{display:flex;align-items:baseline;justify-content:space-between;margin:0 4px 10px;}
.er-ml-sec-h h2{margin:0;font:400 clamp(18px,4.8vw,24px)/1.1 'Archivo Black',Inter,sans-serif;text-transform:uppercase;color:var(--tx);}
.er-ml-sec-h a{font:600 14px/1 Inter,system-ui,sans-serif;color:var(--m) !important;}

/* confianza */
.er-ml-confia{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:1200px;margin:18px auto 0;padding:0 10px;}
@media (min-width:992px){.er-ml-confia{grid-template-columns:repeat(4,minmax(0,1fr));}}
.er-ml-confia a,.er-ml-confia div{background:#fff;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:6px;color:var(--tx) !important;}
.er-ml-confia svg{color:var(--m);}
.er-ml-confia b{font:700 14px/1.25 Inter,system-ui,sans-serif;}
.er-ml-confia span{font:400 12.5px/1.35 Inter,system-ui,sans-serif;color:var(--gr);}

/* hoja de opciones (presentaciones) y de categorías */
.er-ml-velo{position:fixed;inset:0;background:rgba(20,8,40,.45);z-index:1090;opacity:0;transition:opacity .2s;}
.er-ml-velo.on{opacity:1;}
.er-ml-hoja{position:fixed;left:0;right:0;bottom:0;z-index:1091;background:#fff;border-radius:18px 18px 0 0;max-height:82vh;overflow:auto;
  padding:10px 16px calc(18px + env(safe-area-inset-bottom));transform:translateY(105%);transition:transform .25s ease;font-family:Inter,system-ui,sans-serif;color:#141018;}
.er-ml-hoja.on{transform:translateY(0);}
@media (min-width:768px){.er-ml-hoja{left:50%;right:auto;width:440px;margin-left:-220px;bottom:24px;border-radius:18px;}}
.er-ml-hoja-asa{width:40px;height:4px;border-radius:9px;background:#D8D2E2;margin:0 auto 12px;}
.er-ml-hoja h3{font:700 17px/1.25 Inter,system-ui,sans-serif;margin:0 0 4px;}
.er-ml-hoja p{margin:0 0 12px;color:#6E667A;font-size:13.5px;}
.er-ml-op{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:54px;border:1.5px solid #E4E0EA;border-radius:12px;
  background:#fff;padding:10px 14px;margin:0 0 8px;cursor:pointer;text-align:left;font:600 15px/1.2 Inter,system-ui,sans-serif;color:#2E0668;}
.er-ml-op b{font:400 17px/1 'Archivo Black',Inter,sans-serif;color:#141018;}
.er-ml-op small{display:block;font:500 12px/1.3 Inter,system-ui,sans-serif;color:#1F7A3A;margin-top:3px;}
.er-ml-op.cargando{opacity:.55;pointer-events:none;}
.er-ml-dep{border-top:1px solid #F1EEF5;}
.er-ml-dep:first-of-type{border-top:0;}
.er-ml-dep>button{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;padding:12px 2px;cursor:pointer;text-align:left;
  font:600 15.5px/1.2 Inter,system-ui,sans-serif;color:#141018;}
.er-ml-dep>button img{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none;}
.er-ml-dep>button span{flex:1;}
.er-ml-dep>button svg{flex:none;color:#6E667A;transition:transform .2s;}
.er-ml-dep.abierto>button svg{transform:rotate(90deg);}
.er-ml-subs{display:none;padding:0 0 10px 56px;}
.er-ml-dep.abierto .er-ml-subs{display:block;}
.er-ml-subs a{display:block;padding:9px 0;font:500 14.5px/1.2 Inter,system-ui,sans-serif;color:#2B2433 !important;}
.er-ml-subs a.todo{color:#490AA0 !important;font-weight:700;}

/* la barra de abajo del teléfono se quitó el 2026-10-12 (Miguel: «quita estos botones, no me gustan») */

/* ── movimiento (2026-10-12, Miguel: «me gusta algo ahí con movimiento para la cuadrícula de productos») ──
   todo con datos reales: el descuento del escalón late, la barra de vendidos se llena con un brillo que corre y las
   tarjetas entran al aparecer. Nada de contadores ni «últimas piezas». */
.er-ml-relampago{max-width:1200px;margin:16px auto 0;padding:0 10px;}
.er-ml-relampago-h{position:sticky;top:0;z-index:6;display:flex;align-items:center;gap:8px;background:var(--am);color:var(--mh);
  border-radius:12px 12px 0 0;padding:11px 14px;margin:0;}
.er-ml-relampago-h h2{margin:0;font:400 17px/1 'Archivo Black',Inter,sans-serif;text-transform:uppercase;color:var(--mh);}
.er-ml-relampago-h span{margin-left:auto;font:600 12.5px/1.2 Inter,system-ui,sans-serif;color:#4A3C1A;text-align:right;}
.er-ml-rayo{flex:none;animation:er-ml-rayo 1.6s ease-in-out infinite;transform-origin:50% 60%;}
@keyframes er-ml-rayo{0%,100%{transform:scale(1) rotate(0)}40%{transform:scale(1.18) rotate(-8deg)}55%{transform:scale(.95) rotate(4deg)}}
.er-ml-relampago-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;background:var(--am);padding:0 8px 8px;border-radius:0 0 12px 12px;}
@media (min-width:768px){.er-ml-relampago-g{grid-template-columns:repeat(4,minmax(0,1fr));}}
.er-ml-relampago-g .er-tj{height:100%;}
.er-ml-muro-h{margin-top:20px;}

@media (prefers-reduced-motion: reduce){.er-ml-rayo{animation:none !important;}}

/* ── pestañas como Mercado Libre (2026-10-12): cada departamento cambia el contenido ahí mismo ── */
.er-ml-vistas{overflow-x:clip;}
.er-ml-desliza{animation:er-ml-desliza .26s cubic-bezier(.2,.8,.2,1);}
@keyframes er-ml-desliza{from{opacity:0;transform:translateX(calc(var(--d,1) * 34px))}to{opacity:1;transform:none}}
.er-ml-tabs a{position:relative;}
.er-ml-atajos-dep{justify-content:flex-start;}
.er-ml-atajos-dep .er-ml-atajo small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.er-ml-vertodo{display:flex;align-items:center;justify-content:center;height:46px;margin:16px 0 4px;border-radius:10px;border:1.5px solid var(--m);
  background:#fff;color:var(--m) !important;font:700 14.5px/1.2 Inter,system-ui,sans-serif;text-align:center;padding:0 12px;}
.er-ml-vdep .er-ml-sec .er-tj-grid{margin-top:0;}
/* esqueleto mientras llega el índice (solo la primera vez) */
.er-ml-esq{max-width:1200px;margin:10px auto 0;padding:0 12px;}
.er-ml-esq i{display:block;background:linear-gradient(90deg,#E6E2EC 0,#F1EEF5 50%,#E6E2EC 100%);background-size:200% 100%;animation:er-ml-brillo-esq 1.2s linear infinite;border-radius:12px;}
.er-ml-esq .b{aspect-ratio:16/9;}
.er-ml-esq .c{display:flex;gap:14px;margin:14px 0;}
.er-ml-esq .c i{width:64px;height:64px;border-radius:50%;flex:none;}
.er-ml-esq .g{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.er-ml-esq .g i{height:260px;}
@keyframes er-ml-brillo-esq{from{background-position:100% 0}to{background-position:-100% 0}}
@media (prefers-reduced-motion: reduce){.er-ml-desliza,.er-ml-esq i{animation:none !important;}}

/* a su medida: «Porque buscaste…», «Visto recientemente», «Más de…» (solo con lo que guarda SU navegador) */
.er-ml-sec-pt{margin-top:16px;}
.er-ml-sec-pt .er-ml-sec-h{align-items:flex-end;gap:10px;}
.er-ml-sec-pt .er-ml-sec-h h2{min-width:0;overflow:hidden;text-overflow:ellipsis;}
.er-ml-sec-pt .er-ml-sec-h h2 small{display:block;margin-top:3px;font:600 12px/1.25 Inter,system-ui,sans-serif;text-transform:none;color:var(--gr);}
.er-ml-borrar{flex:none;border:0;background:none;padding:2px 0;font:600 12.5px/1 Inter,system-ui,sans-serif;color:var(--gr);text-decoration:underline;cursor:pointer;}

/* ══ ESCRITORIO (2026-10-13) ══ */
.er-ml-sec-h.er-ml-muro-h{max-width:1200px;margin:22px auto 10px;padding:0 14px;}   /* «Lo más pedido» se salía a la orilla */
@media (min-width:992px){
  .er-ml-hero{padding-top:12px;}
  .er-ml-atajos-dep{flex-wrap:wrap;justify-content:center;overflow:visible;row-gap:14px;}   /* todas las subcategorías a la vista */
  .er-ml-vertodo{max-width:420px;margin:20px auto 4px;}
  .er-ml-sec-pt{margin-top:22px;}
}

/* «Hazte Socio Mayoreo» (fuera de #wrap) sobre el mismo lila que el resto de la portada, no sobre blanco */
#wrapwrap.er-ml-home main{background:#EDEBF1;}

/* ── Academia El Rey en la portada (2026-10-13): recetas, «tu negocio» y guías del blog, al día desde Odoo ── */
.er-ml-academia{margin-top:22px;}
.er-ml-academia .er-ml-sec-h h2 small{display:block;margin-top:3px;font:600 12.5px/1.3 Inter,system-ui,sans-serif;text-transform:none;color:var(--gr);}
.er-ml-aca-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 4px 10px;}
.er-ml-aca-chips::-webkit-scrollbar{display:none;}
.er-ml-aca-chips a{flex:none;border:1px solid #E4E0EA;background:#fff;color:#2B2433 !important;border-radius:999px;padding:7px 12px;font:600 13px/1 Inter,system-ui,sans-serif;}
.er-ml-aca-chips a:hover{border-color:var(--m);color:var(--m) !important;}
.er-ml-aca{display:flex;flex-direction:column;background:#fff;border-radius:12px;overflow:hidden;color:var(--tx) !important;box-shadow:0 1px 2px rgba(46,6,104,.06);scroll-snap-align:start;}
.er-ml-aca-img{display:block;aspect-ratio:4/5;background:#2E0668 center/cover no-repeat;}
.er-ml-aca-txt{display:flex;flex-direction:column;gap:4px;padding:9px 11px 12px;}
.er-ml-aca-txt small{font:800 10.5px/1 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--m);}
.er-ml-aca-txt b{font:600 14px/1.3 Inter,system-ui,sans-serif;color:#2B2433;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.er-ml-tabs a.er-ml-tab-aca{color:#490AA0 !important;font-weight:700;}

/* ── estilo KEX (2026-10-19): títulos con etiqueta y palabra resaltada · tarjetas de servicio ── */
.er-tit{color:#490AA0 !important;}
.er-tit-ceja{display:block;margin:0 0 7px;font:700 11px/1.2 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#6E667A;}
.er-tit-resalta{display:inline-block;padding:3px .28em 1px;margin:0 .03em;border-radius:8px;background:#FFD426;color:#490AA0;line-height:1.05;
  font-family:'Archivo Black',Inter,sans-serif !important;font-weight:400 !important;font-size:inherit !important;text-transform:uppercase;}   /* otra regla le ponía Inter */
/* SERV-BLANCO-20261102: tarjetas blancas como las demás del sitio (icono morado sobre lila, título Inter, texto gris); antes eran
   moradas estilo KEX con el círculo amarillo sobresaliendo. Fuente: herramientas/sitio/inicio_ml/serv_blanco_20261102.py */
.er-serv{margin-top:26px;}
.er-serv-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-top:2px;}
@media (min-width:880px){.er-serv-g{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}}
.er-serv-c{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:18px 16px 18px;border-radius:16px;background:#FFFFFF;
  color:#141018 !important;text-align:left;text-decoration:none !important;box-shadow:0 1px 2px rgba(46,6,104,.06);
  transition:transform .22s cubic-bezier(.22,.61,.36,1),box-shadow .22s ease;}
.er-serv-c:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(46,6,104,.12);}
.er-serv-c:focus-visible{outline:3px solid #490AA0;outline-offset:2px;}
.er-serv-i{display:flex;align-items:center;justify-content:center;width:48px;height:48px;margin-bottom:4px;border-radius:14px;background:#F5F2FA;color:#490AA0;}
.er-serv-c b{font:700 15px/1.25 Inter,system-ui,sans-serif;color:#141018;}
.er-serv-c span:not(.er-serv-i){font:400 13.5px/1.45 Inter,system-ui,sans-serif;color:#6E667A;}
@media (max-width:479.98px){.er-serv-c{padding:14px 12px 14px;}.er-serv-i{width:42px;height:42px;}.er-serv-c b{font-size:14px;}.er-serv-c span:not(.er-serv-i){font-size:13px;}}

/* ── videos verticales estilo KEX (2026-10-19): tarjeta morada plana, video 9:16 redondeado, botones blancos encima y el
   texto DEBAJO del video (la marca no lleva degradados ni velos sobre la imagen) ── */
.er-vid-sec{position:relative;margin-top:26px;}
.er-vid-fila{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 4px 12px;scrollbar-width:none;}
.er-vid-fila::-webkit-scrollbar{display:none;}
.er-vid{flex:0 0 min(72vw,250px);scroll-snap-align:start;display:flex;flex-direction:column;border-radius:20px;background:#490AA0;overflow:hidden;}
.er-vid-m{position:relative;aspect-ratio:9/16;margin:8px 8px 0;border-radius:14px;overflow:hidden;background:#2E0668;}
.er-vid-m video{display:block;width:100%;height:100%;object-fit:cover;}
.er-vid-play{position:absolute;top:10px;left:10px;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:0;
  border-radius:50%;background:#fff;color:#490AA0;cursor:pointer;box-shadow:0 2px 8px rgba(20,16,24,.18);}
.er-vid-audio{position:absolute;top:12px;right:10px;height:30px;padding:0 12px;border:0;border-radius:999px;background:#fff;color:#490AA0;
  font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;box-shadow:0 2px 8px rgba(20,16,24,.18);}
.er-vid-audio.on{background:#FFD426;}
.er-vid-t{display:flex;flex-direction:column;gap:6px;padding:12px 14px 14px;flex:1;}
.er-vid-t b{font:400 15px/1.15 'Archivo Black',Inter,sans-serif;text-transform:uppercase;color:#fff;}
.er-vid-t span{font:500 13px/1.4 Inter,system-ui,sans-serif;color:rgba(255,255,255,.86);flex:1;}
.er-vid-cta{display:flex;align-items:center;justify-content:center;min-height:42px;margin-top:6px;border-radius:10px;background:#FFD426;
  color:#490AA0 !important;font:700 14px/1 Inter,system-ui,sans-serif;text-decoration:none !important;}
.er-vid-cta:hover{background:#FDB913;}
.er-vid-flecha{display:none;}
@media (min-width:880px){
  .er-vid-flecha{display:flex;align-items:center;justify-content:center;position:absolute;top:50%;width:44px;height:44px;border:0;border-radius:50%;
    background:#fff;color:#490AA0;font-size:20px;cursor:pointer;box-shadow:0 4px 16px rgba(46,6,104,.18);z-index:2;}
  .er-vid-prev{left:-14px;}.er-vid-next{right:-14px;}
}
/* ── SOCIO-PLACAS-20261031: las placas oficiales sin marco en lugar de la escalera de colores ── */
.er-ml-socio-esc{grid-template-columns:repeat(3,100px);gap:10px;align-items:start;}
.er-ml-socio-esc > span{align-items:center;gap:4px;}
.er-ml-socio-esc img{display:block;width:100%;height:auto;aspect-ratio:1;border-radius:12px;transition:transform .35s cubic-bezier(.2,.8,.2,1);}
.er-ml-socio-esc .plata img{transition-delay:.04s;}
.er-ml-socio-esc .oro img{transition-delay:.08s;}
.er-ml-socio a:hover .er-ml-socio-esc img{transform:translateY(-4px);}
@media (max-width:767px){
  .er-ml-socio-esc{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
  .er-ml-socio-esc img{max-width:104px;margin:0 auto;}
}
@media (prefers-reduced-motion: reduce){.er-ml-socio-esc img{transition:none;}}
/* ── fin SOCIO-PLACAS-20261031 ── */
/* ── HERO-CLARO-20261031: el carrusel con la identidad nueva (estudio claro, titular morado y Rey Miguelito) ── */
.er-ml-dia--clara{background:#F3EFE8;color:#490AA0 !important;}
.er-ml-dia--clara::after{display:none;}
.er-ml-dia--clara .er-ml-dia-txt{left:14px;right:auto;top:12px;bottom:auto;max-width:58%;gap:5px;}
.er-ml-dia--clara .er-ml-dia-txt small{color:#490AA0;font-size:10px;}
.er-ml-dia--clara .er-ml-dia-txt b{color:#490AA0;font-size:clamp(17px,5.4vw,30px);line-height:1.06;max-width:100%;}
.er-ml-dia--clara .er-ml-dia-txt b em{color:#490AA0;background:#FFD426;padding:0 .14em;border-radius:4px;-webkit-box-decoration-break:clone;box-decoration-break:clone;}
.er-ml-dia--clara .er-ml-dia-txt span{background:#490AA0;color:#FFFFFF;height:28px;padding:0 12px;font-size:12px;}
.er-ml-dia img.er-ml-dia-rey{display:none;}
@media (min-width:992px){
  .er-ml-dia--clara .er-ml-dia-txt{left:48px;top:50%;transform:translateY(-50%);max-width:430px;gap:12px;}
  .er-ml-dia--clara .er-ml-dia-txt small{font-size:12px;}
  .er-ml-dia--clara .er-ml-dia-txt b{font-size:40px;}
  .er-ml-dia--clara .er-ml-dia-txt span{height:42px;padding:0 20px;font-size:15px;}
  .er-ml-dia img.er-ml-dia-rey{display:block;position:absolute;z-index:1;inset:auto;width:auto;height:50%;object-fit:contain;
    transform-origin:50% 100%;animation:er-ml-rey 4s ease-in-out infinite;}
  .er-ml-dia--clara:hover img.er-ml-dia-rey{animation-duration:1.6s;}
}
@keyframes er-ml-rey{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(-1.5deg)}}
@media (prefers-reduced-motion:reduce){.er-ml-dia img.er-ml-dia-rey{animation:none;}}
/* ── fin HERO-CLARO-20261031 ── */
/* ── HERO-ANCHO-20261101: en computadora el carrusel va a todo lo ancho (Miguel: «que abarque todo el ancho») ── */
@media (min-width:992px){
  .er-ml-hero{padding:10px 0 4px;}
  .er-ml-hero .er-ml-banner{max-width:none;padding:0;}
  .er-ml-hero .er-ml-pista{border-radius:0;clip-path:none;}
  .er-ml-hero .er-ml-dia{border-radius:0;aspect-ratio:auto;height:min(30vw,560px);}
  .er-ml-hero .er-ml-dia-txt{left:max(48px,calc((100vw - 1200px) / 2 + 36px));}
}
/* ── fin HERO-ANCHO-20261101 ── */
/* ── HERO-SUAVE-20261101: el carrusel con movimiento suave y su marco amarillo ── */
.er-ml-puntos i{cursor:pointer;}
.er-ml-pista.er-suave{transition:opacity .3s ease;}
.er-ml-pista.er-suave.er-funde{opacity:0;}
@media (prefers-reduced-motion: no-preference){
  .er-suave .er-ml-dia img{transform:scale(1.05);transition:transform 6.5s ease-out;}
  .er-suave .er-ml-dia.er-dia-on img{transform:scale(1);}
  .er-suave .er-ml-dia-txt > *{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .7s cubic-bezier(.2,.8,.2,1);}
  .er-suave .er-ml-dia.er-dia-on .er-ml-dia-txt > *{opacity:1;transform:none;transition-delay:.25s;}
  .er-suave .er-ml-dia.er-dia-on .er-ml-dia-txt > *:nth-child(2){transition-delay:.38s;}
  .er-suave .er-ml-dia.er-dia-on .er-ml-dia-txt > *:nth-child(3){transition-delay:.52s;}
}
@media (min-width:992px){
  .er-ml-hero{background:var(--am);padding:10px 12px 12px;}
  .er-ml-hero .er-ml-pista{border-radius:16px;clip-path:inset(0 1px 0 0 round 16px);}
  .er-ml-hero .er-ml-dia{border-radius:16px;height:min(29vw,540px);}
}
/* ── fin HERO-SUAVE-20261101 ── */
/* ── INICIO-V3-20261101: la portada «estilo marketplace» (Socio y kits después de los productos, WhatsApp al final) y todo a lo
   ancho en computadora. Fuente: herramientas/sitio/inicio_ml/inicio_v3_20261101.py ── */
.er-ml-vista > .er-ml-socio{margin-top:24px;}
/* Kits para emprender: amarillo plano, texto morado, Rey Miguelito presentando parado en la orilla de abajo */
.er-ml-kits{max-width:1200px;margin:12px auto 0;padding:0 12px;}
.er-ml-kits-c{display:grid;grid-template-columns:minmax(0,1fr) 92px;grid-template-areas:"tx rey" "chips chips" "cta cta";align-items:end;gap:12px 10px;
  background:#FFD426;border-radius:16px;padding:18px 16px 16px;color:#490AA0;font-family:Inter,system-ui,sans-serif;overflow:hidden;}
.er-ml-kits-tx{grid-area:tx;display:flex;flex-direction:column;gap:6px;min-width:0;align-self:center;color:#490AA0 !important;text-decoration:none !important;}
.er-ml-kits-tx small{font:800 11.5px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#490AA0;}
.er-ml-kits-tx b{font:400 clamp(21px,2.3vw,29px)/1.06 'Archivo Black',Inter,sans-serif;text-transform:uppercase;color:#490AA0;}
.er-ml-kits-tx b em{font-style:normal;background:#490AA0;color:#FFD426;padding:0 .14em;border-radius:4px;-webkit-box-decoration-break:clone;box-decoration-break:clone;}
.er-ml-kits-tx i{font-style:normal;font-size:14px;font-weight:500;line-height:1.4;color:#2E0668;}
.er-ml-kits-rey{grid-area:rey;display:block;width:92px;height:auto;margin-bottom:-16px;transform-origin:50% 100%;}
.er-ml-kits-chips{grid-area:chips;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px 2px;}
.er-ml-kits-chips:empty{display:none;}
.er-ml-kits-chips::-webkit-scrollbar{display:none;}
.er-ml-kits-chips a{flex:none;background:#fff;color:#490AA0 !important;border-radius:999px;padding:8px 13px;font:700 13px/1 Inter,system-ui,sans-serif;text-decoration:none !important;}
.er-ml-kits-chips a:hover{background:#490AA0;color:#fff !important;}
.er-ml-kits-cta{grid-area:cta;display:flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:0 18px;border-radius:10px;
  background:#490AA0;color:#fff !important;font:800 15px/1.15 Inter,system-ui,sans-serif;text-decoration:none !important;white-space:nowrap;}
.er-ml-kits-cta:hover{background:#2E0668;}
.er-ml-kits-cta:focus-visible,.er-ml-kits-tx:focus-visible,.er-ml-kits-chips a:focus-visible{outline:3px solid #490AA0;outline-offset:2px;}
@media (min-width:768px){
  .er-ml-kits-c{grid-template-columns:130px minmax(0,1fr) auto;grid-template-areas:"rey tx cta" "rey chips cta";align-items:center;gap:12px 26px;padding:20px 26px 20px 16px;}
  .er-ml-kits-rey{width:130px;align-self:end;margin-bottom:-20px;}
  .er-ml-kits-chips{flex-wrap:wrap;overflow:visible;margin:0;padding:0;}
}
@media (prefers-reduced-motion: no-preference){
  .er-ml-kits-rey{animation:er-ml-rey 4s ease-in-out infinite;}
  .er-ml-kits-c:hover .er-ml-kits-rey{animation-duration:1.6s;}
}
/* ¿Prefieres pedir por WhatsApp? */
.er-ml-wa{max-width:1200px;margin:22px auto 6px;padding:0 12px;}
.er-ml-wa a{display:flex;align-items:center;gap:14px;background:#fff;border-radius:16px;padding:14px 16px;color:#141018 !important;text-decoration:none !important;
  box-shadow:0 1px 2px rgba(46,6,104,.06);font-family:Inter,system-ui,sans-serif;}
.er-ml-wa-i{flex:none;display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:#E8F8EE;}
.er-ml-wa-i svg{width:24px;height:24px;fill:#1FA855;}
.er-ml-wa-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;}
.er-ml-wa-t b{font:700 16px/1.25 Inter,system-ui,sans-serif;color:#141018;}
.er-ml-wa-t span{font:500 13.5px/1.35 Inter,system-ui,sans-serif;color:#6E667A;}
.er-ml-wa-b{flex:none;display:flex;align-items:center;height:42px;padding:0 18px;border-radius:10px;background:#1B8A4B;color:#fff;font:700 14.5px/1 Inter,system-ui,sans-serif;}
.er-ml-wa a:hover .er-ml-wa-b{background:#157A40;}
/* «Ver más productos» bajo el muro (solo teléfono) */
.er-ml-muro-mas{width:calc(100% - 20px);margin:14px 10px 0 !important;cursor:pointer;}
/* todo a lo ancho en computadora, alineado con el marco amarillo del carrusel (12 px) */
@media (min-width:992px){
  .er-ml-vistas .er-ml-socio,.er-ml-vistas .er-ml-atajos,.er-ml-vistas .er-ml-muro,.er-ml-vistas .er-ml-cargando,.er-ml-vistas .er-ml-sec,
  .er-ml-vistas .er-ml-relampago,.er-ml-vistas .er-ml-esq,.er-ml-vistas .er-ml-kits,.er-ml-vistas .er-ml-wa{max-width:none;padding-left:12px;padding-right:12px;}
  .er-ml-vistas .er-ml-sec-h.er-ml-muro-h{max-width:none;padding-left:16px;padding-right:16px;}
  .er-ml-vistas .er-ml-muro{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;}
  .er-ml-vistas .er-ml-vdep .er-tj-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));}
  .er-ml-wa a{padding:16px 22px;}
}
@media (min-width:1500px){.er-ml-vistas .er-tj-fila{grid-auto-columns:calc((100% - 60px) / 7);}}
@media (min-width:1760px){.er-ml-vistas .er-tj-fila{grid-auto-columns:calc((100% - 70px) / 8);}}
/* ── fin INICIO-V3-20261101 ── */
/* ── INICIO-V3B-20261101: los videos con la piel nueva del sitio y la cuadrícula más angosta.
   Fuente: herramientas/sitio/inicio_ml/inicio_v3b_20261101.py ── */
.er-vid-sec .er-vid-fila{gap:12px;padding:2px 2px 12px;}
/* er_todo.css trae otra .er-vid de septiembre (sección de videos vieja: padding 26px 24px, margin auto, max-width 1288px):
   se anula aquí o la tarjeta queda con relleno y el botón angosto */
.er-vid-sec .er-vid{flex:0 0 min(62vw,232px);padding:0;margin:0;max-width:none;border-radius:12px;background:#fff;box-shadow:0 1px 2px rgba(46,6,104,.06);
  transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease;}
.er-vid-m{margin:8px 8px 0;border-radius:12px;background:#F4F1F8;}
.er-vid-play{background:#490AA0;color:#fff;box-shadow:0 2px 8px rgba(46,6,104,.25);}
.er-vid-audio{color:#490AA0;font:650 11.5px/1 Inter,system-ui,sans-serif;letter-spacing:0;text-transform:none;}
.er-vid-audio.on{background:#FFD426;color:#490AA0;}
.er-vid-t{gap:4px;padding:10px 11px 4px;}
.er-vid-ceja{font:800 10.5px/1.2 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#490AA0;}
.er-vid-t b{font:600 15px/1.27 Inter,system-ui,sans-serif;text-transform:none;color:#141018;}
.er-vid-t span{font:400 13px/1.38 Inter,system-ui,sans-serif;color:#6E667A;}
.er-vid-cta{gap:6px;min-height:42px;margin:8px 0 6px;border-radius:10px;background:#490AA0;color:#fff !important;font:650 14px/1.15 Inter,system-ui,sans-serif;
  transition:transform .14s ease,background-color .25s ease;}
.er-vid-cta svg{flex:none;width:16px;height:16px;}
.er-vid-cta:hover{background:#2E0668;}
.er-vid-cta:active{transform:scale(.97);}
.er-vid-cta:focus-visible,.er-vid-play:focus-visible,.er-vid-audio:focus-visible{outline:3px solid #FFD426;outline-offset:2px;}
@media (hover:hover) and (prefers-reduced-motion: no-preference){.er-vid-sec .er-vid:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(46,6,104,.13);}}
@media (min-width:880px){.er-vid-flecha{color:#490AA0;}.er-vid-prev{left:2px;}.er-vid-next{right:2px;}}
@media (min-width:992px){
  .er-vid-sec .er-vid{flex-basis:212px;}
  .er-ml-vistas .er-ml-muro,.er-ml-vistas .er-ml-vdep .er-tj-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));}
}
/* las filas que se deslizan acompañan a la cuadrícula: 7, 8 y 9 tarjetas a la vista */
@media (min-width:1426px){.er-ml-vistas .er-tj-fila{grid-auto-columns:calc((100% - 60px) / 7);}}
@media (min-width:1628px){.er-ml-vistas .er-tj-fila{grid-auto-columns:calc((100% - 70px) / 8);}}
@media (min-width:1830px){.er-ml-vistas .er-tj-fila{grid-auto-columns:calc((100% - 80px) / 9);}}
@media (prefers-reduced-motion: reduce){.er-vid,.er-vid-cta{transition:none;}}
/* ── fin INICIO-V3B-20261101 ── */
/* ── ORILLAS-20261101: más margen a los lados en computadora; el marco amarillo del carrusel sigue la misma orilla
   (--er-orilla de global.css) ── */
@media (min-width:992px){
  .er-ml-hero{padding-left:var(--er-orilla,12px);padding-right:var(--er-orilla,12px);}
  .er-ml-vistas .er-ml-socio,.er-ml-vistas .er-ml-atajos,.er-ml-vistas .er-ml-muro,.er-ml-vistas .er-ml-cargando,.er-ml-vistas .er-ml-sec,
  .er-ml-vistas .er-ml-relampago,.er-ml-vistas .er-ml-esq,.er-ml-vistas .er-ml-kits,.er-ml-vistas .er-ml-wa{padding-left:var(--er-orilla,12px);padding-right:var(--er-orilla,12px);}
  .er-ml-vistas .er-ml-sec-h.er-ml-muro-h{padding-left:calc(var(--er-orilla,12px) + 4px);padding-right:calc(var(--er-orilla,12px) + 4px);}
}
/* ── fin ORILLAS-20261101 ── */
/* ── HERO-TEXTO-20261101: los textos del carrusel escalan con la pantalla (Miguel: «más grandes y mejor adaptados a las
   proporciones»). Fuente: herramientas/sitio/inicio_ml/hero_texto_20261101.py ── */
.er-ml-dia--clara .er-ml-dia-txt{left:4.5%;max-width:62%;top:50%;bottom:auto;transform:translateY(-50%);gap:clamp(5px,1.4vw,10px);}
.er-ml-dia--clara .er-ml-dia-txt small{font-size:clamp(10px,2.6vw,13px);}
.er-ml-dia--clara .er-ml-dia-txt b{font-size:clamp(18px,6vw,30px);line-height:1.05;}
.er-ml-dia--clara .er-ml-dia-txt span{height:clamp(28px,7.5vw,36px);padding:0 clamp(12px,3vw,16px);font-size:clamp(12px,3.2vw,14px);}
@media (min-width:768px){
  .er-ml-dia--clara .er-ml-dia-txt{max-width:56%;gap:clamp(8px,1.2vw,14px);}
  .er-ml-dia--clara .er-ml-dia-txt small{font-size:clamp(11px,1.3vw,14px);}
  .er-ml-dia--clara .er-ml-dia-txt b{font-size:clamp(26px,4.6vw,44px);}
  .er-ml-dia--clara .er-ml-dia-txt span{height:clamp(36px,4.6vw,44px);padding:0 clamp(16px,2vw,22px);font-size:clamp(13px,1.6vw,15px);}
}
@media (min-width:992px){
  .er-ml-hero .er-ml-dia--clara .er-ml-dia-txt{left:4.5%;max-width:46%;gap:clamp(10px,1vw,18px);}
  .er-ml-dia--clara .er-ml-dia-txt small{font-size:clamp(12px,1vw,17px);letter-spacing:.14em;}
  .er-ml-dia--clara .er-ml-dia-txt b{font-size:clamp(36px,3.6vw,72px);line-height:1.04;}
  .er-ml-dia--clara .er-ml-dia-txt span{height:clamp(42px,3.2vw,58px);padding:0 clamp(20px,1.6vw,30px);font-size:clamp(15px,1.15vw,20px);border-radius:999px;}
}
/* ── fin HERO-TEXTO-20261101 ── */
