/* ══════════════════════════════════════════════════════════
   PORTADA V2 · vender primero
   Se carga después de polish.css: aquí solo van los cambios.
   ══════════════════════════════════════════════════════════ */
:root{
  --v2-rojo:#B4121F; --v2-rojo-dk:#7E0B15;
  --v2-petroleo:#074F60; --v2-marca:#0580A0;
  --v2-borde:rgba(5,128,160,.18);
  --v2-ease:cubic-bezier(.16,1,.3,1);
}

/* ── Cabecera: botón de menú a la derecha ─────────────── */
.cab-menu{width:46px;height:46px;border-radius:50%;border:1px solid var(--v2-borde);background:#fff;
  display:inline-grid;place-items:center;padding:0;cursor:pointer;
  box-shadow:0 6px 16px -10px rgba(5,68,83,.45);transition:border-color .2s,box-shadow .3s var(--v2-ease),transform .3s var(--v2-ease)}
/* Ícono vectorial: tres líneas iguales, nítidas en cualquier pantalla */
.cab-menu svg{width:22px;height:22px;fill:none;stroke:var(--v2-petroleo);stroke-width:1.8;stroke-linecap:round;overflow:visible}
.cab-menu path{transform-origin:12px 12px;transition:transform .35s var(--v2-ease),opacity .2s}
.cab-menu:hover{border-color:rgba(5,128,160,.45);transform:translateY(-1px)}
.cab-menu:focus-visible{outline:3px solid rgba(5,128,160,.35);outline-offset:2px}
.cab-menu[aria-expanded="true"] .l1{transform:translateY(5px) rotate(45deg)}
.cab-menu[aria-expanded="true"] .l2{opacity:0}
.cab-menu[aria-expanded="true"] .l3{transform:translateY(-5px) rotate(-45deg)}

/* ── Cajón del menú general ───────────────────────────── */
.der-velo{position:fixed;inset:0;z-index:9990;background:rgba(7,40,50,.32);backdrop-filter:blur(3px);opacity:0;transition:opacity .35s}
.der-velo.on{opacity:1}
.der-panel{position:fixed;top:0;right:0;bottom:0;z-index:9991;width:min(380px,90vw);overflow-y:auto;
  background:#fff;border-radius:24px 0 0 24px;box-shadow:-30px 0 60px -30px rgba(5,40,50,.45);
  padding:22px 22px 34px;transform:translateX(104%);transition:transform .5s var(--v2-ease);font-family:Manrope,system-ui,sans-serif}
.der-panel.on{transform:none}
.der-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.der-tit{font-family:'Cormorant Garamond',serif;font-size:1.7rem;color:#0E1519}
.der-x{width:40px;height:40px;border-radius:50%;border:1px solid var(--v2-borde);background:#fff;font-size:1.5rem;line-height:1;color:var(--v2-petroleo);cursor:pointer}
.der-cuenta{display:grid;gap:3px;padding:15px 16px;border-radius:16px;background:linear-gradient(135deg,#074F60,#0580A0);color:#fff;text-decoration:none;margin-bottom:8px}
.der-cuenta b{font-size:.95rem}
.der-cuenta span{font-size:.72rem;opacity:.85}
.der-grupo{display:grid;padding:14px 0 6px;border-top:1px solid #edf2f4;margin-top:10px}
.der-ojo{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:#6f858d;margin:0 0 6px 4px}
.der-link{display:block;text-align:left;padding:11px 10px;border-radius:12px;border:0;background:none;font:inherit;font-size:.92rem;color:#0E1519;text-decoration:none;cursor:pointer}
.der-link:hover,.der-link:focus-visible{background:#f1f7f9;outline:none}
.der-wa{color:#128C7E}
body.der-abierto{overflow:hidden}

/* ── Portada: 6 tarjetas, promociones en rojo, transición tipo Apple ── */
.portada .campaign-promo{background:linear-gradient(120deg,var(--v2-rojo) 0%,var(--v2-rojo-dk) 100%);color:#fff}
.portada .campaign-promo::after{background:linear-gradient(90deg,var(--v2-rojo) 0%,var(--v2-rojo) 36%,#b4121fc4 52%,transparent 74%)!important}
.portada .campaign-promo .pt-eyebrow{background:#fff!important;color:var(--v2-rojo)!important;font-weight:700}
.portada .campaign-promo .pt-cta{background:#fff!important;color:var(--v2-rojo)!important;border-color:#fff!important;font-weight:700}
.portada .campaign-promo h2,.portada .campaign-promo .pt-in>p,.portada .campaign-promo .campaign-detail{color:#fff}
.campaign-coleccion .pt-eyebrow{color:var(--v2-petroleo)}
.campaign .pt-foto img{transform:scale(1.09);transition:transform 2.6s var(--v2-ease)}
.campaign.on .pt-foto img{transform:scale(1)}
.campaign .pt-in>*{opacity:0;transform:translateY(18px);transition:opacity .9s var(--v2-ease),transform .9s var(--v2-ease)}
.campaign.on .pt-in>*{opacity:1;transform:none}
.campaign.on .pt-in>*:nth-child(2){transition-delay:.08s}
.campaign.on .pt-in>*:nth-child(3){transition-delay:.16s}
.campaign.on .pt-in>*:nth-child(4){transition-delay:.22s}
.campaign.on .pt-in>*:nth-child(5){transition-delay:.28s}
.pt-flecha{display:none!important}
.pt-dot{position:relative;overflow:hidden}
.pt-dot[aria-current="true"]{width:34px;background:rgba(255,255,255,.4)}
.pt-dot[aria-current="true"]::after{content:"";position:absolute;inset:0;border-radius:inherit;background:#fff;transform-origin:left;animation:v2-avance 4.2s linear both}
@keyframes v2-avance{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (max-width:600px){
  .portada .campaign-promo::after{background:linear-gradient(90deg,#b4121ff2,#b4121fc2 65%,#b4121f66)!important}
}
@media (prefers-reduced-motion:reduce){
  .campaign .pt-foto img,.campaign .pt-in>*{transition:none;transform:none;opacity:1}
  .pt-dot[aria-current="true"]::after{animation:none}
}

/* ── Filas de productos: juntas, sin flechas ni líneas ── */
.cat::before{display:none!important}
.cat{padding-top:clamp(14px,2vw,26px);padding-bottom:clamp(6px,1vw,12px)}
.cat + .cat{padding-top:clamp(6px,1.2vw,14px)}
.cat .car-btns{display:none!important}
.cat .car-foot{margin-top:8px;min-height:22px}
.cat .rl-card{background:linear-gradient(180deg,#fff 0%,#f2f8fa 100%);border:1px solid var(--v2-borde);
  box-shadow:0 1px 2px rgba(5,68,83,.06),0 12px 26px -18px rgba(5,68,83,.45);
  transition:border-color .25s,box-shadow .35s var(--v2-ease),transform .35s var(--v2-ease)}
.cat .rl-card:hover{border-color:rgba(5,128,160,.42)}
.cat .rl-card:active{transform:scale(.97);border-color:var(--v2-marca)}
.cat .rl-card:focus-visible{outline:none;border-color:var(--v2-marca);box-shadow:0 0 0 3px rgba(5,128,160,.22)}
.cat-fila .riel-kicker{color:var(--v2-marca);font-weight:600}
.cat-fila-promociones .riel-kicker{color:var(--v2-rojo)}
.cat-fila-promociones h2{color:var(--v2-rojo)}

/* ── Botón de tienda (el verde queda solo para WhatsApp) ── */
.btn-tienda{background:var(--v2-petroleo);color:#fff;border:1px solid var(--v2-petroleo);border-radius:999px}
.btn-tienda:hover{background:var(--v2-marca);border-color:var(--v2-marca)}

/* ── Pie: datos legales y Libro de Reclamaciones ──────── */
.foot-legal:not(:empty){display:block;margin-top:6px;font-size:.72rem;opacity:.8}
.foot-libro{font-weight:600}
/* Bolsa del carrito al costado del menú, con el mismo estilo del botón de menú. */
.cab-acts .cart-fab.en-barra{width:46px;height:46px;border-radius:50%;background:#fff;border:1px solid var(--v2-borde)}
@media (max-width:780px){.cab-acts .cart-fab.en-barra{width:42px;height:42px}}
/* Tarjetas de campaña: mismo tacto que "Destacados de la casa" (foto que se acerca al pasar, se hunde al tocar). */
.campaign{transition:transform .35s cubic-bezier(.16,1,.3,1)}
.campaign.on:hover .pt-foto img{transform:scale(1.05);transition:transform 1s cubic-bezier(.22,.68,.24,1)}
.campaign:active{transform:scale(.985)}
@media (hover:none),(pointer:coarse){.campaign.on:hover .pt-foto img{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.campaign,.campaign.on:hover .pt-foto img{transition:none}}
/* Sin flechas en ningún carrusel: se navega con los puntitos (estilo Apple) y deslizando */
.car-btns,.car-btn,.pt-flecha{display:none!important}
.der-pedido{position:relative;display:grid;gap:3px;width:100%;text-align:left;padding:14px 16px;border-radius:16px;border:1px solid var(--v2-borde);background:#fff;color:#0E1519;font:inherit;cursor:pointer;margin-bottom:8px}
.der-pedido b{font-size:.95rem}.der-pedido span{font-size:.72rem;color:#5d737b}
.der-pedido::after{content:attr(data-n);position:absolute;right:16px;top:50%;transform:translateY(-50%);min-width:24px;height:24px;padding:0 7px;border-radius:999px;background:#0580A0;color:#fff;font-size:.75rem;font-weight:700;display:grid;place-items:center}
.der-pedido[data-n="0"]::after{display:none}