/* Diseño de la tienda (réplica de las maquetas). Los colores llegan desde la configuración vía variables CSS. */
:root{
  --c-primario:#e80787;--c-secundario:#751083;--c-titulos:#fff;--c-oferta:#d32f2f;--c-pie:#2b1230;
  --c-primario-hover:color-mix(in srgb,var(--c-primario) 82%,#000);
  --c-suave:color-mix(in srgb,var(--c-primario) 8%,#fff);
  --c-borde:color-mix(in srgb,var(--c-secundario) 16%,#fff);
  --bg:#faf9fb;--card:#fff;--fg:#231a26;--fg-suave:#6b6272;--ok:#1b8a4c;
  --fuente-texto:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
  --fuente-titulo:'Bricolage Grotesque','Figtree',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--fuente-texto);font-size:15px;line-height:1.5}
img{max-width:100%;display:block}
a{color:inherit}
button{font-family:inherit;cursor:pointer}
.wrap{max-width:1192px;margin:0 auto;padding:0 16px}
.seccion{padding-top:24px;padding-bottom:24px}
.tit{font-family:var(--fuente-titulo);font-size:26px;letter-spacing:-.5px;margin:0 0 16px;color:var(--fg);font-weight:800}
.tit-fila,.cab-bloque{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.cab-bloque h2,.tit-fila .tit{margin:0;font-family:var(--fuente-titulo);font-size:26px;letter-spacing:-.5px}
.cab-bloque a,.tit-fila a{color:var(--c-secundario);font-weight:700;font-size:14px;text-decoration:none}
.cab-bloque a:hover,.tit-fila a:hover{text-decoration:underline;text-underline-offset:4px}
.sub{color:var(--fg-suave);margin:0 0 16px}
.vacio{color:var(--fg-suave);padding:24px 0}
.btn-tienda{background:var(--c-primario);color:var(--c-titulos);border:0;border-radius:10px;padding:10px 18px;font-weight:700;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}
.btn-tienda:hover{background:var(--c-primario-hover);color:var(--c-titulos)}
.btn-tienda:disabled{background:#ccc;cursor:not-allowed}
.btn-tienda.grande{padding:13px 26px;font-size:1.05rem}
.btn-block{width:100%}
.btn-link{margin-left:12px;font-weight:600;color:var(--c-secundario)}
.icon-btn{background:none;border:0;color:inherit;width:44px;height:44px;display:inline-grid;place-items:center;border-radius:10px;position:relative}

/* ===== encabezado ===== */
header.top{background:var(--c-secundario);color:var(--c-titulos);position:sticky;top:0;z-index:50;box-shadow:0 2px 10px rgba(0,0,0,.14)}
.top .fila{display:flex;align-items:center;gap:20px;padding:14px 16px;max-width:1192px;margin:0 auto;flex-wrap:wrap}
.logo{font-family:var(--fuente-titulo);font-weight:800;font-size:22px;letter-spacing:-.3px;display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.logo .marca{width:34px;height:34px;border-radius:9px;background:var(--c-primario);display:grid;place-items:center;font-size:16px}
.logo img{max-height:42px;width:auto}
.buscar{flex:1 1 280px;display:flex;min-width:0}
.buscar input{flex:1;min-width:0;border:0;padding:11px 14px;border-radius:8px 0 0 8px;font:inherit;color:var(--fg);background:#fff}
.buscar button{border:0;background:var(--c-primario);color:var(--c-titulos);width:48px;border-radius:0 8px 8px 0;display:grid;place-items:center}
.acciones{display:flex;gap:18px;align-items:center;font-size:13px;font-weight:600}
.acciones a,.acciones button{text-decoration:none;display:inline-flex;align-items:center;gap:6px;color:inherit;background:none;border:0;font:inherit;font-weight:600}
.carro{position:relative}
.carro b{position:absolute;top:-8px;right:-10px;background:var(--c-primario);color:var(--c-titulos);font-size:11px;min-width:18px;height:18px;border-radius:9px;display:grid;place-items:center;padding:0 4px}
.carro b[hidden]{display:none}
nav.cats{border-top:1px solid color-mix(in srgb,var(--c-titulos) 18%,transparent)}
nav.cats ul{list-style:none;margin:0 auto;padding:0 16px;max-width:1192px;display:flex;gap:6px 22px;overflow-x:auto}
nav.cats a{display:block;padding:11px 0;font-size:13.5px;font-weight:600;text-decoration:none;white-space:nowrap;opacity:.92;color:inherit}
nav.cats a:hover{opacity:1;text-decoration:underline;text-underline-offset:5px}
nav.cats a.of{color:#ffd9d9}

/* menú del celular */
.burger{display:none}
.fondo-menu{position:fixed;inset:0;background:rgba(20,10,24,.5);z-index:84;opacity:0;pointer-events:none;transition:opacity .25s}
.fondo-menu.visible{opacity:1;pointer-events:auto}
.menu-m{position:fixed;top:0;bottom:0;left:0;width:min(320px,88vw);background:var(--card);z-index:85;transform:translateX(-105%);transition:transform .28s cubic-bezier(.4,0,.2,1);overflow-y:auto;box-shadow:18px 0 40px rgba(0,0,0,.2)}
.menu-m.abierto{transform:none}
.menu-m .cab{background:var(--c-secundario);color:var(--c-titulos);padding:14px 16px;display:flex;justify-content:space-between;align-items:center;font-family:var(--fuente-titulo);font-weight:800;font-size:18px}
.menu-m .cab button{background:transparent;border:0;color:inherit;font-size:28px;line-height:1;width:44px;height:44px}
.menu-m a{display:flex;align-items:center;min-height:50px;padding:0 18px;border-bottom:1px solid var(--c-borde);text-decoration:none;font-weight:600}
.menu-m a:hover{background:var(--c-suave)}
.menu-m .sec{padding:14px 18px 6px;font-size:11.5px;text-transform:uppercase;letter-spacing:.8px;color:var(--fg-suave);font-weight:700}
@media(max-width:720px){
  .burger{display:inline-grid}
  .top .fila{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:8px;padding:10px 12px;align-items:center}
  .top .fila .logo{font-size:19px;min-width:0}
  .top .fila .buscar{grid-column:1/-1;order:3;flex:none}
  .top nav.cats{display:none}
  .acciones{gap:2px}
  .acciones a,.acciones button{min-width:44px;min-height:44px;justify-content:center}
  .acciones .txt{display:none}
}

/* ===== carrusel ===== */
.carrusel-wrap{padding-top:18px}
.carrusel{position:relative;overflow:hidden;background:var(--c-secundario);border-radius:16px}
.slides{display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1);touch-action:pan-y}
.slide{flex:0 0 100%;min-width:0;display:block}
.slide picture,.slide img{width:100%}
.slide img{height:auto;display:block}
.flecha{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:0;background:var(--c-primario);color:var(--c-titulos);display:grid;place-items:center;z-index:2}
.flecha:hover{background:var(--c-primario-hover)}
.flecha.izq{left:14px}.flecha.der{right:14px}
.puntos{position:absolute;bottom:12px;left:0;right:0;display:flex;justify-content:center;gap:8px;z-index:2}
.puntos button{width:10px;height:10px;border-radius:50%;border:0;background:rgba(255,255,255,.55);padding:0}
.puntos button[aria-current="true"]{background:#fff;width:26px;border-radius:6px}
@media(max-width:520px){.flecha{width:36px;height:36px}.carrusel-wrap{padding-top:12px}.carrusel{border-radius:12px}}

/* ===== franja y banda ===== */
.franja{background:var(--c-suave);border:1px solid var(--c-borde);border-radius:16px;margin-top:16px}
.franja .fila{padding:22px 24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}
.franja-item{display:flex;gap:14px;align-items:flex-start;text-decoration:none}
.franja-item i{flex:none;color:var(--c-primario);font-size:30px;width:36px;text-align:center}
.franja-item strong{display:block;font-size:13.5px;text-transform:uppercase;letter-spacing:.5px}
.franja-item span{color:var(--fg-suave);font-size:13.5px}
.banda{margin:34px 0 0;background:var(--c-secundario);color:var(--c-titulos);border-radius:18px;padding:28px 32px;display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.banda h3{margin:0 0 4px;font-family:var(--fuente-titulo);font-size:24px;letter-spacing:-.4px}
.banda p{margin:0;opacity:.92}
.btn-banda{background:var(--c-primario);color:var(--c-titulos);border:0;font:inherit;font-weight:700;padding:12px 24px;border-radius:10px;text-decoration:none}
.btn-banda:hover{background:var(--c-primario-hover)}
@media(max-width:520px){.banda{padding:22px 18px}.btn-banda{width:100%;text-align:center}}

/* ===== bloques de inicio ===== */
section.bloque{padding:38px 0 6px}
.cats-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.cat{background:var(--card);border:1px solid var(--c-borde);border-radius:16px;padding:18px 12px 16px;text-align:center;text-decoration:none;display:flex;flex-direction:column;align-items:center;gap:10px;transition:border-color .15s,transform .15s}
.cat:hover{border-color:var(--c-primario);transform:translateY(-3px)}
.cat .ic{width:66px;height:66px;border-radius:50%;background:var(--c-suave);display:grid;place-items:center;color:var(--c-secundario);font-size:26px}
.cat strong{font-size:14px;line-height:1.25}
.cat span.d{font-size:12px;color:var(--fg-suave)}
.marcas{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.marcas a{background:var(--card);border:1px solid var(--c-borde);border-radius:12px;min-height:70px;display:grid;place-items:center;font-family:var(--fuente-titulo);font-weight:800;font-size:18px;color:var(--fg-suave);text-decoration:none;letter-spacing:.3px;text-align:center;padding:4px 8px}
.marcas a:hover{color:var(--c-secundario);border-color:var(--c-primario)}
@media(max-width:860px){.cats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.marcas{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:520px){.cats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cats-grid .cat{padding:14px 8px}}

/* ===== tarjetas de producto ===== */
.grilla{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:8px}
@media(max-width:860px){.grilla{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:861px) and (max-width:1000px){.grilla{grid-template-columns:repeat(3,minmax(0,1fr))}}
.pcard{background:var(--card);border:1px solid var(--c-borde);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:8px;position:relative;transition:border-color .15s,transform .15s}
.pcard:hover{border-color:var(--c-primario);transform:translateY(-2px)}
.pcard-img{position:relative;display:block;aspect-ratio:1;background:var(--c-suave);border-radius:10px;overflow:hidden}
.pcard-img img{width:100%;height:100%;object-fit:contain;padding:6px}
.pill-oferta{position:absolute;top:8px;left:8px;background:var(--c-oferta);color:#fff;font-size:11.5px;font-weight:800;padding:3px 8px;border-radius:6px;z-index:1}
.pill-agotado{position:absolute;top:8px;right:8px;background:#555;color:#fff;font-size:11px;border-radius:6px;padding:3px 8px}
.pcard-body{display:flex;flex-direction:column;gap:8px;flex:1}
.pcard-marca{color:var(--fg-suave);font-size:11.5px;text-transform:uppercase;letter-spacing:.5px;font-weight:700}
.pcard-nombre{margin:0;font-size:14px;font-weight:600;line-height:1.3;flex:1;text-decoration:none;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pcard-precio{font-family:var(--fuente-titulo);font-weight:800;font-size:19px;font-variant-numeric:tabular-nums}
.pcard-precio s{font-family:var(--fuente-texto);font-weight:500;font-size:13px;color:var(--fg-suave);margin-left:6px}
.en-oferta{color:var(--c-oferta)}
.pcard .btn-tienda{background:transparent;border:1.5px solid var(--c-primario);color:var(--c-primario);border-radius:9px;padding:8px;font-size:13.5px;min-height:44px}
.pcard .btn-tienda:hover{background:var(--c-primario);color:var(--c-titulos)}
.pcard .btn-tienda:disabled{background:#f1f1f1;border-color:#ddd;color:#999}
.pcard.agotado .pcard-img img{opacity:.5}

/* ===== categoría y filtros ===== */
.migas{font-size:13px;color:var(--fg-suave);padding:18px 0 6px;display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center}
.migas a{text-decoration:none}.migas a:hover{color:var(--c-secundario);text-decoration:underline}
.cab-cat{padding:6px 0 16px}
.cab-cat h1{font-family:var(--fuente-titulo);font-size:clamp(28px,4vw,40px);letter-spacing:-.8px;margin:0;line-height:1.05}
.cab-cat p{margin:6px 0 0;color:var(--fg-suave);max-width:60ch}
.listado{display:grid;grid-template-columns:270px minmax(0,1fr);gap:28px;align-items:start;padding-bottom:40px}
.filtros{position:sticky;top:130px;background:var(--card);border:1px solid var(--c-borde);border-radius:16px;padding:6px 18px 18px}
.filtros .tit{display:flex;justify-content:space-between;align-items:center;padding:14px 0 6px}
.filtros .tit h2{margin:0;font-family:var(--fuente-titulo);font-size:18px}
.limpiar{color:var(--c-secundario);font-weight:700;font-size:13px;text-decoration:none;padding:4px}
.limpiar:hover{text-decoration:underline}
.grupo{border-top:1px solid var(--c-borde);padding:14px 0 4px}
.grupo h3{margin:0 0 10px;font-size:12.5px;text-transform:uppercase;letter-spacing:.8px;color:var(--fg-suave)}
.opcion{display:flex;align-items:center;gap:10px;padding:5px 0;cursor:pointer;font-size:14px}
.opcion input{width:17px;height:17px;accent-color:var(--c-primario);flex:none}
.opcion .n{margin-left:auto;color:var(--fg-suave);font-size:12.5px;font-variant-numeric:tabular-nums}
.opcion.cero{opacity:.45}
.buscar-marca{width:100%;border:1px solid var(--c-borde);border-radius:8px;padding:8px 10px;font:inherit;font-size:13.5px;margin-bottom:6px;background:var(--bg)}
.precios{display:flex;gap:8px;align-items:center}
.precios input{width:100%;min-width:0;border:1px solid var(--c-borde);border-radius:8px;padding:8px 10px;font:inherit;font-size:13.5px;background:var(--bg)}
.precios span{color:var(--fg-suave)}
.rango-hint{font-size:12px;color:var(--fg-suave);margin:6px 0 8px}
.interruptor{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;padding:4px 0 10px;position:relative}
.interruptor input{position:absolute;opacity:0}
.interruptor .pista{width:38px;height:22px;border-radius:11px;background:#cfc8d4;position:relative;transition:background .2s;flex:none}
.interruptor .pista::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .2s}
.interruptor input:checked+.pista{background:var(--c-primario)}
.interruptor input:checked+.pista::after{transform:translateX(16px)}
.barra-orden{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.barra-orden .cuenta{font-size:14px;color:var(--fg-suave)}.barra-orden .cuenta strong{color:var(--fg)}
.barra-orden .der{display:flex;gap:10px;align-items:center}
.barra-orden select{border:1px solid var(--c-borde);border-radius:10px;padding:9px 12px;font:inherit;font-size:14px;background:var(--card);color:var(--fg)}
.btn-filtros{display:none;border:1.5px solid var(--c-secundario);color:var(--c-secundario);background:transparent;font:inherit;font-weight:700;border-radius:10px;padding:9px 14px;align-items:center;gap:8px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--c-suave);border:1px solid var(--c-borde);color:var(--c-secundario);border-radius:20px;padding:5px 8px 5px 12px;font-size:13px;font-weight:600}
.chip a{color:inherit;text-decoration:none;font-size:17px;line-height:1;padding:0 4px}
.cierra-filtros{display:none;background:transparent;border:0;font-size:28px;line-height:1;color:var(--fg-suave)}
.fondo-filtros{display:none}
.paginas{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:24px 0}
.paginas a{min-width:42px;height:42px;display:flex;align-items:center;justify-content:center;border:1px solid var(--c-borde);border-radius:10px;text-decoration:none;background:#fff}
.paginas a.act{background:var(--c-primario);color:var(--c-titulos);border-color:var(--c-primario)}
@media(max-width:860px){
  .listado{grid-template-columns:minmax(0,1fr)}
  .btn-filtros{display:inline-flex}
  .filtros{position:fixed;left:0;top:0;bottom:0;width:min(340px,90vw);z-index:88;border-radius:0 16px 16px 0;overflow-y:auto;transform:translateX(-105%);transition:transform .25s;padding-top:10px}
  .filtros.abierto{transform:none}
  .cierra-filtros{display:block}
  .fondo-filtros.visible{display:block;position:fixed;inset:0;background:rgba(20,10,24,.5);z-index:86}
}

/* ===== ficha ===== */
.ficha{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:36px;padding:14px 0 34px;align-items:start}
.galeria{display:grid;grid-template-columns:78px minmax(0,1fr);gap:12px}
.galeria.sin-minis{grid-template-columns:minmax(0,1fr)}
.miniaturas{display:flex;flex-direction:column;gap:10px}
.mini{border:2px solid var(--c-borde);background:var(--card);border-radius:10px;padding:4px;aspect-ratio:1;display:grid;place-items:center}
.mini[aria-selected="true"]{border-color:var(--c-primario)}
.mini img{width:100%;height:100%;object-fit:contain}
.principal{position:relative;background:var(--card);border:1px solid var(--c-borde);border-radius:16px;aspect-ratio:1;display:grid;place-items:center;overflow:hidden}
.principal img{width:88%;height:88%;object-fit:contain}
.etiqueta-desc{position:absolute;top:14px;left:14px;background:var(--c-oferta);color:#fff;font-weight:800;font-size:14px;padding:6px 12px;border-radius:8px;z-index:1}
.info .marca-sku{display:flex;gap:14px;flex-wrap:wrap;align-items:center;font-size:13px;color:var(--fg-suave)}
.info .marca-sku a{color:var(--c-secundario);font-weight:700;text-decoration:none;text-transform:uppercase;letter-spacing:.6px;font-size:12.5px}
.info h1{font-family:var(--fuente-titulo);font-size:clamp(25px,3.2vw,34px);line-height:1.12;margin:8px 0 10px;letter-spacing:-.5px;font-weight:700}
.info .corta{margin:0 0 16px;color:var(--fg-suave)}
.precio-caja{background:var(--card);border:1px solid var(--c-borde);border-left:5px solid var(--c-primario);border-radius:12px;padding:16px 18px}
.precio-fila{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.precio{font-family:var(--fuente-titulo);font-weight:800;font-size:38px;letter-spacing:-1px;line-height:1;font-variant-numeric:tabular-nums}
.precio.of{color:var(--c-oferta)}
.precio-antes{color:var(--fg-suave);text-decoration:line-through;font-size:18px}
.ahorro{display:inline-block;background:color-mix(in srgb,var(--c-oferta) 10%,#fff);color:var(--c-oferta);font-weight:700;font-size:13px;padding:3px 10px;border-radius:20px}
.iva{font-size:12.5px;color:var(--fg-suave);margin:6px 0 0}.promo{font-size:12.5px;color:var(--fg-suave);margin:2px 0 0}
.stock{display:flex;align-items:center;gap:8px;margin:16px 0 14px;font-weight:600;font-size:14px;color:var(--ok)}
.stock i{width:9px;height:9px;border-radius:50%;background:var(--ok)}
.stock.poco{color:var(--c-oferta)}.stock.poco i{background:var(--c-oferta)}
.stock.agotado{color:var(--fg-suave)}.stock.agotado i{background:#aaa}
.comprar{display:flex;gap:12px;flex-wrap:wrap}
.cantidad{display:inline-flex;border:1.5px solid var(--c-borde);border-radius:10px;background:var(--card);overflow:hidden}
.cantidad button{width:42px;border:0;background:transparent;font-size:20px;color:var(--c-secundario)}
.cantidad button:hover{background:var(--c-suave)}
.cantidad input{width:52px;border:0;text-align:center;font:inherit;font-weight:700;background:transparent;-moz-appearance:textfield}
.cantidad input::-webkit-outer-spin-button,.cantidad input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.btn-comprar{flex:1 1 210px;min-height:48px;border:0;border-radius:10px;background:var(--c-primario);color:var(--c-titulos);font-weight:700;font-size:16px;display:inline-flex;align-items:center;justify-content:center;gap:10px;transition:background .15s}
.btn-comprar:hover{background:var(--c-primario-hover)}
.envio{margin-top:20px;display:grid;gap:10px}
.envio>div{display:flex;gap:12px;align-items:flex-start;font-size:13.5px}
.envio i{flex:none;color:var(--c-secundario);margin-top:3px;width:22px;text-align:center;font-size:18px}
.envio strong{display:block}.envio span{color:var(--fg-suave);display:block}
.pestanas{background:var(--card);border:1px solid var(--c-borde);border-radius:16px;margin-bottom:34px;overflow:hidden}
.tabs{display:flex;border-bottom:1px solid var(--c-borde);overflow-x:auto}
.tabs button{padding:15px 22px;border:0;background:transparent;font-weight:700;font-size:14.5px;color:var(--fg-suave);border-bottom:3px solid transparent;white-space:nowrap}
.tabs button[aria-selected="true"]{color:var(--c-secundario);border-bottom-color:var(--c-primario)}
.panel{padding:24px 26px 28px}.panel[hidden]{display:none}
.detalle p{margin:0 0 12px;max-width:70ch}.detalle ul{margin:0 0 6px;padding-left:20px}.detalle li{margin-bottom:5px}
.cond{border-top:1px solid var(--c-borde)}.cond:first-child{border-top:0}
.cond button{width:100%;text-align:left;background:transparent;border:0;padding:15px 0;font-weight:700;font-size:15px;display:flex;justify-content:space-between;align-items:center;color:var(--fg)}
.cond button i{transition:transform .2s;color:var(--c-secundario);font-size:13px}
.cond button[aria-expanded="true"] i{transform:rotate(180deg)}
.cond .cuerpo{padding:0 0 16px;color:var(--fg-suave);max-width:70ch}.cond .cuerpo[hidden]{display:none}
h2.sec{font-family:var(--fuente-titulo);font-size:24px;letter-spacing:-.4px;margin:0 0 16px}
.barra-compra{position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--card);border-top:1px solid var(--c-borde);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));display:none;gap:12px;align-items:center;box-shadow:0 -6px 20px rgba(0,0,0,.12)}
.barra-compra .bc-info{min-width:0;flex:1}
.barra-compra small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--fg-suave);font-size:12px}
.barra-compra strong{font-family:var(--fuente-titulo);font-size:21px;font-variant-numeric:tabular-nums}
.barra-compra .btn-comprar{flex:0 0 auto;min-width:150px}
@media(max-width:860px){
  .ficha{grid-template-columns:minmax(0,1fr);gap:22px}
  .galeria{grid-template-columns:minmax(0,1fr)}
  .miniaturas{flex-direction:row;order:2;overflow-x:auto}.mini{width:62px;flex:0 0 auto}
  .barra-compra.visible{display:flex}
  body.bc-on .wa-flotante{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .panel{padding:18px 16px 22px}
}
.contenido-rico img{height:auto;border-radius:8px}
.contenido-rico table{max-width:100%;border-collapse:collapse}.contenido-rico td,.contenido-rico th{border:1px solid #ddd;padding:6px}
.pagina-txt{max-width:860px}
.contacto-grid{display:grid;gap:24px}
@media(min-width:861px){.contacto-grid{grid-template-columns:2fr 1fr}}
.contacto-datos{background:var(--c-suave);border-radius:14px;padding:18px}.contacto-datos i{color:var(--c-primario);width:20px}

/* ===== pie ===== */
footer.pie{background:var(--c-pie);color:#e9e0ec;margin-top:40px}
.pie .susc{border-bottom:1px solid rgba(255,255,255,.14)}
.pie .susc .interior{max-width:1192px;margin:0 auto;padding:26px 16px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px 40px;align-items:center}
.pie .susc h4{font-family:var(--fuente-titulo);font-size:20px;margin:0 0 4px;color:#fff}
.pie .susc p{margin:0;color:#cdbfd2;font-size:13.5px}
.pie .susc form{display:grid;gap:8px}
.pie .susc .fila-form{display:flex;gap:8px}
.pie .susc input[type=email],.pie .susc input[type=text]{flex:1;min-width:0;border:0;border-radius:8px;padding:11px 14px;font:inherit}
.pie .susc button,.pie .susc input[type=submit]{border:0;border-radius:8px;background:var(--c-primario);color:var(--c-titulos);font:inherit;font-weight:700;padding:0 22px;min-height:44px}
.pie .susc label{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:#d9cbde}
@media(max-width:860px){.pie .susc .interior{grid-template-columns:minmax(0,1fr)}}
.pie .cuerpo{max-width:1192px;margin:0 auto;padding:38px 16px 26px;display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:32px}
.pie .marca-pie{font-family:var(--fuente-titulo);font-weight:800;font-size:24px;color:#fff;letter-spacing:-.4px;display:flex;align-items:center;gap:10px;margin-bottom:8px}
.pie .marca-pie .mk{width:34px;height:34px;border-radius:9px;background:var(--c-primario);color:var(--c-titulos);display:grid;place-items:center;font-size:16px}
.pie .marca-pie img{max-height:40px;width:auto}
.pie .tagline{color:#d9cbde;margin:0 0 16px;max-width:30ch}
.pie .dato{margin:0 0 4px;color:#cdbfd2;font-size:13.5px}
.pie .dato b{color:#fff;font-weight:600}
.pie .dato a{color:inherit;text-decoration:none}.pie .dato a:hover{color:#fff;text-decoration:underline}
.pie .horario{margin:10px 0 0;font-size:12.5px;color:#b9a9bf;max-width:34ch}
.pie .redes{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
.pie .redes a{width:36px;height:36px;border-radius:9px;background:rgba(255,255,255,.1);color:#fff;display:grid;place-items:center;transition:background .15s;text-decoration:none}
.pie .redes a:hover{background:var(--c-primario)}
.pie h4{margin:0 0 12px;font-family:var(--fuente-titulo);font-size:15px;color:#fff;letter-spacing:.2px}
.pie ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pie ul a{color:#cdbfd2;text-decoration:none;font-size:13.5px}
.pie ul a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.pie .barra{border-top:1px solid rgba(255,255,255,.14)}
.pie .barra .interior{max-width:1192px;margin:0 auto;padding:16px;display:flex;justify-content:space-between;gap:10px 24px;flex-wrap:wrap;align-items:center;font-size:12.5px;color:#b9a9bf}
.pie .barra .legal{display:flex;gap:8px 22px;flex-wrap:wrap}
.pie .barra .legal a{color:#cdbfd2;text-decoration:none}.pie .barra .legal a:hover{color:#fff;text-decoration:underline}
.pie .barra .razon{display:block;margin-top:2px;opacity:.85}
@media(max-width:860px){.pie .cuerpo{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.pie .col-marca{grid-column:1/-1}}
@media(max-width:520px){.pie .cuerpo{grid-template-columns:minmax(0,1fr)}}
@media(pointer:coarse),(max-width:720px){.pie ul a{display:inline-block;padding:4px 0}.pie .barra .legal a{padding:6px 0}input,select,textarea{font-size:16px}}
.wa-flotante{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));width:56px;height:56px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.28);z-index:40;text-decoration:none;font-size:30px}
.wa-flotante:hover{background:#1fb457;color:#fff}
@media(max-width:860px){}

/* ===== modal ===== */
.modal-fondo{position:fixed;inset:0;background:rgba(20,10,24,.55);display:grid;place-items:center;padding:16px;z-index:90}
.modal-fondo[hidden]{display:none}
.modal-caja{background:var(--card);border-radius:16px;width:min(560px,100%);max-height:86vh;overflow:auto;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.modal-cab{background:var(--c-secundario);color:var(--c-titulos);padding:16px 20px;display:flex;justify-content:space-between;align-items:center;gap:12px;border-radius:16px 16px 0 0}
.modal-cab h3{margin:0;font-family:var(--fuente-titulo);font-size:20px}
.modal-cab button{background:transparent;border:0;color:inherit;font-size:26px;line-height:1;padding:0 4px}
.modal-cuerpo{padding:20px 22px 24px}

/* ===== carro lateral ===== */
.drawer{position:fixed;top:0;right:0;bottom:0;width:100%;max-width:400px;background:#fff;z-index:95;transform:translateX(100%);transition:transform .25s;display:flex;flex-direction:column;box-shadow:-4px 0 20px rgba(0,0,0,.2)}
.drawer.on{transform:none}
.velo{display:none;position:fixed;inset:0;background:rgba(20,10,24,.5);z-index:92}
.velo.on{display:block}
.drawer-cab{display:flex;justify-content:space-between;align-items:center;padding:6px 12px 6px 16px;background:var(--c-secundario);color:var(--c-titulos);font-family:var(--fuente-titulo)}
.drawer-cuerpo{flex:1;overflow-y:auto;padding:12px 16px}
.drawer-pie{border-top:1px solid var(--c-borde);padding:12px 16px}
.linea{display:grid;grid-template-columns:64px 1fr auto;gap:10px;padding:10px 0;border-bottom:1px solid var(--c-borde);align-items:center}
.linea img{width:64px;height:64px;object-fit:contain;background:var(--c-suave);border-radius:10px}
.linea a{font-weight:600;font-size:14px;text-decoration:none}
.linea .qty{margin-top:6px;display:inline-flex}.linea .qty button{width:34px;height:34px}.linea .qty input{width:40px;height:34px}
.linea .sub-linea{font-weight:700;text-align:right}
.linea .quitar{background:none;border:0;color:#b00;font-size:12px;display:block;margin-top:6px;margin-left:auto}
.total{display:flex;justify-content:space-between;font-size:18px;font-weight:800;margin-bottom:8px;font-family:var(--fuente-titulo)}
.aviso-gratis{background:#eefaf1;color:#166534;border-radius:10px;padding:8px 10px;font-size:13px;margin-bottom:10px}
.aviso-fase{font-size:12px;color:var(--fg-suave);margin:8px 0 0;text-align:center}
.carro-pagina{max-width:none}
.carro-cols{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:28px;align-items:start}
.resumen{position:sticky;top:140px;background:var(--card);border:1px solid var(--c-borde);border-radius:16px;padding:18px 20px}
.resumen h2{margin:0 0 12px;font-family:var(--fuente-titulo);font-size:18px}
@media(max-width:860px){.carro-cols{grid-template-columns:minmax(0,1fr)}.resumen{position:static}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.qty{display:flex;border:1.5px solid var(--c-borde);border-radius:10px;overflow:hidden;background:var(--card)}
.qty button{width:42px;border:0;background:transparent;font-size:20px;color:var(--c-secundario)}
.qty input{width:48px;border:0;text-align:center;font:inherit;font-weight:700;background:transparent}

.btn-ver-carro{background:transparent;border:1.5px solid var(--c-secundario);color:var(--c-secundario)}
.btn-ver-carro:hover{background:var(--c-secundario);color:var(--c-titulos)}

/* ===== checkout: pasos, formularios, ingreso con código, resumen ===== */
.btn-p{border:0;border-radius:10px;background:var(--c-primario);color:var(--c-titulos);font-weight:700;font-size:16px;min-height:48px;padding:0 22px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;transition:background .15s}
.btn-p:hover{background:var(--c-primario-hover)}
.btn-p[disabled]{opacity:.5;cursor:not-allowed}
.btn-p.btn-block{width:100%}
.btn-s{border:1.5px solid var(--c-secundario);border-radius:10px;background:transparent;color:var(--c-secundario);font-weight:700;font-size:15px;min-height:46px;padding:0 20px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.btn-s:hover{background:var(--c-secundario);color:var(--c-titulos)}
.enlace{background:transparent;border:0;color:var(--c-secundario);font:inherit;font-weight:700;cursor:pointer;padding:4px 0;text-decoration:underline;text-underline-offset:3px}
.enlace[disabled]{opacity:.5;cursor:default;text-decoration:none}
.vacio-c{text-align:center;padding:46px 16px;color:var(--fg-suave)}
.vacio-c strong{display:block;color:var(--fg);font-size:18px;margin-bottom:6px;font-family:var(--fuente-titulo)}
.aviso-carro{background:#fff7e0;border:1px solid #f1d98a;color:#6b4e00;border-radius:10px;padding:10px 14px;font-size:14px;margin-bottom:10px}
.aviso-fase a{color:var(--c-secundario);font-weight:600}

.entrega{display:grid;gap:8px;margin-bottom:14px}
.op-entrega{display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:10px;align-items:center;border:1.5px solid var(--c-borde);border-radius:12px;padding:11px 12px;cursor:pointer;font-size:14px}
.op-entrega input{accent-color:var(--c-primario);width:18px;height:18px}
.op-entrega:has(input:checked){border-color:var(--c-primario);background:var(--c-suave)}
.op-entrega small{display:block;color:var(--fg-suave);font-size:12px}
.op-entrega b{font-variant-numeric:tabular-nums}
.sel{width:100%;border:1.5px solid var(--c-borde);border-radius:10px;padding:10px 12px;font:inherit;font-size:14px;background:var(--bg);color:var(--fg)}
.barra-gratis{background:var(--c-suave);border:1px solid var(--c-borde);border-radius:10px;padding:9px 12px;font-size:12.5px;margin-bottom:12px}
.barra-gratis .pista{height:6px;border-radius:3px;background:color-mix(in srgb,var(--c-secundario) 14%,#fff);margin-top:6px;overflow:hidden}
.barra-gratis .pista i{display:block;height:100%;background:var(--c-primario);border-radius:3px;transition:width .3s}
.lineas{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;font-size:14.5px;margin-bottom:14px}
.lineas>div{display:flex;justify-content:space-between;gap:10px;font-variant-numeric:tabular-nums}
.lineas .total{border-top:1px solid var(--c-borde);padding-top:12px;margin-top:4px;font-size:16px;font-weight:700;margin-bottom:0}
.lineas .total strong{font-family:var(--fuente-titulo);font-size:26px;letter-spacing:-.5px}
.lineas .desg{font-size:12.5px;color:var(--fg-suave);display:grid;grid-template-columns:minmax(0,1fr);gap:2px}
.lineas .desg>div{display:flex;justify-content:space-between}

.pasos{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:6px 0 18px;font-size:13.5px}
.pasos .sep{width:26px;height:2px;background:var(--c-borde)}
.paso{display:inline-flex;align-items:center;gap:8px;color:var(--fg-suave);font-weight:600}
.paso i{font-style:normal;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--c-secundario) 14%,#fff);font-size:12px;font-weight:800}
.paso.hecho i{background:var(--ok);color:#fff}
.paso.activo{color:var(--fg)}
.paso.activo i{background:var(--c-primario);color:var(--c-titulos)}
.bloque-f{background:var(--card);border:1px solid var(--c-borde);border-radius:16px;padding:20px 22px;margin-bottom:16px}
.bloque-f h2{margin:0 0 4px;font-family:var(--fuente-titulo);font-size:20px}
.bloque-f .ayuda{margin:0 0 14px;font-size:13.5px;color:var(--fg-suave)}
.tipos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tipo{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;border:2px solid var(--c-borde);border-radius:14px;padding:16px;cursor:pointer}
.tipo input{accent-color:var(--c-primario);width:20px;height:20px;margin-top:2px}
.tipo:has(input:checked){border-color:var(--c-primario);background:var(--c-suave)}
.tipo strong{display:block;font-size:16px;font-family:var(--fuente-titulo)}
.tipo span{font-size:13px;color:var(--fg-suave)}
.campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}
.campo{display:grid;gap:5px;min-width:0}
.campo.ancho{grid-column:1/-1}
.campo label{font-size:12.5px;font-weight:700;color:var(--fg-suave);text-transform:uppercase;letter-spacing:.5px}
.campo input,.campo select{border:1.5px solid var(--c-borde);border-radius:10px;padding:11px 12px;font:inherit;background:var(--bg);color:var(--fg);min-width:0;width:100%}
.campo input.malo,.campo select.malo{border-color:var(--c-oferta)}
.campo .err{font-size:12.5px;color:var(--c-oferta)}
.campo .err:empty{display:none}
.mini-resumen{margin-bottom:12px;max-height:240px;overflow:auto}
.mini-resumen .it{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;font-size:13px;padding:6px 0;border-bottom:1px solid var(--c-borde)}
.mini-resumen .it b{font-variant-numeric:tabular-nums}

.guardar{border:2px solid var(--c-primario);background:linear-gradient(135deg,var(--c-suave),#fff);border-radius:16px;padding:18px 20px;margin-bottom:16px}
.guardar .cab-g{display:flex;align-items:center;gap:14px;cursor:pointer;position:relative}
.guardar .cab-g input{position:absolute;opacity:0}
.guardar .pista{width:52px;height:30px;border-radius:15px;background:#cfc8d4;position:relative;transition:background .2s;flex:none}
.guardar .pista::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.guardar input:checked+.pista{background:var(--c-primario)}
.guardar input:checked+.pista::after{transform:translateX(22px)}
.guardar input:focus-visible+.pista{outline:3px solid color-mix(in srgb,var(--c-primario) 55%,#fff);outline-offset:2px}
.guardar .cab-g strong{display:block;font-family:var(--fuente-titulo);font-size:17px}
.guardar .cab-g small{display:block;color:var(--fg-suave);font-size:13.5px;margin-top:2px}
.guardar .det{margin-top:14px;padding-top:14px;border-top:1px dashed var(--c-borde);display:grid;gap:10px}
.guardar .det ul{margin:0;padding-left:20px;font-size:13.5px;color:var(--fg-suave);display:grid;gap:4px}
.guardar .det label{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;cursor:pointer}
.guardar .det input[type=checkbox]{width:18px;height:18px;accent-color:var(--c-primario);margin-top:1px;flex:none}
.guardar .err{font-size:12.5px;color:var(--c-oferta)}
.guardar .err:empty{display:none}
.banner-sesion{display:flex;justify-content:space-between;align-items:center;gap:10px 16px;flex-wrap:wrap;background:var(--card);border:1px solid var(--c-borde);border-radius:14px;padding:12px 16px;margin-bottom:16px;font-size:14px}
.banner-sesion.ok{background:#eefaf2;border-color:#bfe8cc}

.fondo-login{position:fixed;inset:0;background:rgba(20,10,24,.55);z-index:90;display:grid;place-items:center;padding:16px}
.fondo-login[hidden]{display:none}
.caja-login{background:var(--card);border-radius:16px;width:min(420px,100%);box-shadow:0 24px 60px rgba(0,0,0,.35);overflow:hidden;max-height:calc(100dvh - 32px);overflow-y:auto}
.caja-login .cab{background:var(--c-secundario);color:var(--c-titulos);padding:16px 20px;display:flex;justify-content:space-between;align-items:center}
.caja-login .cab h2{margin:0;font-family:var(--fuente-titulo);font-size:20px}
.caja-login .cab button{background:transparent;border:0;color:inherit;font-size:26px;line-height:1;cursor:pointer}
.caja-login form{padding:20px;display:grid;gap:14px}
.caja-login form>div{display:grid;gap:14px}
.caja-login form>div[hidden]{display:none}
.caja-login .msg{font-size:13px;color:var(--fg-suave);margin:0}
.caja-login .msg.mal{color:var(--c-oferta)}
.caja-login .msg.bien{color:var(--ok)}
.canales{border:0;padding:0;margin:0;display:grid;gap:8px}
.canales legend{font-size:12.5px;font-weight:700;color:var(--fg-suave);text-transform:uppercase;letter-spacing:.5px;padding:0;margin-bottom:6px}
.canal{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;align-items:center;border:1.5px solid var(--c-borde);border-radius:12px;padding:11px 12px;cursor:pointer}
.canal input{accent-color:var(--c-primario);width:18px;height:18px}
.canal:has(input:checked){border-color:var(--c-primario);background:var(--c-suave)}
.canal strong{display:block;font-size:14.5px}
.canal small{color:var(--fg-suave);font-size:12.5px}
.cod6{font-size:26px!important;letter-spacing:10px;text-align:center;font-variant-numeric:tabular-nums;font-weight:700}
.fila-enlaces{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}

.pago-fase{text-align:center;padding:40px 20px;border:2px dashed var(--c-borde);border-radius:16px;background:var(--card)}
.pago-fase h2{font-family:var(--fuente-titulo);margin:10px 0 6px}
.pago-fase p{color:var(--fg-suave);max-width:54ch;margin:0 auto 8px}
.acciones-pago{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:14px}
.pill-ok,.pill-aviso{display:inline-block;font-weight:700;font-size:12.5px;padding:4px 12px;border-radius:20px}
.pill-ok{background:#e6f6ec;color:var(--ok)}
.pill-aviso{background:#fff3d6;color:#8a5a00}

.barra-pagar{position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--card);border-top:1px solid var(--c-borde);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));display:none;gap:12px;align-items:center;box-shadow:0 -6px 20px rgba(0,0,0,.12)}
.barra-pagar .bp-tot{min-width:0;flex:1}
.barra-pagar .bp-tot small{display:block;color:var(--fg-suave);font-size:12px}
.barra-pagar .bp-tot strong{font-family:var(--fuente-titulo);font-size:22px;font-variant-numeric:tabular-nums}
.barra-pagar .btn-p{flex:0 0 auto;min-width:150px}
@media(max-width:860px){
  .barra-pagar{display:flex}
  body:has(.barra-pagar) main{padding-bottom:78px}
  body:has(.barra-pagar) .wa-flotante{bottom:92px}
  .campos,.tipos{grid-template-columns:minmax(0,1fr)}
  .resumen #btnContinuar{display:none}
}

.comp-lista{text-align:left;margin:18px auto 0;max-width:640px}
.comp-lista h3{font-size:15px;margin:0 0 8px}
.comp-tabla{width:100%;border-collapse:collapse;font-size:13px}
.comp-tabla th,.comp-tabla td{padding:7px 6px;border-bottom:1px solid var(--c-borde);text-align:right}
.comp-tabla th:first-child,.comp-tabla td:first-child{text-align:left}
.comp-tabla tfoot .tot td{font-weight:700;font-size:15px}
.comp-fecha{font-size:12px;margin-top:8px}
@media print{header,footer,nav,.pasos,.migas,.acciones-pago,.resumen,.top,.drawer,.menu-m,#drawerFondo,.fondo{display:none !important}.pago-fase{border:0}}

.rec-wrap{position:relative}
.rec-pista{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px}
.rec-pista::-webkit-scrollbar{display:none}
.rec-item{flex:0 0 calc((100% - 48px)/4);scroll-snap-align:start;min-width:0}
.rec-wrap .flecha{top:42%}
.cab-bloque a.btn-s{border:1px solid var(--c-secundario);border-radius:8px;padding:6px 12px}
@media(max-width:900px){.rec-item{flex-basis:calc((100% - 16px)/2)}}
.compra{background:var(--card);border:1px solid var(--c-borde);border-radius:14px;padding:16px;margin-bottom:16px}
.compra-cab{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.compra-cab small{color:var(--fg-suave)}
.compra-acc{display:flex;gap:8px;flex-wrap:wrap}