/* RC27.0 — Experiencia móvil tipo app. Capa visual reversible. */
:root{--pc-red:#e80d16;--pc-red-dark:#c90912;--pc-yellow:#ffc43d;--pc-bg:#f3f4f6;--pc-card:#fff;--pc-text:#17191c;--pc-muted:#68707b;--pc-line:#e3e6eb}
.mobileWelcome,.mobileAppTopbar,.mobileBottomNav{display:none}
@media (max-width:768px){
 html{scroll-behavior:smooth;background:var(--pc-bg)}
 body{background:var(--pc-bg)!important;color:var(--pc-text)!important;padding-bottom:86px;font-family:Arial,Helvetica,sans-serif}
 body.mobileWelcomeOpen{overflow:hidden}
 .mobileWelcome{position:fixed;inset:0;z-index:10050;display:flex;flex-direction:column;background:linear-gradient(180deg,#fafafa 0%,#f1f3f6 100%);overflow:auto}
 .mobileWelcome[hidden]{display:none!important}
 .mobileWelcomeHeader,.mobileAppTopbar{height:78px;display:flex;align-items:center;justify-content:space-between;padding:12px 18px;background:rgba(255,255,255,.95);border-bottom:1px solid var(--pc-line)}
 .mobileWelcomeLogo{width:102px;max-height:54px;object-fit:contain}.mobileTopbarLogo{width:86px;max-height:46px;object-fit:contain}
 .mobileMenuButton,.mobileCartButton{width:46px;height:46px;border:1px solid #d9dde3;border-radius:14px;background:#fff;color:#1f2933;font-size:21px;box-shadow:0 4px 14px rgba(17,24,39,.06);position:relative}
 .mobileCartButton span{position:absolute;right:-4px;top:-5px;background:var(--pc-red);color:#fff;min-width:20px;height:20px;border-radius:999px;font-size:11px;display:grid;place-items:center;font-weight:800}
 .mobileWelcomeContent{padding:38px 22px 120px;max-width:520px;width:100%;margin:auto}
 .mobileWelcomeContent h1{font-size:31px;line-height:1.08;margin:0 0 8px;color:#111;font-weight:900}.mobileWelcomeContent>p{color:var(--pc-muted);font-size:15px;margin-bottom:26px}
 .deliveryChoice{width:100%;min-height:118px;border:0;border-radius:19px;margin-bottom:14px;padding:20px;display:flex;align-items:center;justify-content:space-between;text-align:left;box-shadow:0 12px 28px rgba(30,35,45,.10)}
 .deliveryChoice span:first-child{display:flex;flex-direction:column;gap:7px}.deliveryChoice strong{font-size:23px}.deliveryChoice small{font-size:15px;line-height:1.3}.deliveryChoiceIcon{font-size:48px}
 .deliveryChoicePrimary{background:linear-gradient(135deg,#ed141c,#cf0810);color:#fff}.deliveryChoiceSecondary{background:linear-gradient(135deg,#ffd45d,#ffba25);color:#271900}
 .mobileFeaturedPromo{margin-top:20px;background:#fff;border:1px solid #ffd5d7;border-radius:16px;padding:15px;display:flex;gap:12px;align-items:center;justify-content:space-between;box-shadow:0 8px 22px rgba(17,24,39,.06)}
 .mobileFeaturedPromo div{display:flex;flex-direction:column;gap:5px}.mobileFeaturedPromo small{color:var(--pc-red);font-weight:900}.mobileFeaturedPromo strong{font-size:14px}.mobileFeaturedPromo a{color:var(--pc-red);font-weight:800;text-decoration:none;white-space:nowrap}
 .mobileAppTopbar{position:sticky;top:0;z-index:900;display:flex;height:68px}
 .cabeceraSitio,.barraConfianza,.portadaVersionDos,.beneficiosVersionDos{display:none!important}
 .tituloSeccionDestacada{margin:20px 16px 8px}.tituloSeccionDestacada h2{font-size:18px!important;color:#16181c!important;text-align:left!important}
 #promociones,.seccionPromocionesPrincipal,#catalogo{padding-left:10px!important;padding-right:10px!important}
 .categoriaProductos{margin:14px 0 24px!important;padding:0!important}.cabeceraCategoria{padding:0 8px!important;margin-bottom:10px!important}.tituloCategoria{font-size:21px!important;color:#141619!important}
 .grillaProductos,.carruselProductos,.carruselMovilUniversal{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;overflow:visible!important;padding:0 4px 6px!important;scroll-snap-type:none!important}
 .promo{width:auto!important;min-width:0!important;margin:0!important;border-radius:17px!important;background:#fff!important;color:#15171a!important;border:1px solid #e2e6eb!important;box-shadow:0 7px 22px rgba(25,34,45,.08)!important;overflow:hidden!important;transform:none!important}
 .promo:hover{transform:none!important}.promo img,.promoImg{height:142px!important;object-fit:cover!important}.promoInfo{padding:11px!important;text-align:left!important}.codigoPromo{font-size:10px!important;color:#8a929d!important}.promo h3{font-size:15px!important;line-height:1.18!important;color:#141619!important;margin:5px 0!important;min-height:36px}.descripcionPromo,.estadoPromo{display:none!important}
 .precioPromo,.promo h2{font-size:18px!important;color:#111!important;margin:7px 0!important}.botonCarrito{width:100%!important;margin:5px 0 0!important;padding:11px 8px!important;border-radius:11px!important;background:var(--pc-red)!important;font-size:13px!important}
 .controlesCarrusel{display:none!important}.seccionUbicacion,.footerPrincipal{display:none!important}
 .mobileBottomNav{position:fixed;left:0;right:0;bottom:0;z-index:950;display:grid;grid-template-columns:repeat(4,1fr);height:68px;background:#fff;border-top:1px solid var(--pc-line);box-shadow:0 -7px 22px rgba(17,24,39,.08);padding-bottom:env(safe-area-inset-bottom)}
 .mobileBottomNav button{border:0;background:transparent;color:#404650;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:20px}.mobileBottomNav small{font-size:10px}.mobileBottomNav button.active{color:var(--pc-red);font-weight:800}
 #carrito{display:none!important}
 #panelDatos,#panelCarrito{z-index:1100!important}.modalConfigurador{z-index:1200!important}.ventanaConfigurador{border-radius:22px 22px 0 0!important}
}
@media (min-width:769px) and (max-width:1100px){body{background:#f2f3f5!important}.grillaProductos{grid-template-columns:repeat(3,minmax(0,1fr))!important}.promo{background:#fff!important;color:#17191c!important}}

/* RC27.1 — Inicio de catálogo, búsqueda y categorías. Solo usa fotos y logo existentes. */
.mobileCatalogHome{display:none}
@media (max-width:768px){
  .mobileCatalogHome{display:block;padding:14px 14px 2px;background:var(--pc-bg)}
  .mobileSearchBox{height:48px;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e3e6eb;border-radius:15px;padding:0 13px;box-shadow:0 5px 18px rgba(20,28,40,.055)}
  .mobileSearchBox>span{font-size:22px;color:#59616d;transform:rotate(-15deg)}
  .mobileSearchBox input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#181a1e;font-size:15px;font-weight:600}
  .mobileSearchBox input::placeholder{color:#8d949e;font-weight:500}
  .mobileSearchBox button{width:31px;height:31px;border:0;border-radius:50%;background:#eef0f3;color:#4e5560;font-size:19px}
  .mobileCategoryRail{display:flex;gap:10px;overflow-x:auto;padding:14px 1px 12px;scrollbar-width:none;overscroll-behavior-inline:contain;scroll-snap-type:x proximity}
  .mobileCategoryRail::-webkit-scrollbar{display:none}
  .mobileCategoryChip{flex:0 0 auto;min-width:71px;height:67px;border:1px solid #e2e5ea;border-radius:17px;background:#fff;color:#24272c;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:11px;font-weight:750;box-shadow:0 5px 15px rgba(23,31,42,.055);scroll-snap-align:start}
  .mobileCategoryChip span{font-size:23px;line-height:1}
  .mobileCategoryChip.active{border-color:#f3a6aa;background:#fff2f2;color:var(--pc-red);box-shadow:0 6px 18px rgba(232,13,22,.10)}
  .mobileFeaturedSection{margin:2px 0 14px}
  .mobileSectionHeading{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:6px 2px 10px}
  .mobileSectionHeading small{display:block;color:var(--pc-red);font-size:9px;font-weight:900;letter-spacing:.055em;margin-bottom:2px}
  .mobileSectionHeading h2{margin:0;font-size:19px;line-height:1.1;color:#16181c}
  .mobileSectionHeading button{border:0;background:transparent;color:var(--pc-red);font-weight:800;font-size:12px;padding:7px 0}
  .mobileFeaturedProducts{display:flex;gap:11px;overflow-x:auto;padding:1px 1px 12px;scrollbar-width:none;scroll-snap-type:x mandatory}
  .mobileFeaturedProducts::-webkit-scrollbar{display:none}
  .mobileFeatureCard{flex:0 0 78%;max-width:315px;min-height:178px;position:relative;border-radius:19px;overflow:hidden;background:#2a1210;scroll-snap-align:start;box-shadow:0 10px 25px rgba(23,28,38,.14);isolation:isolate}
  .mobileFeatureCard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
  .mobileFeatureCard::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,5,4,.90) 0%,rgba(30,8,6,.62) 48%,rgba(20,5,4,.08) 100%);z-index:-1}
  .mobileFeatureCardContent{height:100%;min-height:178px;padding:18px 16px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;color:#fff}
  .mobileFeatureCard small{font-size:10px;font-weight:900;color:#ffd05a;margin-bottom:5px}.mobileFeatureCard h3{font-size:19px;line-height:1.08;margin:0 0 6px;max-width:72%;text-shadow:0 2px 8px rgba(0,0,0,.25)}
  .mobileFeatureCard strong{font-size:20px;margin-bottom:9px}
  .mobileFeatureCard button{border:0;border-radius:10px;background:var(--pc-red);color:#fff;padding:9px 13px;font-size:12px;font-weight:900}
  .mobileFeatureEmpty{width:100%;padding:18px;border-radius:16px;background:#fff;border:1px dashed #d7dce2;color:#69717c;text-align:center;font-size:13px}
  body:not(.mobileWelcomeOpen) .seccionPromocionesPrincipal{padding-top:3px!important}
  body:not(.mobileWelcomeOpen) .seccionPromocionesPrincipal>.tituloSeccionDestacada{display:none!important}
  .promo .contenedorImagenProducto{background:#fff}
  .promo img,.promoImg{object-position:center!important}
}
@media (min-width:769px) and (max-width:1100px){
  .mobileCatalogHome{display:block;max-width:1100px;margin:0 auto;padding:18px 22px 6px}
  .mobileSearchBox{display:none}
  .mobileCategoryRail{display:flex;gap:10px;overflow-x:auto;padding:4px 0 16px;scrollbar-width:none}
  .mobileCategoryChip{flex:0 0 auto;border:1px solid #dde2e8;border-radius:14px;background:#fff;padding:11px 16px;font-weight:800}.mobileCategoryChip span{margin-right:6px}
  .mobileCategoryChip.active{color:var(--pc-red);border-color:#f2a5a8;background:#fff4f4}
  .mobileFeaturedSection{display:none}
}

/* =====================================================
   RC27.2 — TARJETAS Y DETALLE DE PRODUCTO MÓVIL
   Referencia visual aprobada: estilo premium, fondo gris claro.
   No modifica fotos, logo, catálogo ni lógica comercial.
===================================================== */
@media (max-width:768px){
  :root{
    --pc-mobile-surface:#ffffff;
    --pc-mobile-bg:#f2f3f5;
    --pc-mobile-shadow:0 8px 22px rgba(24,31,42,.085);
    --pc-mobile-radius:18px;
  }

  body{background:var(--pc-mobile-bg)!important}

  /* Separación y encabezados de categoría */
  .categoriaProductos{padding:3px 10px 0!important;margin:4px 0 24px!important}
  .cabeceraCategoria{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:0 3px!important;margin:8px 0 11px!important}
  .tituloCategoria{font-size:20px!important;line-height:1.1!important;font-weight:900!important;letter-spacing:-.025em!important;color:#141518!important}

  /* Grilla tipo aplicación */
  .grillaProductos,.carruselProductos,.carruselMovilUniversal{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:11px!important;
    padding:0!important;
  }

  .promo{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    min-height:292px!important;
    border:1px solid #e1e4e9!important;
    border-radius:var(--pc-mobile-radius)!important;
    background:var(--pc-mobile-surface)!important;
    box-shadow:var(--pc-mobile-shadow)!important;
    overflow:hidden!important;
    cursor:pointer!important;
  }
  .promo:active{transform:scale(.985)!important}
  .promo.productoNoDisponible{opacity:.72!important;filter:saturate(.55)!important}

  .promo .contenedorImagenProducto{
    position:relative!important;
    height:150px!important;
    min-height:150px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    background:linear-gradient(180deg,#fff 0%,#f7f7f8 100%)!important;
    border-bottom:1px solid #eef0f3!important;
  }
  .promo img,.promoImg{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center!important;
    transition:transform .22s ease!important;
  }
  .promo:active img{transform:scale(1.025)!important}
  .etiquetasProducto{top:8px!important;left:8px!important;right:8px!important;gap:5px!important}
  .etiquetasProducto>*{font-size:9px!important;border-radius:999px!important;padding:5px 7px!important;box-shadow:0 3px 10px rgba(0,0,0,.12)!important}

  .promoInfo{
    flex:1!important;
    display:flex!important;
    flex-direction:column!important;
    padding:11px 11px 10px!important;
  }
  .codigoPromo{font-size:9px!important;font-weight:800!important;letter-spacing:.06em!important;color:#9298a1!important;text-transform:uppercase!important}
  .promo h3{
    min-height:35px!important;
    margin:5px 0 3px!important;
    color:#15171a!important;
    font-size:14px!important;
    line-height:1.23!important;
    font-weight:850!important;
    letter-spacing:-.012em!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }
  .precioBloque{margin-top:auto!important;margin-bottom:6px!important;min-height:27px!important;display:flex!important;align-items:flex-end!important;gap:5px!important;flex-wrap:wrap!important}
  .precioAnterior{font-size:10px!important;color:#969ba3!important;text-decoration:line-through!important}
  .precioPromo{
    color:#141518!important;
    font-size:17px!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:-.02em!important;
  }
  .botonCarrito{
    min-height:39px!important;
    margin:3px 0 0!important;
    padding:8px 7px!important;
    border:0!important;
    border-radius:11px!important;
    background:linear-gradient(180deg,#ed171f,#dc0710)!important;
    color:#fff!important;
    box-shadow:0 5px 12px rgba(220,7,16,.18)!important;
    font-size:11.5px!important;
    line-height:1.15!important;
    font-weight:900!important;
  }
  .botonCarrito:disabled{background:#d5d8dd!important;color:#727983!important;box-shadow:none!important}

  /* Detalle de producto: pantalla limpia tipo app */
  .detallePromocionMovilOverlay{
    padding:0!important;
    align-items:flex-end!important;
    justify-content:center!important;
    background:rgba(24,27,33,.46)!important;
    backdrop-filter:blur(5px)!important;
  }
  .detallePromocionMovilTarjeta{
    width:100%!important;
    max-width:100%!important;
    max-height:94dvh!important;
    border:0!important;
    border-radius:25px 25px 0 0!important;
    background:#fff!important;
    box-shadow:0 -18px 50px rgba(17,24,39,.22)!important;
    overflow:auto!important;
  }
  .cerrarDetallePromocionMovil{
    position:fixed!important;
    top:calc(env(safe-area-inset-top) + 13px)!important;
    left:14px!important;
    right:auto!important;
    z-index:5!important;
    width:43px!important;
    height:43px!important;
    border:1px solid rgba(20,25,32,.10)!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.94)!important;
    color:#20242a!important;
    box-shadow:0 7px 20px rgba(17,24,39,.14)!important;
    font-size:24px!important;
  }
  .detallePromocionMovilImagenMarco{
    height:305px!important;
    min-height:305px!important;
    border-radius:0!important;
    background:linear-gradient(180deg,#fff,#f4f4f5)!important;
    overflow:hidden!important;
  }
  .detallePromocionMovilImagen{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center!important;
  }
  .detallePromocionMovilEtiquetas{top:18px!important;right:14px!important;left:auto!important}
  .detallePromocionMovilContenido{
    padding:20px 18px calc(22px + env(safe-area-inset-bottom))!important;
    color:#17191c!important;
    background:#fff!important;
  }
  .detallePromocionMovilCodigo{display:none!important}
  .detallePromocionMovilContenido h2{
    margin:0 0 7px!important;
    color:#15171a!important;
    font-size:26px!important;
    line-height:1.08!important;
    font-weight:950!important;
    letter-spacing:-.035em!important;
  }
  .detallePromocionMovilDescripcion{
    margin:0 0 14px!important;
    color:#5d646e!important;
    font-size:14px!important;
    line-height:1.5!important;
  }
  .detallePromocionMovilIncluye{
    margin:0 0 14px!important;
    padding:13px 14px!important;
    border:1px solid #e6e8ec!important;
    border-radius:14px!important;
    background:#f7f8fa!important;
    color:#4e5560!important;
    font-size:12px!important;
    line-height:1.45!important;
  }
  .detallePromocionMovilIncluye strong{display:block!important;margin:0 0 4px!important;color:#17191c!important;font-size:12px!important}
  .detallePromocionMovilPrecio{
    margin:4px 0 6px!important;
    color:#15171a!important;
    font-size:27px!important;
    line-height:1!important;
    font-weight:950!important;
  }
  .detallePromocionMovilEstado{
    display:inline-flex!important;
    align-items:center!important;
    width:auto!important;
    margin:2px 0 15px!important;
    padding:5px 9px!important;
    border-radius:999px!important;
    background:#ecf8f0!important;
    color:#16713d!important;
    font-size:11px!important;
    font-weight:850!important;
  }
  .detallePromocionMovilEstado.no-disponible{background:#fff0f0!important;color:#b4232b!important}
  .detallePromocionMovilAccion{
    position:sticky!important;
    bottom:0!important;
    width:100%!important;
    min-height:52px!important;
    border:0!important;
    border-radius:13px!important;
    background:linear-gradient(180deg,#ee171f,#dc0710)!important;
    color:#fff!important;
    box-shadow:0 8px 18px rgba(220,7,16,.20)!important;
    font-size:15px!important;
    font-weight:950!important;
  }

  /* Configurador consistente con el detalle */
  .modalConfigurador{padding:0!important;align-items:flex-end!important;background:transparent!important}
  .fondoModalConfigurador{background:rgba(24,27,33,.50)!important;backdrop-filter:blur(5px)!important}
  .ventanaConfigurador{
    max-width:none!important;
    max-height:94dvh!important;
    border:0!important;
    border-radius:25px 25px 0 0!important;
    background:#fff!important;
    color:#17191c!important;
    box-shadow:0 -18px 50px rgba(17,24,39,.24)!important;
  }
  .cabeceraConfigurador{padding:18px!important;background:#fff!important;border-bottom:1px solid #e9ebef!important}
  .cabeceraConfigurador h2{color:#17191c!important;font-size:22px!important}
  .codigoConfigurador{background:#fff1f1!important;color:var(--pc-red)!important}
  .cerrarConfigurador{background:#f0f2f5!important;color:#20242a!important}
  .contenidoConfigurador{background:#f6f7f9!important;color:#17191c!important}
  .pieConfigurador{background:#fff!important;border-top:1px solid #e8eaee!important}
}

@media (min-width:769px) and (max-width:1100px){
  .promo{border-radius:18px!important;box-shadow:0 8px 24px rgba(24,31,42,.08)!important}
  .promo img,.promoImg{height:180px!important}
}

/* RC27.3 — Portada móvil premium. Solo código; conserva el logo original. */
@media (max-width:768px){
  .mobileWelcome{
    background:
      radial-gradient(circle at 15% 8%,rgba(232,13,22,.08),transparent 28%),
      radial-gradient(circle at 92% 34%,rgba(255,196,61,.14),transparent 32%),
      linear-gradient(180deg,#f8f8f9 0%,#f1f2f4 100%);
    padding:0;
  }
  .mobileWelcomeShell{
    width:100%;min-height:100dvh;max-width:540px;margin:0 auto;
    display:flex;flex-direction:column;position:relative;overflow:hidden;
  }
  .mobileWelcomeBrand{
    min-height:102px;display:grid;grid-template-columns:48px 1fr 48px;
    align-items:center;gap:10px;padding:calc(14px + env(safe-area-inset-top)) 20px 10px;
  }
  .mobileWelcomeLogo{
    width:150px;max-width:100%;height:70px;max-height:70px;justify-self:center;
    object-fit:contain;filter:drop-shadow(0 8px 15px rgba(28,28,30,.08));
  }
  .mobileWelcomeUtility{
    width:44px!important;height:44px!important;border:1px solid rgba(31,41,51,.08)!important;
    border-radius:15px!important;background:rgba(255,255,255,.82)!important;
    box-shadow:0 8px 24px rgba(21,25,31,.08)!important;backdrop-filter:blur(12px);
  }
  .mobileWelcomeContent{
    width:100%;max-width:none;margin:0;padding:20px 20px 36px;display:flex;flex-direction:column;
  }
  .mobileWelcomeIntro{padding:8px 4px 25px;text-align:left;animation:pcWelcomeIntro .52s ease both}
  .mobileWelcomeEyebrow{
    display:inline-flex;margin-bottom:10px;color:var(--pc-red);font-size:10px;font-weight:950;
    letter-spacing:.13em;
  }
  .mobileWelcomeContent h1{
    margin:0!important;max-width:420px;color:#131416!important;font-family:Georgia,"Times New Roman",serif!important;
    font-size:37px!important;line-height:1.04!important;font-weight:800!important;letter-spacing:-.035em!important;
  }
  .mobileWelcomeContent h1::after{
    content:"";display:block;width:68px;height:4px;margin-top:13px;border-radius:999px;
    background:linear-gradient(90deg,var(--pc-red),#ff595f);
  }
  .mobileWelcomeContent>p,.mobileWelcomeIntro>p{
    margin:13px 0 0!important;color:#6a717b!important;font-size:15px!important;line-height:1.45;
  }
  .mobileDeliveryChoices{display:grid;gap:14px}
  .deliveryChoice{
    min-height:148px!important;margin:0!important;padding:19px 18px!important;border:1px solid rgba(25,30,38,.07)!important;
    border-radius:24px!important;display:grid!important;grid-template-columns:76px 1fr 44px!important;
    align-items:center!important;gap:15px!important;text-align:left!important;position:relative;overflow:hidden;
    box-shadow:0 16px 38px rgba(24,30,39,.12)!important;transition:transform .18s ease,box-shadow .18s ease!important;
    animation:pcWelcomeCard .55s ease both;
  }
  .deliveryChoice:nth-child(2){animation-delay:.08s}
  .deliveryChoice:active{transform:scale(.985)!important;box-shadow:0 8px 20px rgba(24,30,39,.11)!important}
  .deliveryChoicePrimary{
    color:#fff!important;background:linear-gradient(135deg,#f01d25 0%,#d50610 76%,#bd0008 100%)!important;
  }
  .deliveryChoicePrimary::after{
    content:"";position:absolute;width:150px;height:150px;border-radius:50%;right:-50px;top:-55px;
    background:rgba(255,255,255,.10);pointer-events:none;
  }
  .deliveryChoiceSecondary{
    color:#201600!important;background:linear-gradient(135deg,#ffd962 0%,#ffc130 72%,#f4ac10 100%)!important;
  }
  .deliveryChoiceSecondary::after{
    content:"";position:absolute;width:155px;height:155px;border-radius:50%;right:-56px;bottom:-76px;
    background:rgba(255,255,255,.20);pointer-events:none;
  }
  .deliveryChoiceIcon{
    width:72px;height:72px;border-radius:23px;display:grid!important;place-items:center;position:relative;z-index:1;
    background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);
  }
  .deliveryChoiceSecondary .deliveryChoiceIcon{background:rgba(255,255,255,.38);box-shadow:inset 0 0 0 1px rgba(255,255,255,.42)}
  .deliveryChoiceIcon svg{width:47px;height:47px;fill:none;stroke:currentColor;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
  .deliveryChoiceCopy{display:flex!important;flex-direction:column!important;gap:5px!important;position:relative;z-index:1}
  .deliveryChoiceCopy small{font-size:9px!important;font-weight:950!important;letter-spacing:.13em!important;opacity:.78}
  .deliveryChoiceCopy strong{font-size:24px!important;line-height:1.05!important;letter-spacing:-.025em!important;text-transform:none!important}
  .deliveryChoiceCopy>span{font-size:14px!important;line-height:1.35!important;opacity:.91}
  .deliveryChoiceArrow{
    width:42px;height:42px;border-radius:50%;display:grid!important;place-items:center;position:relative;z-index:2;
    color:currentColor;background:rgba(255,255,255,.20);font-size:34px;line-height:1;font-weight:300;
  }
  .deliveryChoiceSecondary .deliveryChoiceArrow{background:rgba(255,255,255,.48)}
  .mobileWelcomeTrust{
    margin:20px 2px 4px;padding:15px 16px;border-radius:18px;background:rgba(255,255,255,.70);
    border:1px solid rgba(26,31,38,.06);display:flex;justify-content:center;flex-wrap:wrap;gap:9px 15px;
    color:#5c636c;font-size:11px;font-weight:700;box-shadow:0 8px 24px rgba(21,25,31,.045);
  }
  .mobileWelcomeTrust b{display:inline-grid;place-items:center;width:17px;height:17px;margin-right:4px;border-radius:50%;background:#eaf8ee;color:#168548;font-size:10px}
  .mobileFeaturedPromo{
    margin-top:14px!important;border-radius:18px!important;border-color:rgba(232,13,22,.12)!important;
    background:rgba(255,255,255,.76)!important;backdrop-filter:blur(10px);box-shadow:0 9px 25px rgba(17,24,39,.055)!important;
  }
  .mobileWelcomeFooter{
    margin-top:auto;padding:8px 20px calc(19px + env(safe-area-inset-bottom));text-align:center;
    color:#7d838b;font-size:11px;font-weight:650;letter-spacing:.015em;
  }
  @keyframes pcWelcomeIntro{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  @keyframes pcWelcomeCard{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
}

@media (min-width:540px) and (max-width:768px){
  .mobileWelcomeContent{padding-left:36px;padding-right:36px}
  .mobileWelcomeBrand{padding-left:36px;padding-right:36px}
  .mobileWelcomeContent h1{font-size:42px!important}
  .deliveryChoice{min-height:158px!important;grid-template-columns:86px 1fr 48px!important}
  .deliveryChoiceIcon{width:82px;height:82px}
}


/* =====================================================
   RC27.4 — CONTROLES DE CANTIDAD Y CARRITO FLOTANTE
   La tarjeta usa - / cantidad / +. Los productos configurables
   siguen abriendo su selector original. No altera fotos ni catálogo.
===================================================== */
.mobileQuantityControl{display:none}
@media (max-width:768px){
  .promo{min-height:286px!important}
  .promo .botonCarrito{display:none!important}
  .mobileQuantityControl{
    display:grid;
    grid-template-columns:38px minmax(32px,1fr) 38px;
    align-items:center;
    min-height:40px;
    margin-top:4px;
    border:1px solid #e4e7eb;
    border-radius:12px;
    overflow:hidden;
    background:#f8f9fa;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
  }
  .mobileQuantityControl button{
    width:100%;height:40px;border:0;background:#fff;color:var(--pc-red);
    font-size:23px;font-weight:900;line-height:1;touch-action:manipulation;
    transition:background .16s ease,transform .12s ease,color .16s ease;
  }
  .mobileQuantityControl button:active{transform:scale(.9);background:#fff0f0}
  .mobileQuantityControl button:disabled{color:#b6bbc2;background:#f1f2f4}
  .mobileQuantityValue{
    height:40px;display:grid;place-items:center;border-left:1px solid #e7e9ed;
    border-right:1px solid #e7e9ed;background:#fff;color:#17191c;
    font-size:15px;font-weight:950;font-variant-numeric:tabular-nums;
  }
  .mobileQuantityControl.is-configurable .mobileQuantityPlus::after{
    content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:#ffc43d;
    margin:13px 0 0 -3px;box-shadow:0 0 0 2px #fff;
  }
  .mobileQuantityControl button{position:relative}
  .promo.mobileProductPulse{animation:mobileProductPulse .34s ease}
  @keyframes mobileProductPulse{0%{transform:scale(1)}45%{transform:scale(1.025);box-shadow:0 12px 28px rgba(232,13,22,.17)}100%{transform:scale(1)}}
  .mobileQuantityValue.quantityBump{animation:quantityBump .28s ease}
  @keyframes quantityBump{0%{transform:scale(.7);color:var(--pc-red)}65%{transform:scale(1.18);color:var(--pc-red)}100%{transform:scale(1);color:#17191c}}
}

/* =====================================================
   RC27.5 — EXPERIENCIA UNIFICADA WEB / TABLET
   Extiende la estética aprobada a escritorio sin modificar
   el catálogo, las fotos, el logo ni la lógica existente.
===================================================== */
@media (min-width:769px){
  :root{--pc-desktop-max:1380px;--pc-surface:#ffffff;--pc-soft:#f4f5f7;--pc-shadow:0 14px 38px rgba(22,28,38,.09)}
  html{scroll-behavior:smooth;background:var(--pc-soft)}
  body{margin:0;background:var(--pc-soft)!important;color:#17191c!important;font-family:Inter,Arial,Helvetica,sans-serif!important}

  /* Encabezado tipo aplicación */
  .cabeceraSitio{position:sticky!important;top:0!important;z-index:850!important;background:rgba(255,255,255,.96)!important;border-bottom:1px solid #e6e8ec!important;box-shadow:0 8px 28px rgba(20,26,35,.055)!important;backdrop-filter:blur(15px)}
  #menuSuperior{max-width:var(--pc-desktop-max)!important;min-height:78px!important;margin:0 auto!important;padding:11px 24px!important;display:grid!important;grid-template-columns:150px minmax(300px,1fr) 190px 220px!important;gap:17px!important;align-items:center!important}
  .marcaPrincipal{display:flex!important;align-items:center!important;justify-content:flex-start!important}
  .logoMenuImagen{width:126px!important;height:58px!important;object-fit:contain!important;filter:drop-shadow(0 5px 11px rgba(22,28,38,.08))}
  #buscador{height:50px!important;margin:0!important;border:1px solid #dfe3e8!important;border-radius:17px!important;background:#f5f6f8!important;box-shadow:none!important;overflow:hidden!important}
  #buscarProducto{height:100%!important;padding:0 50px 0 17px!important;border:0!important;background:transparent!important;color:#1b1e23!important;font-size:14px!important;font-weight:650!important}
  .limpiarBusquedaIntegrada{right:10px!important;top:9px!important;width:32px!important;height:32px!important;border-radius:50%!important;background:#e8ebef!important;color:#4d5560!important}
  .botonCuentaCliente{min-height:50px!important;padding:7px 12px!important;border:1px solid #e1e4e9!important;border-radius:16px!important;background:#fff!important;color:#20242a!important;box-shadow:0 5px 16px rgba(20,28,39,.055)!important}
  .botonCuentaClienteIcono{width:34px!important;height:34px!important;border-radius:12px!important;background:#fff0f0!important;color:var(--pc-red)!important;display:grid!important;place-items:center!important}
  .estadoLocalMenu{min-height:50px!important;padding:8px 13px!important;border-radius:16px!important;box-shadow:none!important}
  .barraCategoriasSuperior{max-width:var(--pc-desktop-max)!important;margin:0 auto!important;padding:0 24px 10px!important;display:flex!important;justify-content:center!important;gap:7px!important;background:transparent!important;border:0!important;overflow-x:auto!important}
  .barraCategoriasSuperior .enlaceMenu{min-height:40px!important;padding:0 13px!important;border-radius:12px!important;color:#454c56!important;background:transparent!important;font-size:12px!important;font-weight:750!important;white-space:nowrap!important}
  .barraCategoriasSuperior .enlaceMenu:hover,.barraCategoriasSuperior .enlaceMenu.activo{background:#fff0f0!important;color:var(--pc-red)!important}
  .barraConfianza{max-width:var(--pc-desktop-max)!important;margin:13px auto 0!important;padding:10px 20px!important;border:1px solid #e3e6eb!important;border-radius:16px!important;background:#fff!important;color:#555d67!important;box-shadow:0 7px 22px rgba(20,27,37,.045)!important;display:flex!important;justify-content:center!important;gap:38px!important;font-size:12px!important;font-weight:750!important}

  /* Hero premium */
  .portadaPrincipal{max-width:var(--pc-desktop-max)!important;margin:22px auto 0!important;padding:0 24px!important;background:transparent!important}
  .portadaCarrusel{min-height:410px!important;border-radius:28px!important;overflow:hidden!important;box-shadow:0 22px 55px rgba(25,22,22,.18)!important}
  .diapositivaPortada{min-height:410px!important}
  .contenidoPortada{max-width:600px!important;padding:56px 54px!important}
  .contenidoPortada h2{font-size:48px!important;line-height:1!important;letter-spacing:-.045em!important}
  .contenidoPortada p{max-width:530px!important;font-size:17px!important;line-height:1.5!important}
  .botonPortadaWhatsapp{min-height:50px!important;padding:0 20px!important;border-radius:14px!important;font-size:13px!important;box-shadow:0 11px 24px rgba(215,8,16,.20)!important}
  .beneficiosVersionDos{max-width:var(--pc-desktop-max)!important;margin:16px auto 4px!important;padding:0 24px!important;display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:12px!important;background:transparent!important}
  .beneficioVersionDos{min-height:76px!important;border:1px solid #e3e6eb!important;border-radius:18px!important;background:#fff!important;box-shadow:0 8px 23px rgba(20,27,37,.05)!important}

  /* Secciones y catálogo */
  .tituloSeccionDestacada,.seccionPromocionesPrincipal,#catalogo,.seccionUbicacion{max-width:var(--pc-desktop-max)!important;margin-left:auto!important;margin-right:auto!important}
  .tituloSeccionDestacada{padding:30px 24px 10px!important;justify-content:flex-start!important;gap:14px!important}
  .tituloSeccionDestacada h2{margin:0!important;color:#17191c!important;font-size:26px!important;letter-spacing:-.025em!important;text-align:left!important}
  .tituloSeccionDestacada span{display:none!important}
  .seccionPromocionesPrincipal,#catalogo{padding-left:24px!important;padding-right:24px!important}
  #contenedorPromos{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:17px!important;align-items:stretch!important;overflow:visible!important}
  .categoriaProductos{margin:31px 0 40px!important;padding:0!important}
  .cabeceraCategoria{margin:0 0 14px!important;padding:0!important}
  .tituloCategoria{color:#17191c!important;font-size:26px!important;letter-spacing:-.025em!important}
  .grillaProductos,.carruselProductos,.carruselMovilUniversal{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:17px!important;padding:0!important;overflow:visible!important;scroll-snap-type:none!important}
  .controlesCarrusel{display:none!important}

  /* Tarjetas compartidas con el lenguaje móvil */
  .promo{width:auto!important;min-width:0!important;height:100%!important;margin:0!important;border:1px solid #e2e5e9!important;border-radius:22px!important;background:#fff!important;color:#17191c!important;box-shadow:0 9px 28px rgba(20,27,38,.075)!important;overflow:hidden!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important}
  .promo:hover{transform:translateY(-4px)!important;border-color:#efc7c9!important;box-shadow:0 18px 38px rgba(20,27,38,.12)!important}
  .contenedorImagenProducto{background:#fff!important;overflow:hidden!important}
  .promo img,.promoImg{width:100%!important;height:210px!important;object-fit:cover!important;transition:transform .28s ease!important}
  .promo:hover img,.promo:hover .promoImg{transform:scale(1.025)!important}
  .promoInfo{padding:15px 16px 16px!important;text-align:left!important;display:flex!important;flex-direction:column!important;min-height:198px!important}
  .codigoPromo{color:#949ba5!important;font-size:10px!important;font-weight:800!important;letter-spacing:.04em!important}
  .promoInfo h3,.promo h3{margin:6px 0 5px!important;min-height:43px!important;color:#17191c!important;font-size:17px!important;line-height:1.22!important;font-weight:900!important}
  .descripcionPromo{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;min-height:38px!important;margin:0 0 8px!important;color:#747c87!important;font-size:12px!important;line-height:1.45!important}
  .precioPromo,.promo h2{margin:4px 0 10px!important;color:#111!important;font-size:21px!important;font-weight:950!important}
  .estadoPromo{display:none!important}
  .botonCarrito{margin-top:auto!important;width:100%!important;min-height:43px!important;border:0!important;border-radius:13px!important;background:linear-gradient(180deg,#ef171f,#d90710)!important;color:#fff!important;font-size:12px!important;font-weight:900!important;box-shadow:0 8px 17px rgba(217,7,16,.17)!important}
  .botonCarrito:hover{filter:brightness(.96)!important;transform:none!important}

  /* Carrito siempre accesible */
  #carrito{position:fixed!important;right:24px!important;bottom:24px!important;z-index:920!important;min-width:205px!important;height:62px!important;border:1px solid #e0e3e7!important;border-radius:19px!important;background:#fff!important;color:#17191c!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;padding:0 19px!important;box-shadow:0 15px 38px rgba(15,23,42,.20)!important;font-size:16px!important;font-weight:850!important;cursor:pointer!important}
  #carrito::after{content:"Ver mi pedido";color:#656d78;font-size:11px;font-weight:700!important}
  #cantidadCarrito{min-width:25px!important;height:25px!important;border-radius:999px!important;background:var(--pc-red)!important;color:#fff!important;display:grid!important;place-items:center!important;font-size:12px!important}
  #panelCarrito{width:min(430px,100vw)!important;background:#f7f8fa!important;box-shadow:-22px 0 55px rgba(17,24,39,.20)!important}
  .cabeceraCarrito{background:#fff!important;border-bottom:1px solid #e6e8ec!important}
  #contenidoCarrito{padding:17px!important}
  #footerCarrito{background:#fff!important;border-top:1px solid #e4e7eb!important;padding:16px!important}
  #finalizarPedido{border-radius:14px!important;background:var(--pc-red)!important}
  #panelDatos{width:min(520px,100vw)!important;background:#f6f7f9!important}

  /* Ubicación y pie */
  .seccionUbicacion{padding:25px 24px 52px!important}
  .ubicacionContenedor{border-radius:25px!important;overflow:hidden!important;box-shadow:var(--pc-shadow)!important}
  .footerPrincipal{background:#202328!important}
}

@media (min-width:769px) and (max-width:1100px){
  #menuSuperior{grid-template-columns:125px minmax(230px,1fr) 165px!important;padding-left:18px!important;padding-right:18px!important}
  .estadoLocalMenu{display:none!important}
  .barraCategoriasSuperior{justify-content:flex-start!important;padding-left:18px!important;padding-right:18px!important}
  .portadaPrincipal,.beneficiosVersionDos,.tituloSeccionDestacada,.seccionPromocionesPrincipal,#catalogo,.seccionUbicacion{padding-left:18px!important;padding-right:18px!important}
  .portadaCarrusel,.diapositivaPortada{min-height:350px!important}
  .contenidoPortada{padding:42px 38px!important}.contenidoPortada h2{font-size:39px!important}
  #contenedorPromos,.grillaProductos,.carruselProductos,.carruselMovilUniversal{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .promo img,.promoImg{height:185px!important}
  .beneficiosVersionDos{grid-template-columns:repeat(2,1fr)!important}
}

@media (min-width:1450px){
  #contenedorPromos,.grillaProductos,.carruselProductos,.carruselMovilUniversal{grid-template-columns:repeat(5,minmax(0,1fr))!important}
}

/* =====================================================
   RC28.1 — PORTADA MÓVIL RENOVADA
   Portada limpia: logo, modalidad de entrega y carrusel
   visual de promociones. No modifica el catálogo.
===================================================== */
@media (max-width:768px){
  .mobileWelcomeRC28{
    background:
      radial-gradient(circle at 105% 15%,rgba(255,193,48,.22),transparent 31%),
      radial-gradient(circle at -8% 43%,rgba(232,13,22,.10),transparent 30%),
      linear-gradient(180deg,#fffaf7 0%,#f7f7f8 72%,#f2f3f5 100%)!important;
    transition:opacity .38s ease,transform .38s cubic-bezier(.22,.8,.25,1),filter .38s ease;
  }
  .mobileWelcomeRC28.is-leaving{opacity:0;transform:scale(1.025);filter:blur(5px)}
  .mobileWelcomeBrandSimple{
    min-height:126px!important;display:flex!important;justify-content:center!important;
    padding:calc(22px + env(safe-area-inset-top)) 20px 4px!important;
  }
  .mobileWelcomeBrandSimple .mobileWelcomeLogo{
    width:178px!important;height:88px!important;max-height:88px!important;
    filter:drop-shadow(0 11px 18px rgba(33,20,16,.13))!important;
    animation:pcLogoArrival .65s cubic-bezier(.22,.9,.3,1) both;
  }
  .mobileWelcomeRC28 .mobileWelcomeContent{padding:8px 20px 30px!important}
  .mobileWelcomeIntroRC28{padding:6px 3px 22px!important;text-align:center!important}
  .mobileWelcomeIntroRC28 h1{
    max-width:none!important;font-family:"Trebuchet MS","Segoe UI",sans-serif!important;
    font-size:35px!important;line-height:1.06!important;font-weight:900!important;
    letter-spacing:-.045em!important;color:#171313!important;
  }
  .mobileWelcomeIntroRC28 h1::after{
    width:54px!important;height:4px!important;margin:14px auto 0!important;
    background:linear-gradient(90deg,#e30d16,#ffb71b)!important;
  }
  .mobileWelcomeIntroRC28 p{
    margin:12px 0 0!important;font-family:"Segoe UI",sans-serif!important;
    font-size:14px!important;color:#716b6b!important;
  }
  .mobileDeliveryChoicesRC28{gap:12px!important}
  .mobileDeliveryChoicesRC28 .deliveryChoice{
    min-height:126px!important;grid-template-columns:68px 1fr 38px!important;
    padding:16px!important;border-radius:25px!important;
    box-shadow:0 16px 34px rgba(28,22,20,.13)!important;
  }
  .mobileDeliveryChoicesRC28 .deliveryChoiceIcon{width:64px!important;height:64px!important;border-radius:20px!important}
  .mobileDeliveryChoicesRC28 .deliveryChoiceIcon svg{width:42px!important;height:42px!important}
  .mobileDeliveryChoicesRC28 .deliveryChoiceCopy strong{font-family:"Trebuchet MS","Segoe UI",sans-serif!important;font-size:23px!important;font-weight:900!important}
  .mobileDeliveryChoicesRC28 .deliveryChoiceCopy>span{font-size:13px!important}
  .mobileDeliveryChoicesRC28 .deliveryChoiceArrow{width:38px!important;height:38px!important;font-size:30px!important}
  .welcomePromoShowcase{
    margin-top:22px;padding:0 2px 8px;animation:pcPromoArrival .65s .18s ease both;
  }
  .welcomePromoHeading{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:0 3px 10px}
  .welcomePromoHeading span{
    color:#241f1f;font-family:"Trebuchet MS","Segoe UI",sans-serif;font-size:17px;font-weight:900;letter-spacing:-.02em;
  }
  .welcomePromoHeading small{color:#8a8383;font-size:10px;font-weight:700;text-align:right}
  .welcomePromoCarousel{
    position:relative;overflow:hidden;border-radius:20px;background:#fff;
    box-shadow:0 12px 30px rgba(27,23,22,.11);pointer-events:none;user-select:none;
  }
  .welcomePromoTrack{position:relative;width:100%;aspect-ratio:2.15/1}
  .welcomePromoSlide{
    position:absolute;inset:0;opacity:0;transform:scale(1.035);
    transition:opacity .65s ease,transform 1.2s ease;
  }
  .welcomePromoSlide.is-active{opacity:1;transform:scale(1)}
  .welcomePromoSlide img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
  .welcomePromoCarousel::after{
    content:"Muestra de promociones";position:absolute;left:12px;top:11px;padding:5px 9px;border-radius:999px;
    background:rgba(16,13,13,.72);color:#fff;font-size:9px;font-weight:800;letter-spacing:.04em;backdrop-filter:blur(7px);
  }
  .welcomePromoDots{position:absolute;left:0;right:0;bottom:9px;display:flex;justify-content:center;gap:5px}
  .welcomePromoDots span{width:6px;height:6px;border-radius:99px;background:rgba(255,255,255,.60);box-shadow:0 1px 3px rgba(0,0,0,.18);transition:width .3s ease,background .3s ease}
  .welcomePromoDots span.is-active{width:20px;background:#fff}
  @keyframes pcLogoArrival{from{opacity:0;transform:translateY(-10px) scale(.92)}to{opacity:1;transform:none}}
  @keyframes pcPromoArrival{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
}

/* =====================================================
   RC28.17 — PORTADA LIMPIA + CARRUSEL INFORMATIVO
   Sin menú ni carrito en la pantalla de elección.
===================================================== */
@media (max-width:768px){
  .mobileWelcomeBrandClean{
    min-height:122px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:calc(22px + env(safe-area-inset-top)) 20px 4px!important;
  }
  .mobileWelcomeBrandClean .mobileWelcomeLogo{
    margin:0 auto!important;
  }
  .mobileWelcomeContent{
    padding-bottom:22px!important;
  }
  .mobileWelcomeTrust,
  .mobileFeaturedPromo{
    display:none!important;
  }
  .welcomePromoShowcase{
    margin-top:22px!important;
    padding:0 0 8px!important;
  }
  .welcomePromoHeading{
    display:flex!important;
    align-items:flex-end!important;
    justify-content:space-between!important;
    gap:10px!important;
    margin:0 4px 10px!important;
  }
  .welcomePromoHeading span{
    color:#211d1d!important;
    font-family:"Trebuchet MS","Segoe UI",sans-serif!important;
    font-size:17px!important;
    line-height:1.1!important;
    font-weight:900!important;
    letter-spacing:-.025em!important;
  }
  .welcomePromoHeading small{
    color:#888181!important;
    font-size:10px!important;
    font-weight:750!important;
    white-space:nowrap!important;
  }
  .welcomePromoCarousel{
    position:relative!important;
    overflow:hidden!important;
    width:100%!important;
    border-radius:22px!important;
    background:#fff!important;
    box-shadow:0 14px 34px rgba(31,25,23,.12)!important;
    pointer-events:none!important;
    user-select:none!important;
    -webkit-user-select:none!important;
    touch-action:pan-y!important;
  }
  .welcomePromoTrack{
    position:relative!important;
    width:100%!important;
    aspect-ratio:2.05/1!important;
    min-height:158px!important;
  }
  .welcomePromoSlide{
    position:absolute!important;
    inset:0!important;
    opacity:0!important;
    transform:scale(1.025)!important;
    transition:opacity .62s ease,transform 1.15s ease!important;
    background:#ececec!important;
  }
  .welcomePromoSlide.is-active{
    opacity:1!important;
    transform:scale(1)!important;
  }
  .welcomePromoSlide img{
    width:100%!important;
    height:100%!important;
    display:block!important;
    object-fit:cover!important;
    object-position:center!important;
  }
  .welcomePromoShade{
    position:absolute!important;
    inset:auto 0 0!important;
    min-height:46%!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-end!important;
    padding:34px 16px 18px!important;
    color:#fff!important;
    background:linear-gradient(180deg,transparent,rgba(0,0,0,.76))!important;
  }
  .welcomePromoShade small{
    margin-bottom:3px!important;
    font-size:9px!important;
    font-weight:900!important;
    letter-spacing:.11em!important;
    text-transform:uppercase!important;
    opacity:.84!important;
  }
  .welcomePromoShade strong{
    max-width:90%!important;
    font-size:18px!important;
    line-height:1.08!important;
    font-weight:900!important;
    letter-spacing:-.02em!important;
  }
  .welcomePromoDots{
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:9px!important;
    z-index:3!important;
    display:flex!important;
    justify-content:center!important;
    gap:5px!important;
  }
  .welcomePromoDots span{
    width:6px!important;
    height:6px!important;
    border-radius:99px!important;
    background:rgba(255,255,255,.58)!important;
    box-shadow:0 1px 4px rgba(0,0,0,.28)!important;
    transition:width .28s ease,background .28s ease!important;
  }
  .welcomePromoDots span.is-active{
    width:21px!important;
    background:#fff!important;
  }
  .welcomePromoLoading{
    position:absolute!important;
    inset:0!important;
    display:grid!important;
    place-items:center!important;
    color:#777!important;
    font-size:12px!important;
    font-weight:700!important;
    background:linear-gradient(110deg,#f4f4f4 20%,#fff 40%,#f4f4f4 60%)!important;
    background-size:220% 100%!important;
    animation:pcPromoLoading 1.3s linear infinite!important;
  }
  .mobileWelcomeFooter{
    padding-top:10px!important;
  }
  @keyframes pcPromoLoading{to{background-position:-220% 0}}
}


/* =====================================================
   RC28.18 — PORTADA PREMIUM COMPACTA
   Diseño inspirado en el mockup aprobado, manteniendo
   botones funcionales y carrusel únicamente informativo.
===================================================== */
@media (max-width:768px){
  .mobileWelcome{
    background:
      radial-gradient(circle at 8% 7%,rgba(255,214,219,.52),transparent 31%),
      radial-gradient(circle at 96% 42%,rgba(255,213,83,.25),transparent 30%),
      linear-gradient(180deg,#fff9f7 0%,#fffdf9 57%,#f6f7f9 100%)!important;
  }
  .mobileWelcomeShell{min-height:100dvh!important}
  .mobileWelcomeBrandClean{
    min-height:136px!important;
    padding:calc(17px + env(safe-area-inset-top)) 20px 0!important;
  }
  .mobileWelcomeBrandClean .mobileWelcomeLogo{
    width:214px!important;height:auto!important;max-height:118px!important;
    object-fit:contain!important;background:transparent!important;
    filter:drop-shadow(0 10px 14px rgba(61,22,13,.18))!important;
  }
  .mobileWelcomeContent{padding:0 20px 18px!important}
  .mobileWelcomeIntro{padding:0 5px 17px!important;text-align:center!important}
  .mobileWelcomeEyebrow{
    display:block!important;margin:0 0 13px!important;color:#cc1720!important;
    font-family:Arial,sans-serif!important;font-size:12px!important;font-weight:900!important;
    line-height:1!important;letter-spacing:.22em!important;
  }
  .mobileWelcomeIntro h1{
    display:flex!important;flex-wrap:wrap!important;align-items:baseline!important;
    justify-content:center!important;column-gap:.18em!important;row-gap:0!important;
    max-width:560px!important;margin:0 auto!important;
    font-family:"Arial Rounded MT Bold","Trebuchet MS","Segoe UI",sans-serif!important;
    font-size:clamp(37px,10.8vw,53px)!important;line-height:.91!important;
    font-weight:1000!important;letter-spacing:-.065em!important;color:#111!important;
    text-wrap:balance!important;
  }
  .mobileWelcomeIntro h1 span{display:inline-block!important}
  .mobileWelcomeIntro h1 .mobileWelcomeTitleAccent{color:#d40f18!important}
  .mobileWelcomeIntro h1::after{
    content:""!important;display:block!important;flex-basis:100%!important;
    width:66px!important;height:4px!important;margin:15px auto 0!important;
    border-radius:99px!important;background:#d81720!important;
  }
  .mobileWelcomeIntro p{
    margin:13px 0 0!important;color:#6f7178!important;
    font-family:"Segoe UI",Arial,sans-serif!important;font-size:14px!important;line-height:1.35!important;
  }
  .mobileDeliveryChoices{gap:11px!important}
  .mobileDeliveryChoices .deliveryChoice{
    min-height:120px!important;grid-template-columns:68px minmax(0,1fr) 38px!important;
    padding:15px!important;border:0!important;border-radius:24px!important;
    box-shadow:0 14px 29px rgba(38,24,19,.13)!important;
  }
  .deliveryChoicePrimary{background:linear-gradient(135deg,#f21a26 0%,#d9000b 100%)!important}
  .deliveryChoiceSecondary{background:linear-gradient(135deg,#ffd653 0%,#ffbd21 100%)!important}
  .mobileDeliveryChoices .deliveryChoiceIcon{
    width:64px!important;height:64px!important;border-radius:20px!important;
    background:rgba(255,255,255,.17)!important;border:1px solid rgba(255,255,255,.22)!important;
  }
  .deliveryChoiceSecondary .deliveryChoiceIcon{background:rgba(255,255,255,.38)!important;border-color:rgba(255,255,255,.42)!important}
  .mobileDeliveryChoices .deliveryChoiceIcon svg{width:47px!important;height:47px!important;stroke-width:3.1!important}
  .deliveryChoicePrimary .deliveryChoiceIcon svg{transform:translateX(-1px)!important}
  .mobileDeliveryChoices .deliveryChoiceCopy small{font-size:9px!important;letter-spacing:.13em!important}
  .mobileDeliveryChoices .deliveryChoiceCopy strong{
    margin:3px 0!important;font-family:"Arial Rounded MT Bold","Trebuchet MS",sans-serif!important;
    font-size:22px!important;line-height:1!important;font-weight:1000!important;letter-spacing:-.035em!important;
  }
  .mobileDeliveryChoices .deliveryChoiceCopy>span{font-size:13px!important;line-height:1.2!important}
  .mobileDeliveryChoices .deliveryChoiceArrow{width:38px!important;height:38px!important;font-size:29px!important}

  .welcomePromoShowcase{margin-top:18px!important;padding:0 0 3px!important}
  .welcomePromoHeading{
    justify-content:center!important;align-items:center!important;margin:0 0 9px!important;
  }
  .welcomePromoHeading span{
    color:#c81820!important;font-family:"Arial Rounded MT Bold","Trebuchet MS",sans-serif!important;
    font-size:14px!important;font-weight:1000!important;letter-spacing:-.015em!important;
  }
  .welcomePromoHeading small{display:none!important}
  .welcomePromoCarousel{
    width:100%!important;overflow:hidden!important;border-radius:0!important;background:transparent!important;
    box-shadow:none!important;padding:0 0 17px!important;
  }
  .welcomePromoCarousel::after{display:none!important}
  .welcomePromoTrack{
    display:flex!important;gap:9px!important;width:auto!important;min-height:0!important;
    aspect-ratio:auto!important;padding:0 13%!important;
    transition:transform .72s cubic-bezier(.22,.8,.25,1)!important;
    will-change:transform!important;
  }
  .welcomePromoSlide{
    position:relative!important;inset:auto!important;flex:0 0 72%!important;
    height:112px!important;opacity:.58!important;transform:scale(.91)!important;
    transition:opacity .55s ease,transform .55s ease!important;background:transparent!important;
  }
  .welcomePromoSlide.is-active{opacity:1!important;transform:scale(1)!important}
  .welcomePromoCard{
    position:relative!important;width:100%!important;height:100%!important;overflow:hidden!important;
    border-radius:16px!important;background:#1b1614!important;
    box-shadow:0 10px 22px rgba(37,23,17,.18)!important;
  }
  .welcomePromoSlide img{width:100%!important;height:100%!important;object-fit:cover!important}
  .welcomePromoBadge{
    position:absolute!important;left:8px!important;top:8px!important;z-index:2!important;
    padding:3px 7px!important;border-radius:999px!important;background:#ffc51f!important;color:#17120d!important;
    font-size:7px!important;font-weight:1000!important;letter-spacing:.03em!important;
  }
  .welcomePromoShade{
    min-height:65%!important;padding:24px 10px 9px!important;
    background:linear-gradient(180deg,transparent,rgba(0,0,0,.86))!important;
  }
  .welcomePromoShade small{display:none!important}
  .welcomePromoShade strong{
    display:block!important;max-width:100%!important;color:#fff!important;
    font-size:12px!important;line-height:1.02!important;font-weight:1000!important;
    text-transform:uppercase!important;text-shadow:0 1px 4px rgba(0,0,0,.5)!important;
  }
  .welcomePromoShade b{
    display:inline-block!important;margin-top:4px!important;padding:3px 6px!important;
    border-radius:6px!important;background:#e51a24!important;color:#fff!important;
    font-size:12px!important;line-height:1!important;font-weight:1000!important;
  }
  .welcomePromoDots{bottom:2px!important;gap:5px!important}
  .welcomePromoDots span{width:6px!important;height:6px!important;background:#d6d6d6!important;box-shadow:none!important}
  .welcomePromoDots span.is-active{width:6px!important;background:#d3131d!important}
  .mobileWelcomeFooter{padding:10px 14px calc(10px + env(safe-area-inset-bottom))!important;font-size:10px!important}
}

@media (max-width:390px) and (max-height:760px){
  .mobileWelcomeBrandClean{min-height:111px!important;padding-top:calc(10px + env(safe-area-inset-top))!important}
  .mobileWelcomeBrandClean .mobileWelcomeLogo{width:170px!important;max-height:90px!important}
  .mobileWelcomeIntro h1{font-size:36px!important}
  .mobileDeliveryChoices .deliveryChoice{min-height:108px!important;padding:12px!important}
  .welcomePromoSlide{height:96px!important}
}

/* =====================================================
   RC28.19 — PORTADA MÓVIL FIEL AL MOCKUP APROBADO
   -----------------------------------------------------
   1. Composición general compacta
   2. Marca y título principal
   3. Botones de modalidad
   4. Carrusel informativo de promociones
   5. Ajustes para pantallas pequeñas
===================================================== */
@media (max-width:768px){
  /* 1. COMPOSICIÓN GENERAL */
  .mobileWelcome{
    background:
      radial-gradient(circle at 12% 2%,rgba(255,215,220,.50),transparent 32%),
      radial-gradient(circle at 96% 52%,rgba(255,216,92,.21),transparent 30%),
      linear-gradient(180deg,#fff9f8 0%,#fffefb 70%,#f7f7f8 100%)!important;
  }
  .mobileWelcomeShell{
    min-height:100dvh!important;
    display:flex!important;
    flex-direction:column!important;
  }
  .mobileWelcomeContent{
    width:100%!important;
    max-width:430px!important;
    margin:0 auto!important;
    padding:0 20px 12px!important;
  }

  /* 2. MARCA Y TÍTULO PRINCIPAL */
  .mobileWelcomeBrandClean{
    min-height:104px!important;
    padding:calc(12px + env(safe-area-inset-top)) 20px 2px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .mobileWelcomeBrandClean .mobileWelcomeLogo{
    width:132px!important;
    max-width:36vw!important;
    height:auto!important;
    max-height:84px!important;
    object-fit:contain!important;
    background:transparent!important;
    filter:drop-shadow(0 7px 10px rgba(67,22,14,.16))!important;
  }
  .mobileWelcomeIntro{
    padding:0 4px 13px!important;
    text-align:center!important;
  }
  .mobileWelcomeEyebrow{
    display:block!important;
    margin:0 0 10px!important;
    color:#c9141d!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:10px!important;
    line-height:1!important;
    font-weight:900!important;
    letter-spacing:.24em!important;
  }
  .mobileWelcomeIntro h1{
    display:block!important;
    max-width:390px!important;
    margin:0 auto!important;
    color:#0c0c0d!important;
    font-family:"Arial Rounded MT Bold","Trebuchet MS","Segoe UI",Arial,sans-serif!important;
    font-size:clamp(36px,10.8vw,49px)!important;
    line-height:.91!important;
    font-weight:1000!important;
    letter-spacing:-.065em!important;
    text-align:center!important;
  }
  .mobileWelcomeTitleLine{
    display:block!important;
    white-space:nowrap!important;
  }
  .mobileWelcomeTitleAccent{
    display:inline!important;
    color:#d30d18!important;
  }
  .mobileWelcomeIntro h1::after{
    content:""!important;
    display:block!important;
    width:58px!important;
    height:4px!important;
    margin:13px auto 0!important;
    border-radius:99px!important;
    background:#d71922!important;
  }
  .mobileWelcomeIntro p{
    margin:11px 0 0!important;
    color:#77787d!important;
    font-size:13px!important;
    line-height:1.35!important;
    font-weight:500!important;
  }

  /* 3. BOTONES DE MODALIDAD */
  .mobileDeliveryChoices{
    display:grid!important;
    gap:11px!important;
    margin:0!important;
  }
  .mobileDeliveryChoices .deliveryChoice{
    min-height:104px!important;
    margin:0!important;
    padding:14px 16px!important;
    border-radius:22px!important;
    box-shadow:0 11px 24px rgba(45,27,23,.13)!important;
  }
  .mobileDeliveryChoices .deliveryChoiceIcon{
    flex:0 0 68px!important;
    width:68px!important;
    height:68px!important;
    border-radius:19px!important;
    display:grid!important;
    place-items:center!important;
  }
  .mobileDeliveryChoices .deliveryChoiceIcon svg{
    width:45px!important;
    height:45px!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:3.2!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
  }
  .deliveryChoicePrimary .deliveryChoiceIcon{
    color:#fff!important;
    background:rgba(255,255,255,.14)!important;
    border:1px solid rgba(255,255,255,.25)!important;
  }
  .deliveryChoiceSecondary .deliveryChoiceIcon{
    color:#151515!important;
    background:rgba(255,255,255,.36)!important;
    border:1px solid rgba(255,255,255,.43)!important;
  }
  .mobileDeliveryChoices .deliveryChoiceCopy{
    flex:1 1 auto!important;
    min-width:0!important;
    gap:3px!important;
    margin-left:13px!important;
  }
  .mobileDeliveryChoices .deliveryChoiceCopy small{
    font-size:8px!important;
    line-height:1.15!important;
    font-weight:950!important;
    letter-spacing:.14em!important;
  }
  .mobileDeliveryChoices .deliveryChoiceCopy strong{
    font-size:21px!important;
    line-height:1.05!important;
    font-weight:950!important;
    letter-spacing:-.035em!important;
  }
  .mobileDeliveryChoices .deliveryChoiceCopy>span{
    font-size:12px!important;
    line-height:1.25!important;
  }
  .mobileDeliveryChoices .deliveryChoiceArrow{
    flex:0 0 39px!important;
    width:39px!important;
    height:39px!important;
    border-radius:50%!important;
    display:grid!important;
    place-items:center!important;
    font-size:27px!important;
    line-height:1!important;
  }

  /* 4. CARRUSEL INFORMATIVO */
  .welcomePromoShowcase{
    margin-top:15px!important;
    padding:0!important;
  }
  .welcomePromoHeading{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0 0 9px!important;
  }
  .welcomePromoHeading::before,
  .welcomePromoHeading::after{
    content:""!important;
    flex:1!important;
    height:1px!important;
    background:#e9e2df!important;
  }
  .welcomePromoHeading span{
    flex:0 0 auto!important;
    padding:0 12px!important;
    color:#c9131d!important;
    font-size:13px!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:-.02em!important;
  }
  .welcomePromoCarousel{
    width:100%!important;
    overflow:hidden!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    pointer-events:none!important;
  }
  .welcomePromoTrack{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    width:auto!important;
    min-height:118px!important;
    padding:0 1px 20px!important;
    transition:transform .72s cubic-bezier(.22,.75,.25,1)!important;
    will-change:transform!important;
  }
  .welcomePromoSlide{
    position:relative!important;
    inset:auto!important;
    flex:0 0 61%!important;
    height:104px!important;
    opacity:.98!important;
    transform:scale(.91)!important;
    transition:transform .55s ease,opacity .55s ease!important;
    background:transparent!important;
  }
  .welcomePromoSlide.is-active{
    opacity:1!important;
    transform:scale(1)!important;
  }
  .welcomePromoCard{
    position:relative!important;
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
    border-radius:16px!important;
    background:#26201d!important;
    box-shadow:0 9px 20px rgba(31,22,18,.18)!important;
  }
  .welcomePromoSlide img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center!important;
  }
  .welcomePromoBadge{
    top:7px!important;
    left:7px!important;
    padding:3px 7px!important;
    border-radius:99px!important;
    font-size:7px!important;
  }
  .welcomePromoShade{
    min-height:55%!important;
    padding:24px 9px 8px!important;
    background:linear-gradient(180deg,transparent,rgba(0,0,0,.79))!important;
  }
  .welcomePromoShade strong{
    max-width:95%!important;
    font-size:11px!important;
    line-height:1.05!important;
    font-weight:950!important;
  }
  .welcomePromoShade b{
    display:inline-flex!important;
    align-self:flex-start!important;
    margin-top:4px!important;
    padding:3px 7px!important;
    border-radius:5px!important;
    background:#ef202b!important;
    color:#fff!important;
    font-size:11px!important;
    line-height:1!important;
    font-weight:950!important;
  }
  .welcomePromoDots{
    position:absolute!important;
    bottom:2px!important;
    gap:5px!important;
  }
  .welcomePromoDots span,
  .welcomePromoDots span.is-active{
    width:6px!important;
    height:6px!important;
    border-radius:50%!important;
  }
  .welcomePromoDots span{background:#d5d5d5!important}
  .welcomePromoDots span.is-active{background:#d3131d!important}
  .mobileWelcomeFooter{
    margin-top:auto!important;
    min-height:42px!important;
    padding:13px 16px calc(12px + env(safe-area-inset-bottom))!important;
    font-size:10px!important;
  }
}

/* 5. AJUSTES PARA CELULARES DE MENOR ALTURA */
@media (max-width:768px) and (max-height:720px){
  .mobileWelcomeBrandClean{min-height:86px!important;padding-top:calc(8px + env(safe-area-inset-top))!important}
  .mobileWelcomeBrandClean .mobileWelcomeLogo{width:108px!important;max-height:68px!important}
  .mobileWelcomeIntro h1{font-size:34px!important}
  .mobileWelcomeIntro{padding-bottom:10px!important}
  .mobileDeliveryChoices .deliveryChoice{min-height:88px!important;padding:10px 13px!important}
  .mobileDeliveryChoices .deliveryChoiceIcon{width:58px!important;height:58px!important;flex-basis:58px!important}
  .mobileDeliveryChoices .deliveryChoiceIcon svg{width:39px!important;height:39px!important}
  .welcomePromoSlide{height:90px!important}
  .welcomePromoTrack{min-height:104px!important}
}

/* =====================================================
   RC28.20 — PORTADA: BOTONES CENTRALES + CARRUSEL AL PIE
   -----------------------------------------------------
   1. Distribución vertical de la portada
   2. Botones principales más grandes y centrados
   3. Carrusel anclado al pie de la pantalla
   4. Promoción activa ampliada y tarjetas laterales reducidas
   5. Ajustes responsivos para pantallas bajas
===================================================== */
@media (max-width:768px){
  /* 1. DISTRIBUCIÓN VERTICAL DE LA PORTADA */
  .mobileWelcomeContent{
    flex:1 1 auto!important;
    display:flex!important;
    flex-direction:column!important;
    min-height:0!important;
    padding-bottom:8px!important;
  }

  .mobileWelcomeIntro{
    flex:0 0 auto!important;
  }

  /* 2. BOTONES PRINCIPALES MÁS GRANDES Y CENTRADOS */
  .mobileDeliveryChoices{
    flex:0 0 auto!important;
    width:100%!important;
    max-width:410px!important;
    margin:8px auto 0!important;
    gap:14px!important;
  }

  .mobileDeliveryChoices .deliveryChoice{
    width:100%!important;
    min-height:122px!important;
    padding:17px 18px!important;
    border-radius:25px!important;
    box-shadow:0 14px 29px rgba(45,27,23,.15)!important;
  }

  .mobileDeliveryChoices .deliveryChoiceIcon{
    flex-basis:76px!important;
    width:76px!important;
    height:76px!important;
    border-radius:22px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceIcon svg{
    width:51px!important;
    height:51px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceCopy{
    margin-left:15px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceCopy small{
    font-size:9px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceCopy strong{
    font-size:24px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceCopy>span{
    font-size:14px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceArrow{
    flex-basis:44px!important;
    width:44px!important;
    height:44px!important;
    font-size:31px!important;
  }

  /* 3. CARRUSEL ANCLADO AL PIE DE LA PANTALLA */
  .welcomePromoShowcase{
    flex:0 0 auto!important;
    width:100%!important;
    margin-top:auto!important;
    padding-top:22px!important;
    padding-bottom:2px!important;
  }

  .welcomePromoHeading{
    margin-bottom:12px!important;
  }

  .welcomePromoCarousel{
    overflow:hidden!important;
    padding:8px 0 0!important;
  }

  /* 4. PROMOCIÓN ACTIVA AMPLIADA Y LATERALES REDUCIDAS */
  .welcomePromoTrack{
    align-items:center!important;
    gap:12px!important;
    min-height:154px!important;
    padding:10px 1px 23px!important;
    transition:transform .82s cubic-bezier(.2,.78,.22,1)!important;
  }

  .welcomePromoSlide{
    flex-basis:54%!important;
    height:112px!important;
    opacity:.68!important;
    transform:scale(.76)!important;
    filter:saturate(.82) brightness(.92)!important;
    transform-origin:center center!important;
    transition:
      transform .72s cubic-bezier(.2,.8,.22,1),
      opacity .62s ease,
      filter .62s ease!important;
    z-index:1!important;
  }

  .welcomePromoSlide.is-active{
    opacity:1!important;
    transform:scale(1.14)!important;
    filter:saturate(1) brightness(1)!important;
    z-index:4!important;
  }

  .welcomePromoSlide.is-active .welcomePromoCard{
    box-shadow:0 17px 32px rgba(31,22,18,.25)!important;
  }

  .welcomePromoCard{
    border-radius:17px!important;
    transition:box-shadow .62s ease!important;
  }

  .welcomePromoDots{
    bottom:1px!important;
  }
}

/* 5. AJUSTES RESPONSIVOS PARA PANTALLAS BAJAS */
@media (max-width:768px) and (max-height:760px){
  .mobileDeliveryChoices{
    margin-top:2px!important;
    gap:10px!important;
  }
  .mobileDeliveryChoices .deliveryChoice{
    min-height:102px!important;
    padding:12px 15px!important;
  }
  .mobileDeliveryChoices .deliveryChoiceIcon{
    flex-basis:64px!important;
    width:64px!important;
    height:64px!important;
  }
  .mobileDeliveryChoices .deliveryChoiceIcon svg{
    width:43px!important;
    height:43px!important;
  }
  .mobileDeliveryChoices .deliveryChoiceCopy strong{
    font-size:21px!important;
  }
  .mobileDeliveryChoices .deliveryChoiceCopy>span{
    font-size:12px!important;
  }
  .welcomePromoShowcase{
    padding-top:12px!important;
  }
  .welcomePromoTrack{
    min-height:128px!important;
    padding-top:5px!important;
  }
  .welcomePromoSlide{
    height:96px!important;
  }
}

/* =====================================================
   RC28.21 — AJUSTE FINAL DE UBICACIÓN EN PORTADA
   -----------------------------------------------------
   1. Acercar los botones al texto principal
   2. Mantener ambos botones centrados y destacados
   3. Eliminar el espacio vacío debajo de las opciones
   4. Ubicar el carrusel inmediatamente después
   5. Conservar el comportamiento responsivo
===================================================== */
@media (max-width:768px){
  /* 1. ACERCAR LOS BOTONES AL TEXTO PRINCIPAL */
  .mobileWelcomeIntro{
    padding-bottom:10px!important;
  }

  .mobileDeliveryChoices{
    margin:0 auto!important;
    gap:12px!important;
  }

  /* 2. BOTONES CENTRADOS Y DESTACADOS */
  .mobileDeliveryChoices .deliveryChoice{
    min-height:118px!important;
    padding:16px 18px!important;
    border-radius:25px!important;
  }

  /* 3. ELIMINAR EL ESPACIO VACÍO INFERIOR */
  .welcomePromoShowcase{
    margin-top:18px!important;
    padding-top:0!important;
    padding-bottom:0!important;
  }

  /* 4. CARRUSEL INMEDIATAMENTE DEBAJO DE LOS BOTONES */
  .welcomePromoHeading{
    margin-top:0!important;
    margin-bottom:10px!important;
  }

  .welcomePromoCarousel{
    padding-top:0!important;
  }

  .welcomePromoTrack{
    min-height:152px!important;
    padding-top:8px!important;
    padding-bottom:23px!important;
  }

  /* Evita que el bloque principal reparta el espacio sobrante
     entre los botones y el carrusel. */
  .mobileWelcomeContent{
    justify-content:flex-start!important;
  }
}

/* 5. AJUSTES PARA PANTALLAS BAJAS */
@media (max-width:768px) and (max-height:760px){
  .mobileWelcomeIntro{
    padding-bottom:8px!important;
  }
  .mobileDeliveryChoices{
    gap:9px!important;
  }
  .mobileDeliveryChoices .deliveryChoice{
    min-height:100px!important;
    padding:12px 15px!important;
  }
  .welcomePromoShowcase{
    margin-top:13px!important;
  }
  .welcomePromoTrack{
    min-height:126px!important;
    padding-top:4px!important;
  }
}

/* =====================================================
   RC28.22 — BOTONES CENTRALES GRANDES + CARRUSEL AL PIE
   -----------------------------------------------------
   1. Estructura vertical de la portada
   2. Zona central para la elección de entrega
   3. Botones principales más grandes
   4. Carrusel fijado visualmente al pie
   5. Efecto de profundidad al rotar promociones
   6. Ajustes para pantallas de menor altura
===================================================== */
@media (max-width:768px){
  /* 1. ESTRUCTURA VERTICAL DE LA PORTADA */
  .mobileWelcomeShell{
    min-height:100dvh!important;
    height:100dvh!important;
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
    overflow:hidden!important;
  }

  .mobileWelcomeContent{
    min-height:0!important;
    height:100%!important;
    display:grid!important;
    grid-template-rows:auto minmax(276px,1fr) auto!important;
    align-content:stretch!important;
    justify-content:stretch!important;
    padding:0 28px 4px!important;
    overflow:hidden!important;
  }

  .mobileWelcomeIntro{
    align-self:start!important;
    padding-bottom:6px!important;
  }

  /* 2. ZONA CENTRAL PARA LA ELECCIÓN DE ENTREGA */
  .mobileDeliveryChoices{
    align-self:center!important;
    justify-self:center!important;
    width:100%!important;
    max-width:440px!important;
    margin:0 auto!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:16px!important;
    padding:8px 0!important;
  }

  /* 3. BOTONES PRINCIPALES MÁS GRANDES */
  .mobileDeliveryChoices .deliveryChoice{
    width:100%!important;
    min-height:136px!important;
    padding:19px 20px!important;
    border-radius:27px!important;
    box-shadow:0 16px 34px rgba(39,27,23,.17)!important;
  }

  .mobileDeliveryChoices .deliveryChoiceIcon{
    flex:0 0 82px!important;
    width:82px!important;
    height:82px!important;
    border-radius:23px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceIcon svg{
    width:56px!important;
    height:56px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceCopy{
    margin-left:16px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceCopy small{
    font-size:9.5px!important;
    letter-spacing:.12em!important;
  }

  .mobileDeliveryChoices .deliveryChoiceCopy strong{
    font-size:25px!important;
    line-height:1.05!important;
  }

  .mobileDeliveryChoices .deliveryChoiceCopy>span{
    margin-top:7px!important;
    font-size:14.5px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceArrow{
    flex:0 0 48px!important;
    width:48px!important;
    height:48px!important;
    font-size:33px!important;
  }

  /* 4. CARRUSEL VISUALMENTE AL PIE */
  .welcomePromoShowcase{
    align-self:end!important;
    width:calc(100% + 56px)!important;
    margin:0 -28px!important;
    padding:0 0 3px!important;
  }

  .welcomePromoHeading{
    margin:0 28px 8px!important;
  }

  .welcomePromoCarousel{
    width:100%!important;
    padding:0!important;
    overflow:hidden!important;
    background:transparent!important;
    box-shadow:none!important;
    border-radius:0!important;
  }

  /* 5. PROFUNDIDAD Y ESCALA EN LA ROTACIÓN */
  .welcomePromoTrack{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    min-height:158px!important;
    padding:10px 0 25px!important;
    will-change:transform!important;
    transition:transform .86s cubic-bezier(.18,.82,.22,1)!important;
  }

  .welcomePromoSlide{
    position:relative!important;
    inset:auto!important;
    flex:0 0 48%!important;
    height:104px!important;
    opacity:.48!important;
    transform:scale(.66)!important;
    transform-origin:center center!important;
    filter:saturate(.72) brightness(.84)!important;
    transition:
      transform .78s cubic-bezier(.18,.82,.22,1),
      opacity .62s ease,
      filter .62s ease!important;
    z-index:1!important;
  }

  .welcomePromoSlide.is-active{
    opacity:1!important;
    transform:scale(1.22)!important;
    filter:saturate(1.06) brightness(1)!important;
    z-index:5!important;
  }

  .welcomePromoCard{
    width:100%!important;
    height:100%!important;
    border-radius:18px!important;
    overflow:hidden!important;
    transition:box-shadow .65s ease!important;
  }

  .welcomePromoSlide.is-active .welcomePromoCard{
    box-shadow:0 18px 34px rgba(31,22,18,.28)!important;
  }

  .welcomePromoSlide:not(.is-active) .welcomePromoShade strong,
  .welcomePromoSlide:not(.is-active) .welcomePromoShade b{
    opacity:.78!important;
  }

  .welcomePromoDots{
    bottom:2px!important;
  }
}

/* 6. AJUSTES PARA PANTALLAS DE MENOR ALTURA */
@media (max-width:768px) and (max-height:760px){
  .mobileWelcomeContent{
    grid-template-rows:auto minmax(224px,1fr) auto!important;
    padding-left:24px!important;
    padding-right:24px!important;
  }

  .mobileDeliveryChoices{
    gap:11px!important;
    padding:3px 0!important;
  }

  .mobileDeliveryChoices .deliveryChoice{
    min-height:112px!important;
    padding:14px 16px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceIcon{
    flex-basis:68px!important;
    width:68px!important;
    height:68px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceIcon svg{
    width:46px!important;
    height:46px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceCopy strong{
    font-size:22px!important;
  }

  .mobileDeliveryChoices .deliveryChoiceCopy>span{
    font-size:12.5px!important;
  }

  .welcomePromoShowcase{
    width:calc(100% + 48px)!important;
    margin-left:-24px!important;
    margin-right:-24px!important;
  }

  .welcomePromoHeading{
    margin-left:24px!important;
    margin-right:24px!important;
  }

  .welcomePromoTrack{
    min-height:130px!important;
    padding-top:4px!important;
  }

  .welcomePromoSlide{
    height:88px!important;
  }
}


/* =====================================================
   RC28.23 — CATÁLOGO MÓVIL LIMPIO Y FUNCIONAL
   -----------------------------------------------------
   1. Elimina el carrusel/banner grande heredado
   2. Carrusel automático de promociones destacadas
   3. Tarjetas de producto simples, propias y legibles
   4. Método de entrega visible y editable en el carrito
===================================================== */
@media (max-width:768px){
  /* 1. ELIMINAR EL BANNER GRANDE INFERIOR */
  .portadaPrincipal,
  .portadaCarrusel,
  .beneficiosVersionDos{
    display:none!important;
  }

  /* El catálogo empieza inmediatamente después de las promociones destacadas. */
  .seccionPromocionesPrincipal{
    margin-top:4px!important;
    padding-top:0!important;
  }

  /* 2. CARRUSEL AUTOMÁTICO DE PROMOCIONES DESTACADAS */
  .mobileFeaturedSection{
    margin:5px -14px 16px!important;
    padding:0 0 4px!important;
    overflow:hidden!important;
  }

  .mobileSectionHeading{
    margin:7px 17px 12px!important;
  }

  .mobileSectionHeading h2{
    font-size:22px!important;
    letter-spacing:-.025em!important;
  }

  .mobileFeaturedViewport{
    position:relative!important;
    width:100%!important;
    overflow:hidden!important;
    padding:3px 0 21px!important;
  }

  .mobileFeaturedProducts{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    width:max-content!important;
    overflow:visible!important;
    padding:6px 0 12px!important;
    scroll-snap-type:none!important;
    transform:translate3d(0,0,0);
    transition:transform .78s cubic-bezier(.2,.82,.22,1)!important;
    will-change:transform!important;
  }

  .mobileFeatureCard{
    flex:0 0 min(76vw,315px)!important;
    width:min(76vw,315px)!important;
    max-width:none!important;
    min-height:190px!important;
    height:190px!important;
    opacity:.48!important;
    transform:scale(.82)!important;
    filter:saturate(.76) brightness(.88)!important;
    border-radius:22px!important;
    transition:transform .72s cubic-bezier(.2,.82,.22,1),opacity .55s ease,filter .55s ease,box-shadow .55s ease!important;
    box-shadow:0 8px 22px rgba(20,24,32,.14)!important;
    z-index:1!important;
  }

  .mobileFeatureCard.is-active{
    opacity:1!important;
    transform:scale(1)!important;
    filter:none!important;
    box-shadow:0 17px 36px rgba(20,24,32,.23)!important;
    z-index:4!important;
  }

  .mobileFeatureCardContent{
    min-height:190px!important;
    padding:18px!important;
  }

  .mobileFeatureCard h3{
    font-size:21px!important;
    max-width:76%!important;
  }

  .mobileFeaturedDots{
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:2px!important;
    display:flex!important;
    justify-content:center!important;
    gap:6px!important;
  }

  .mobileFeaturedDots span{
    width:6px!important;
    height:6px!important;
    border-radius:999px!important;
    background:#d1d4d9!important;
    transition:width .28s ease,background .28s ease!important;
  }

  .mobileFeaturedDots span.is-active{
    width:18px!important;
    background:var(--pc-red)!important;
  }

  /* 3. TARJETAS DE PRODUCTO SIMPLES Y DISTINTAS */
  #contenedorPromos,
  .grillaProductos,
  .carruselProductos,
  .carruselMovilUniversal{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    overflow:visible!important;
    padding:0 2px 8px!important;
  }

  .categoriaProductos{
    margin-bottom:21px!important;
  }

  .promo{
    min-height:254px!important;
    border:1px solid #e5e7eb!important;
    border-radius:18px!important;
    background:#fff!important;
    box-shadow:0 5px 16px rgba(22,28,38,.065)!important;
    overflow:hidden!important;
  }

  .promo::before{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:0!important;
    height:3px!important;
    background:linear-gradient(90deg,var(--pc-red),#ffba2f)!important;
    z-index:3!important;
  }

  .promo .contenedorImagenProducto{
    height:124px!important;
    min-height:124px!important;
    margin:9px 9px 0!important;
    border:0!important;
    border-radius:14px!important;
    background:#f6f7f8!important;
    overflow:hidden!important;
  }

  .promo img,
  .promoImg{
    height:100%!important;
    border-radius:14px!important;
    object-fit:cover!important;
  }

  .promoInfo{
    min-height:121px!important;
    padding:9px 10px 10px!important;
  }

  .codigoPromo{
    display:none!important;
  }

  .promo h3{
    min-height:34px!important;
    margin:1px 0 5px!important;
    font-size:13.5px!important;
    line-height:1.22!important;
    font-weight:850!important;
  }

  .precioBloque{
    min-height:25px!important;
    margin-bottom:5px!important;
  }

  .precioPromo,
  .promo h2{
    font-size:17px!important;
    color:#0f6590!important;
    font-weight:900!important;
  }

  .mobileQuantityControl{
    min-height:36px!important;
    height:36px!important;
    grid-template-columns:34px minmax(28px,1fr) 34px!important;
    margin-top:3px!important;
    border-radius:11px!important;
    background:#fff!important;
  }

  .mobileQuantityControl button,
  .mobileQuantityValue{
    height:36px!important;
  }

  .mobileQuantityControl button{
    font-size:20px!important;
  }

  /* 4. MÉTODO DE ENTREGA DENTRO DEL CARRITO */
  .cartDeliveryMethod{
    margin:9px 14px 5px!important;
    padding:11px!important;
    border:1px solid #e4e7eb!important;
    border-radius:15px!important;
    background:#f8f9fb!important;
    box-shadow:0 4px 13px rgba(22,28,38,.055)!important;
  }

  .cartDeliveryMethodSummary{
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    margin-bottom:9px!important;
  }

  .cartDeliveryMethodIcon{
    width:36px!important;
    height:36px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:11px!important;
    background:#fff!important;
    font-size:19px!important;
  }

  .cartDeliveryMethodSummary div{
    display:flex!important;
    flex-direction:column!important;
    gap:2px!important;
  }

  .cartDeliveryMethodSummary small{
    color:#8a9098!important;
    font-size:8px!important;
    font-weight:900!important;
    letter-spacing:.1em!important;
  }

  .cartDeliveryMethodSummary strong{
    color:#17191c!important;
    font-size:14px!important;
  }

  .cartDeliveryMethodOptions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }

  .cartDeliveryMethodOptions button{
    min-height:34px!important;
    border:1px solid #dfe3e8!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#535b65!important;
    font-size:11px!important;
    font-weight:800!important;
  }

  .cartDeliveryMethodOptions button.is-active{
    border-color:#ef9ca1!important;
    background:#fff0f1!important;
    color:var(--pc-red)!important;
  }
}


/* =========================================================
   RC28.24 — NAVEGACIÓN PRINCIPAL POR CATEGORÍAS
   1. Se elimina la barra de búsqueda del encabezado móvil.
   2. Los íconos de categorías pasan a ser la herramienta
      principal para recorrer el catálogo.
   3. Se conserva el desplazamiento horizontal fluido.
========================================================= */
@media (max-width: 768px){
  .mobileCatalogHome{padding-top:10px!important}
  .mobileCategoryRail{
    padding:4px 1px 14px!important;
    gap:11px!important;
    scroll-padding-inline:2px;
  }
  .mobileCategoryChip{
    min-height:94px!important;
    min-width:88px!important;
    border-radius:20px!important;
    box-shadow:0 7px 20px rgba(25,32,42,.07)!important;
  }
  .mobileCategoryChip span{font-size:27px!important}
  .mobileCategoryChip.active{
    transform:translateY(-1px)!important;
    box-shadow:0 10px 24px rgba(205,15,25,.13)!important;
  }
}


/* =========================================================
   RC28.25 — CATÁLOGO MÓVIL SIN BÚSQUEDA NI MENÚ SUPERIOR

   1. La barra de búsqueda se elimina de la experiencia móvil.
   2. El botón de tres líneas deja de formar parte del encabezado.
   3. El logo queda centrado independientemente del carrito.
   4. Las categorías ilustradas son la navegación principal.
   5. La barra inferior conserva Inicio, Pedir, Mis pedidos y Cuenta.
========================================================= */
@media (max-width: 768px){
  /* Ocultar cualquier variante actual o heredada del buscador. */
  #buscador,
  #buscarProducto,
  #limpiarBusqueda,
  .mobileSearchBox,
  [aria-label="Buscar productos"]{
    display:none!important;
  }

  /* El menú lateral ya no se usa en el encabezado móvil. */
  .mobileMenuButton,
  #mobileMenuButton{
    display:none!important;
  }

  /* Encabezado simple: logo realmente centrado y carrito a la derecha. */
  .mobileAppTopbar{
    position:sticky!important;
    top:0!important;
    display:grid!important;
    grid-template-columns:1fr auto 1fr!important;
    align-items:center!important;
    min-height:68px!important;
    padding:10px 18px!important;
  }

  .mobileAppTopbar .mobileTopbarLogo{
    grid-column:2!important;
    justify-self:center!important;
    width:92px!important;
    max-height:50px!important;
  }

  .mobileAppTopbar .mobileCartButton{
    grid-column:3!important;
    justify-self:end!important;
  }

  /* Las categorías empiezan inmediatamente debajo del encabezado. */
  .mobileCatalogHome{
    padding-top:8px!important;
  }

  .mobileCategoryRail{
    margin-top:0!important;
  }
}

/* =========================================================
   RC28.26 — TARJETAS DE PRODUCTO SIMPLES CON CONTROL + / −

   1. Tarjetas blancas, limpias y de lectura rápida.
   2. Imagen protagonista sin etiquetas innecesarias.
   3. Nombre y precio como única información principal.
   4. El agregado al carrito se realiza con − / cantidad / +.
   5. Los productos configurables conservan su selector al pulsar +.
========================================================= */
@media (max-width: 768px){
  /* Grilla compacta: dos tarjetas por fila. */
  #contenedorPromos,
  .grillaProductos,
  .carruselProductos,
  .carruselMovilUniversal{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
    padding:2px 3px 14px!important;
    overflow:visible!important;
  }

  /* Tarjeta simple, sin marcos oscuros ni adornos pesados. */
  .promo{
    position:relative!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    border:1px solid #e8eaee!important;
    border-radius:20px!important;
    background:#fff!important;
    box-shadow:0 5px 16px rgba(18,24,32,.055)!important;
    overflow:hidden!important;
  }

  .promo::before,
  .promo::after{
    display:none!important;
    content:none!important;
  }

  /* Foto limpia y proporcionada. */
  .promo .contenedorImagenProducto{
    width:auto!important;
    height:142px!important;
    min-height:142px!important;
    margin:9px 9px 0!important;
    border:0!important;
    border-radius:15px!important;
    background:#f5f6f7!important;
    overflow:hidden!important;
  }

  .promo .promoImg,
  .promo img{
    width:100%!important;
    height:100%!important;
    display:block!important;
    object-fit:cover!important;
    border-radius:15px!important;
  }

  /* Ocultar información secundaria para una lectura rápida. */
  .promo .etiquetasProducto,
  .promo .codigoPromo,
  .promo .descripcionPromo,
  .promo .estadoPromo,
  .promo .botonCarrito{
    display:none!important;
  }

  .promoInfo{
    flex:1!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    padding:11px 11px 12px!important;
  }

  .promo h3{
    min-height:38px!important;
    margin:0 0 7px!important;
    color:#17191d!important;
    font-size:14px!important;
    line-height:1.25!important;
    font-weight:850!important;
    letter-spacing:-.015em!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  .precioBloque{
    min-height:25px!important;
    margin:0 0 9px!important;
  }

  .precioPromo,
  .promo h2{
    margin:0!important;
    color:#0877a8!important;
    font-size:19px!important;
    line-height:1.1!important;
    font-weight:950!important;
    letter-spacing:-.02em!important;
  }

  /* Única acción visible: − / cantidad / + */
  .mobileQuantityControl{
    margin-top:auto!important;
    min-height:40px!important;
    height:40px!important;
    display:grid!important;
    grid-template-columns:40px minmax(30px,1fr) 40px!important;
    align-items:center!important;
    border:1px solid #e2e5e9!important;
    border-radius:13px!important;
    background:#fff!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }

  .mobileQuantityControl button,
  .mobileQuantityValue{
    height:40px!important;
  }

  .mobileQuantityControl button{
    border:0!important;
    background:#fff!important;
    color:#d90b16!important;
    font-size:23px!important;
    font-weight:900!important;
    line-height:1!important;
    transition:transform .12s ease,background .15s ease!important;
  }

  .mobileQuantityControl button:active{
    transform:scale(.88)!important;
    background:#fff1f2!important;
  }

  .mobileQuantityControl button:disabled{
    color:#b7bcc3!important;
    background:#f5f6f7!important;
  }

  .mobileQuantityValue{
    display:grid!important;
    place-items:center!important;
    border-left:1px solid #e7e9ec!important;
    border-right:1px solid #e7e9ec!important;
    background:#fff!important;
    color:#17191d!important;
    font-size:15px!important;
    font-weight:900!important;
    font-variant-numeric:tabular-nums!important;
  }

  .productoNoDisponible{
    opacity:.58!important;
  }
}

@media (max-width: 370px){
  #contenedorPromos,
  .grillaProductos,
  .carruselProductos,
  .carruselMovilUniversal{
    gap:9px!important;
  }

  .promo .contenedorImagenProducto{
    height:126px!important;
    min-height:126px!important;
  }

  .promo h3{
    font-size:13px!important;
  }

  .precioPromo,
  .promo h2{
    font-size:17px!important;
  }
}

/* =========================================================
   RC29.0 — REDISEÑO MÓVIL DEL CATÁLOGO

   OBJETIVO
   - Sustituir por completo la maquetación antigua de tarjetas.
   - Mostrar cada categoría en una sección vertical de ancho completo.
   - Usar tarjetas simples de dos columnas con foto, nombre, precio y − / +.
   - Eliminar flechas, marcos oscuros y títulos desproporcionados.
========================================================= */
@media (max-width: 768px){
  /* 1. ESTRUCTURA GENERAL DEL CATÁLOGO */
  #contenedorPromos{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:10px 16px 110px!important;
    overflow:visible!important;
  }

  #contenedorPromos > .categoriaProductos{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:0 0 30px!important;
    padding:0!important;
    overflow:visible!important;
  }

  /* 2. CABECERAS DE CATEGORÍA */
  #contenedorPromos .cabeceraCategoria{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    min-height:0!important;
    margin:0 0 13px!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
  }

  #contenedorPromos .tituloCategoria{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    width:auto!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    color:#17191d!important;
    font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif!important;
    font-size:24px!important;
    line-height:1.1!important;
    font-weight:900!important;
    letter-spacing:-.035em!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  #contenedorPromos .tituloCategoria::before,
  #contenedorPromos .tituloCategoria::after{
    display:none!important;
    content:none!important;
  }

  #contenedorPromos .controlesCarrusel,
  #contenedorPromos .flechaCarrusel{
    display:none!important;
  }

  /* 3. GRILLAS: DOS TARJETAS POR FILA */
  #contenedorPromos .grillaProductos,
  #contenedorPromos .carruselProductos,
  #contenedorPromos .carruselMovilUniversal{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-auto-flow:row!important;
    grid-auto-columns:auto!important;
    align-items:stretch!important;
    gap:14px 12px!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
    transform:none!important;
  }

  /* 4. TARJETA SIMPLE */
  #contenedorPromos .promo{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:292px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid #e6e8ec!important;
    border-radius:20px!important;
    background:#fff!important;
    color:#17191d!important;
    box-shadow:0 6px 18px rgba(20,27,38,.065)!important;
    overflow:hidden!important;
    scroll-snap-align:none!important;
    transform:none!important;
  }

  #contenedorPromos .promo::before,
  #contenedorPromos .promo::after{
    display:none!important;
    content:none!important;
  }

  /* 5. IMAGEN */
  #contenedorPromos .promo .contenedorImagenProducto{
    position:relative!important;
    display:block!important;
    width:calc(100% - 18px)!important;
    height:148px!important;
    min-height:148px!important;
    margin:9px 9px 0!important;
    padding:0!important;
    border:0!important;
    border-radius:15px!important;
    background:#f2f3f5!important;
    overflow:hidden!important;
  }

  #contenedorPromos .promo .promoImg,
  #contenedorPromos .promo .contenedorImagenProducto > img{
    width:100%!important;
    height:100%!important;
    margin:0!important;
    padding:0!important;
    display:block!important;
    object-fit:cover!important;
    object-position:center!important;
    border:0!important;
    border-radius:15px!important;
    background:#f2f3f5!important;
    filter:none!important;
  }

  /* 6. CONTENIDO */
  #contenedorPromos .promoInfo{
    display:flex!important;
    flex:1!important;
    flex-direction:column!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:11px 11px 12px!important;
    background:#fff!important;
    color:#17191d!important;
  }

  #contenedorPromos .promo .etiquetasProducto,
  #contenedorPromos .promo .codigoPromo,
  #contenedorPromos .promo .descripcionPromo,
  #contenedorPromos .promo .estadoPromo,
  #contenedorPromos .promo .botonCarrito{
    display:none!important;
  }

  #contenedorPromos .promo h3{
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    width:100%!important;
    min-height:39px!important;
    max-height:39px!important;
    margin:0 0 8px!important;
    padding:0!important;
    overflow:hidden!important;
    color:#202328!important;
    font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif!important;
    font-size:14px!important;
    line-height:1.38!important;
    font-weight:800!important;
    letter-spacing:-.015em!important;
    text-align:left!important;
    text-transform:none!important;
    white-space:normal!important;
  }

  #contenedorPromos .precioBloque{
    display:block!important;
    width:100%!important;
    min-height:25px!important;
    margin:0 0 10px!important;
    padding:0!important;
  }

  #contenedorPromos .precioPromo,
  #contenedorPromos .promo h2{
    display:block!important;
    margin:0!important;
    padding:0!important;
    color:#d70c18!important;
    font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif!important;
    font-size:20px!important;
    line-height:1.1!important;
    font-weight:950!important;
    letter-spacing:-.025em!important;
    text-align:left!important;
    white-space:nowrap!important;
  }

  /* 7. CONTROL ÚNICO − / CANTIDAD / + */
  #contenedorPromos .mobileQuantityControl{
    display:grid!important;
    grid-template-columns:42px minmax(28px,1fr) 42px!important;
    align-items:center!important;
    width:100%!important;
    height:42px!important;
    min-height:42px!important;
    margin:auto 0 0!important;
    padding:0!important;
    border:1px solid #dfe2e7!important;
    border-radius:13px!important;
    background:#fff!important;
    box-shadow:none!important;
    overflow:hidden!important;
  }

  #contenedorPromos .mobileQuantityControl button,
  #contenedorPromos .mobileQuantityValue{
    display:grid!important;
    place-items:center!important;
    width:100%!important;
    height:42px!important;
    min-height:42px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif!important;
  }

  #contenedorPromos .mobileQuantityControl button{
    background:#fff!important;
    color:#d70c18!important;
    font-size:24px!important;
    line-height:1!important;
    font-weight:900!important;
    cursor:pointer!important;
  }

  #contenedorPromos .mobileQuantityControl button:active{
    transform:scale(.9)!important;
    background:#fff1f2!important;
  }

  #contenedorPromos .mobileQuantityControl button:disabled{
    color:#b6bbc2!important;
    background:#f5f6f7!important;
  }

  #contenedorPromos .mobileQuantityValue{
    border-left:1px solid #e4e6ea!important;
    border-right:1px solid #e4e6ea!important;
    background:#fff!important;
    color:#17191d!important;
    font-size:15px!important;
    font-weight:900!important;
    font-variant-numeric:tabular-nums!important;
  }

  /* 8. PRODUCTOS NO DISPONIBLES */
  #contenedorPromos .productoNoDisponible{
    opacity:.55!important;
    filter:grayscale(.25)!important;
  }
}

@media (max-width: 370px){
  #contenedorPromos{
    padding-left:12px!important;
    padding-right:12px!important;
  }

  #contenedorPromos .grillaProductos,
  #contenedorPromos .carruselProductos,
  #contenedorPromos .carruselMovilUniversal{
    gap:11px 9px!important;
  }

  #contenedorPromos .promo{
    min-height:270px!important;
  }

  #contenedorPromos .promo .contenedorImagenProducto{
    height:130px!important;
    min-height:130px!important;
  }

  #contenedorPromos .tituloCategoria{
    font-size:22px!important;
  }

  #contenedorPromos .promo h3{
    font-size:13px!important;
  }

  #contenedorPromos .precioPromo,
  #contenedorPromos .promo h2{
    font-size:18px!important;
  }
}


/* =========================================================
   RC29.1 — PULIDO VISUAL DEL CATÁLOGO MÓVIL

   1. Evita el título duplicado de promociones.
   2. Compacta las tarjetas para mostrar más productos.
   3. Mantiene siempre visible el control − / cantidad / +.
   4. Reduce la notificación de agregado al carrito.
========================================================= */
@media (max-width: 768px){
  /* 1. TÍTULO ÚNICO: la categoría ya muestra “Promociones”. */
  .tituloSeccionDestacada{
    display:none!important;
  }

  /* 2. SECCIONES MÁS COMPACTAS */
  #contenedorPromos > .categoriaProductos{
    margin-bottom:24px!important;
  }

  #contenedorPromos .cabeceraCategoria{
    margin-bottom:11px!important;
  }

  #contenedorPromos .tituloCategoria{
    font-size:22px!important;
    line-height:1.08!important;
  }

  /* 3. TARJETAS MÁS BAJAS Y ORDENADAS */
  #contenedorPromos .promo{
    min-height:268px!important;
    border-radius:18px!important;
  }

  #contenedorPromos .promo .contenedorImagenProducto{
    height:132px!important;
    min-height:132px!important;
    margin:8px 8px 0!important;
    width:calc(100% - 16px)!important;
    border-radius:14px!important;
  }

  #contenedorPromos .promo .promoImg,
  #contenedorPromos .promo .contenedorImagenProducto > img{
    border-radius:14px!important;
  }

  #contenedorPromos .promoInfo{
    padding:9px 10px 10px!important;
  }

  #contenedorPromos .promo h3{
    min-height:36px!important;
    max-height:36px!important;
    margin-bottom:6px!important;
    font-size:13.5px!important;
    line-height:1.3!important;
  }

  #contenedorPromos .precioBloque{
    min-height:23px!important;
    margin-bottom:8px!important;
  }

  #contenedorPromos .precioPromo,
  #contenedorPromos .promo h2{
    font-size:19px!important;
  }

  /* 4. CONTROL SIEMPRE DENTRO DE LA TARJETA */
  #contenedorPromos .mobileQuantityControl{
    flex:none!important;
    height:40px!important;
    min-height:40px!important;
    margin-top:auto!important;
    grid-template-columns:40px minmax(26px,1fr) 40px!important;
  }

  #contenedorPromos .mobileQuantityControl button,
  #contenedorPromos .mobileQuantityValue{
    height:40px!important;
    min-height:40px!important;
  }

  /* 5. NOTIFICACIÓN DE CARRITO COMPACTA */
  

  

  

  

  

  

  
}

@media (max-width: 370px){
  #contenedorPromos .promo{
    min-height:250px!important;
  }

  #contenedorPromos .promo .contenedorImagenProducto{
    height:118px!important;
    min-height:118px!important;
  }

  #contenedorPromos .tituloCategoria{
    font-size:21px!important;
  }
}


/* =====================================================
   RC29.3 — EMPANADAS: TRES TARJETAS FIJAS EN CATÁLOGO
   1. Oculta el selector repetido dentro del configurador
   2. Mantiene sabores y salsas como siguiente paso
   ===================================================== */
.grupoModalidadEmpanadasOculto{display:none !important;}
@media (max-width: 768px){
  #categoria3 .promo[data-modalidad-empanadas]{
    border:1px solid rgba(229,29,42,.14);
  }
  #categoria3 .promo[data-modalidad-empanadas] .promoInfo h3{
    min-height:2.4em;
  }
}


/* =========================================================
   RC29.4 — EMPANADAS VISIBLES + TARJETAS UNIFORMES

   1. Todas las tarjetas conservan el mismo alto.
   2. Media docena, docena y unidades aparecen juntas.
   3. La tarjeta no abre detalles; la compra se hace con − / +.
========================================================= */
@media (max-width: 768px){
  /* TARJETAS UNIFORMES EN TODAS LAS CATEGORÍAS */
  #contenedorPromos .promo{
    height:300px!important;
    min-height:300px!important;
    max-height:300px!important;
  }

  #contenedorPromos .promo .contenedorImagenProducto{
    height:145px!important;
    min-height:145px!important;
    max-height:145px!important;
  }

  #contenedorPromos .promoInfo{
    height:146px!important;
    min-height:146px!important;
    max-height:146px!important;
  }

  /* EMPANADAS: LAS TRES MODALIDADES A SIMPLE VISTA */
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .grillaProductos,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .carruselProductos,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .carruselMovilUniversal{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo{
    height:250px!important;
    min-height:250px!important;
    max-height:250px!important;
    border-radius:16px!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo .contenedorImagenProducto{
    width:calc(100% - 12px)!important;
    height:92px!important;
    min-height:92px!important;
    max-height:92px!important;
    margin:6px 6px 0!important;
    border-radius:11px!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo .promoImg{
    border-radius:11px!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promoInfo{
    height:152px!important;
    min-height:152px!important;
    max-height:152px!important;
    padding:8px 7px 8px!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo h3{
    min-height:47px!important;
    max-height:47px!important;
    margin-bottom:6px!important;
    font-size:11px!important;
    line-height:1.35!important;
    -webkit-line-clamp:3!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .precioBloque{
    min-height:20px!important;
    margin-bottom:7px!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .precioPromo,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo h2{
    font-size:15px!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .mobileQuantityControl{
    grid-template-columns:30px minmax(20px,1fr) 30px!important;
    height:34px!important;
    min-height:34px!important;
    border-radius:10px!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .mobileQuantityControl button,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .mobileQuantityValue{
    height:34px!important;
    min-height:34px!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .mobileQuantityControl button{
    font-size:19px!important;
  }

  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .mobileQuantityValue{
    font-size:13px!important;
  }
}

@media (max-width: 360px){
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .grillaProductos,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .carruselProductos,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .carruselMovilUniversal{
    gap:6px!important;
  }
}

/* =========================================================
   RC29.6 — CORRECCIÓN ESTABLE DE TARJETAS MÓVILES

   Objetivo:
   - Recuperar la base estable RC29.4.
   - Eliminar superposiciones sin alturas rígidas insuficientes.
   - Unificar el tamaño visible de todas las fotografías.
   - Mantener nombre, precio y controles siempre dentro de la tarjeta.
   ========================================================= */
@media (max-width: 768px){
  /* 1. Grilla uniforme de dos columnas para todas las categorías. */
  #contenedorPromos .categoriaProductos .grillaProductos,
  #contenedorPromos .categoriaProductos .carruselProductos,
  #contenedorPromos .categoriaProductos .carruselMovilUniversal{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
    align-items:stretch!important;
  }

  /* 2. Las tres modalidades de empanadas usan la misma grilla estable. */
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .grillaProductos,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .carruselProductos,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .carruselMovilUniversal{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
  }

  /* 3. Tarjeta flexible: sin alturas máximas que corten contenido. */
  #contenedorPromos .categoriaProductos .promo,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo{
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:auto!important;
    min-height:390px!important;
    max-height:none!important;
    margin:0!important;
    padding:8px!important;
    overflow:hidden!important;
    border-radius:20px!important;
    background:#fff!important;
    align-self:stretch!important;
  }

  /* 4. Fotografías exactamente iguales en todas las tarjetas. */
  #contenedorPromos .categoriaProductos .promo .contenedorImagenProducto,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo .contenedorImagenProducto{
    box-sizing:border-box!important;
    flex:0 0 auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:1 / 1!important;
    margin:0 0 10px!important;
    overflow:hidden!important;
    border-radius:15px!important;
    background:#f3f3f3!important;
  }

  #contenedorPromos .categoriaProductos .promo .promoImg,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo .promoImg{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
    max-height:100%!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:15px!important;
  }

  /* 5. Cuerpo interno con espacio fijo y controles al pie. */
  #contenedorPromos .categoriaProductos .promo .promoInfo,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo .promoInfo{
    box-sizing:border-box!important;
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:column!important;
    width:100%!important;
    height:auto!important;
    min-height:145px!important;
    max-height:none!important;
    padding:0 4px 2px!important;
    overflow:visible!important;
  }

  /* Elementos viejos que no deben ocupar lugar en la tarjeta móvil. */
  #contenedorPromos .categoriaProductos .codigoPromo,
  #contenedorPromos .categoriaProductos .descripcionPromo,
  #contenedorPromos .categoriaProductos .estadoPromo,
  #contenedorPromos .categoriaProductos .etiquetasProducto,
  #contenedorPromos .categoriaProductos .botonCarrito{
    display:none!important;
  }

  #contenedorPromos .categoriaProductos .promo h3,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo h3{
    display:-webkit-box!important;
    min-height:42px!important;
    max-height:42px!important;
    margin:0 0 8px!important;
    overflow:hidden!important;
    font-size:15px!important;
    line-height:1.35!important;
    font-weight:750!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }

  #contenedorPromos .categoriaProductos .precioBloque,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .precioBloque{
    display:flex!important;
    align-items:center!important;
    min-height:36px!important;
    margin:0 0 10px!important;
  }

  #contenedorPromos .categoriaProductos .precioPromo,
  #contenedorPromos .categoriaProductos .promo h2,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .precioPromo,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo h2{
    margin:0!important;
    font-size:22px!important;
    line-height:1.1!important;
  }

  #contenedorPromos .categoriaProductos .mobileQuantityControl,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .mobileQuantityControl{
    display:grid!important;
    grid-template-columns:44px minmax(36px,1fr) 44px!important;
    width:100%!important;
    height:44px!important;
    min-height:44px!important;
    margin-top:auto!important;
    overflow:hidden!important;
    border:1px solid #e7e7e7!important;
    border-radius:13px!important;
    background:#fff!important;
  }

  #contenedorPromos .categoriaProductos .mobileQuantityControl button,
  #contenedorPromos .categoriaProductos .mobileQuantityValue,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .mobileQuantityControl button,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .mobileQuantityValue{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:44px!important;
    min-height:44px!important;
    padding:0!important;
    font-size:21px!important;
    line-height:1!important;
  }

  #contenedorPromos .categoriaProductos .mobileQuantityValue,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .mobileQuantityValue{
    font-size:16px!important;
    font-weight:800!important;
  }

  /* 6. Separación real entre categorías. */
  #contenedorPromos .categoriaProductos{
    clear:both!important;
    display:block!important;
    margin:0 0 30px!important;
    padding-bottom:0!important;
    overflow:visible!important;
  }

  #contenedorPromos .categoriaProductos + .categoriaProductos{
    margin-top:8px!important;
  }
}

@media (max-width: 370px){
  #contenedorPromos .categoriaProductos .promo,
  #contenedorPromos .categoriaProductos[data-categoria-id="3"] .promo{
    min-height:360px!important;
  }

  #contenedorPromos .categoriaProductos .promo h3{
    font-size:14px!important;
  }

  #contenedorPromos .categoriaProductos .precioPromo,
  #contenedorPromos .categoriaProductos .promo h2{
    font-size:20px!important;
  }
}

/* =========================================================
   RC29.7 — REINICIO ESTRUCTURAL REAL DE TARJETAS MÓVILES
   Corrige reglas heredadas de carrusel que mantenían ancho,
   altura, posición y transformaciones incompatibles.
   ========================================================= */
@media (max-width: 768px){
  /* 1. Cada sección vuelve al flujo normal del documento. */
  body #contenedorPromos .categoriaProductos{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0 0 32px!important;
    padding:0!important;
    overflow:visible!important;
    contain:none!important;
  }

  /* 2. Anula por completo el comportamiento de carrusel en las grillas de productos. */
  body #contenedorPromos .categoriaProductos > .grillaProductos,
  body #contenedorPromos .categoriaProductos > .carruselProductos,
  body #contenedorPromos .categoriaProductos > .carruselMovilUniversal{
    position:relative!important;
    inset:auto!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-auto-flow:row!important;
    grid-auto-rows:auto!important;
    align-items:stretch!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0 10px 8px!important;
    gap:16px 12px!important;
    overflow:visible!important;
    transform:none!important;
    scroll-snap-type:none!important;
    touch-action:pan-y!important;
    contain:none!important;
  }

  /* 3. Tarjeta única, sin posiciones ni transformaciones heredadas. */
  body #contenedorPromos .categoriaProductos > :is(.grillaProductos,.carruselProductos,.carruselMovilUniversal) > article.promo{
    position:relative!important;
    inset:auto!important;
    float:none!important;
    display:grid!important;
    grid-template-rows:auto minmax(150px,1fr)!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:390px!important;
    max-height:none!important;
    margin:0!important;
    padding:9px!important;
    overflow:hidden!important;
    transform:none!important;
    translate:none!important;
    scale:none!important;
    opacity:1!important;
    filter:none!important;
    scroll-snap-align:none!important;
    border:1px solid #eceff2!important;
    border-radius:20px!important;
    background:#fff!important;
    box-shadow:0 8px 22px rgba(20,24,32,.08)!important;
    box-sizing:border-box!important;
  }

  /* 4. Todas las fotos comparten exactamente el mismo cuadro. */
  body #contenedorPromos .categoriaProductos article.promo > .contenedorImagenProducto{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:1 / 1!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    transform:none!important;
    border-radius:15px!important;
    background:#f3f4f6!important;
  }

  body #contenedorPromos .categoriaProductos article.promo > .contenedorImagenProducto > img.promoImg{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-width:100%!important;
    min-height:100%!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:15px!important;
  }

  /* 5. Información en flujo vertical; controles siempre al pie. */
  body #contenedorPromos .categoriaProductos article.promo > .promoInfo{
    position:relative!important;
    inset:auto!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:auto!important;
    min-height:150px!important;
    max-height:none!important;
    margin:0!important;
    padding:10px 3px 0!important;
    overflow:visible!important;
    transform:none!important;
    box-sizing:border-box!important;
  }

  body #contenedorPromos .categoriaProductos article.promo .codigoPromo,
  body #contenedorPromos .categoriaProductos article.promo .descripcionPromo,
  body #contenedorPromos .categoriaProductos article.promo .estadoPromo,
  body #contenedorPromos .categoriaProductos article.promo .etiquetasProducto,
  body #contenedorPromos .categoriaProductos article.promo .botonCarrito{
    display:none!important;
  }

  body #contenedorPromos .categoriaProductos article.promo h3{
    display:-webkit-box!important;
    min-height:40px!important;
    max-height:40px!important;
    margin:0 0 8px!important;
    overflow:hidden!important;
    font-size:15px!important;
    line-height:1.3!important;
    font-weight:800!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }

  body #contenedorPromos .categoriaProductos article.promo .precioBloque{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:34px!important;
    margin:0 0 10px!important;
  }

  body #contenedorPromos .categoriaProductos article.promo :is(.precioPromo,.precioProducto,.precio,h2){
    margin:0!important;
    font-size:22px!important;
    line-height:1.1!important;
    font-weight:900!important;
  }

  body #contenedorPromos .categoriaProductos article.promo .mobileQuantityControl{
    position:relative!important;
    inset:auto!important;
    display:grid!important;
    grid-template-columns:46px minmax(36px,1fr) 46px!important;
    width:100%!important;
    height:46px!important;
    min-height:46px!important;
    max-height:46px!important;
    margin:auto 0 0!important;
    overflow:hidden!important;
    transform:none!important;
    border:1px solid #e3e6e9!important;
    border-radius:13px!important;
    background:#fff!important;
  }

  body #contenedorPromos .categoriaProductos article.promo .mobileQuantityControl > *{
    position:relative!important;
    inset:auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:46px!important;
    min-height:46px!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
  }
}


/* =========================================================
   RC31.1 — SELECTOR SUPERIOR MÁS DISCRETO
   Se reduce únicamente el dibujo; la tarjeta conserva tamaño.
========================================================= */
@media (max-width: 768px){
  .mobileCategoryChip span{
    font-size:21px!important;
  }
}

/* =============================================================
   RC31.16 — PORTADA MÓVIL: CONTACTO DIRECTO POR WHATSAPP
   -------------------------------------------------------------
   1. Acerca levemente las llamadas principales al encabezado.
   2. Incorpora un acceso secundario, profesional y reconocible.
   3. Mantiene el carrusel de promociones al pie de la portada.
============================================================= */
@media (max-width: 768px){
  /* 1. Ajuste vertical de Delivery y Retiro */
  .mobileDeliveryChoices{
    margin-top:-10px!important;
    margin-bottom:0!important;
  }

  /* 2. Contenedor del contacto directo */
  .mobileDirectContact{
    width:100%!important;
    margin:10px 0 6px!important;
    padding:0!important;
  }

  .mobileDirectContactButton{
    position:relative!important;
    display:grid!important;
    grid-template-columns:48px minmax(0,1fr) 34px!important;
    align-items:center!important;
    gap:11px!important;
    width:100%!important;
    min-height:66px!important;
    padding:9px 12px!important;
    overflow:hidden!important;
    color:#fff!important;
    text-decoration:none!important;
    border:1px solid rgba(255,255,255,.32)!important;
    border-radius:19px!important;
    background:linear-gradient(135deg,#20c568 0%,#0aa84f 100%)!important;
    box-shadow:0 11px 24px rgba(8,143,67,.24)!important;
    -webkit-tap-highlight-color:transparent!important;
    transition:transform .18s ease,box-shadow .18s ease!important;
  }

  .mobileDirectContactButton::after{
    content:"";
    position:absolute;
    right:-24px;
    top:-34px;
    width:112px;
    height:112px;
    border-radius:50%;
    background:rgba(255,255,255,.10);
    pointer-events:none;
  }

  .mobileDirectContactButton:active{
    transform:scale(.985)!important;
    box-shadow:0 7px 16px rgba(8,143,67,.20)!important;
  }

  .mobileDirectContactIcon{
    position:relative!important;
    z-index:1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:48px!important;
    height:48px!important;
    border-radius:15px!important;
    background:rgba(255,255,255,.18)!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)!important;
  }

  .mobileDirectContactIcon svg{
    width:31px!important;
    height:31px!important;
    fill:#fff!important;
  }

  .mobileDirectContactCopy{
    position:relative!important;
    z-index:1!important;
    display:flex!important;
    flex-direction:column!important;
    min-width:0!important;
    line-height:1.05!important;
  }

  .mobileDirectContactCopy small{
    margin-bottom:3px!important;
    overflow:hidden!important;
    color:rgba(255,255,255,.78)!important;
    font-size:8px!important;
    font-weight:900!important;
    letter-spacing:.10em!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
  }

  .mobileDirectContactCopy strong{
    color:#fff!important;
    font-size:18px!important;
    font-weight:950!important;
    letter-spacing:-.02em!important;
  }

  .mobileDirectContactCopy > span{
    margin-top:4px!important;
    color:rgba(255,255,255,.88)!important;
    font-size:11.5px!important;
    font-weight:650!important;
  }

  .mobileDirectContactArrow{
    position:relative!important;
    z-index:1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:32px!important;
    height:32px!important;
    color:#fff!important;
    font-size:27px!important;
    line-height:1!important;
    border-radius:50%!important;
    background:rgba(255,255,255,.18)!important;
  }

  /* 3. Separación precisa antes de las promociones */
  .mobileDirectContact + .welcomePromoShowcase{
    margin-top:2px!important;
  }
}

@media (max-width: 380px){
  .mobileDirectContactButton{
    grid-template-columns:44px minmax(0,1fr) 30px!important;
    min-height:61px!important;
    padding:8px 10px!important;
  }
  .mobileDirectContactIcon{
    width:44px!important;
    height:44px!important;
  }
  .mobileDirectContactIcon svg{
    width:28px!important;
    height:28px!important;
  }
  .mobileDirectContactCopy strong{
    font-size:17px!important;
  }
}

/* =============================================================
   RC31.17 — CONTACTO DIRECTO 20% MÁS COMPACTO
============================================================= */
@media (max-width: 768px){
  .mobileDirectContact{
    width:80%!important;
    margin:8px auto 5px!important;
  }
  .mobileDirectContactButton{
    grid-template-columns:40px minmax(0,1fr) 28px!important;
    gap:9px!important;
    min-height:54px!important;
    padding:7px 10px!important;
    border-radius:16px!important;
  }
  .mobileDirectContactIcon{
    width:39px!important;
    height:39px!important;
    border-radius:12px!important;
  }
  .mobileDirectContactIcon svg{width:25px!important;height:25px!important;}
  .mobileDirectContactCopy small{font-size:6.8px!important;margin-bottom:2px!important;}
  .mobileDirectContactCopy strong{font-size:15px!important;}
  .mobileDirectContactCopy > span{font-size:9.5px!important;margin-top:3px!important;}
  .mobileDirectContactArrow{width:26px!important;height:26px!important;font-size:22px!important;}
}


/* =============================================================
   RC31.18 — CARRUSEL CONTINUO DE CATEGORÍAS + ÍCONO WHATSAPP
   -------------------------------------------------------------
   - Las categorías se desplazan lenta y continuamente.
   - El movimiento es lineal, sin saltos y se repite sin fin.
   - Los botones continúan siendo seleccionables.
============================================================= */
@media (max-width: 768px){
  .mobileCategoryRail{
    position:relative!important;
    display:block!important;
    width:100%!important;
    overflow:hidden!important;
    padding:4px 0 16px!important;
    scroll-snap-type:none!important;
    touch-action:pan-y!important;
    -webkit-mask-image:linear-gradient(to right,transparent 0,#000 5%,#000 95%,transparent 100%);
    mask-image:linear-gradient(to right,transparent 0,#000 5%,#000 95%,transparent 100%);
  }

  .mobileCategoryRailTrack{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    width:max-content!important;
    will-change:transform!important;
    animation:pcCategoryMarquee 34s linear infinite!important;
  }

  .mobileCategoryRailGroup{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    flex:0 0 auto!important;
  }

  .mobileCategoryRail .mobileCategoryChip{
    flex:0 0 auto!important;
  }

  @keyframes pcCategoryMarquee{
    from{transform:translate3d(0,0,0)}
    to{transform:translate3d(calc(-50% - 6px),0,0)}
  }

  @media (prefers-reduced-motion: reduce){
    .mobileCategoryRailTrack{animation-duration:70s!important;}
  }

  .mobileDirectContactIcon svg{
    display:block!important;
    width:25px!important;
    height:25px!important;
    fill:#fff!important;
  }
}


/* =============================================================
   RC31.22 — CARRUSEL TÁCTIL + PANTALLA MÓVIL DE UBICACIÓN
   -------------------------------------------------------------
   1. Movimiento automático continuo mediante JavaScript.
   2. Desplazamiento manual horizontal con el dedo.
   3. Nueva sección móvil profesional de ubicación y contacto.
============================================================= */
@media (max-width:768px){
  .mobileCategoryRail{
    display:block!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    touch-action:pan-x!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-inline:contain!important;
    scroll-behavior:auto!important;
    cursor:grab!important;
  }

  .mobileCategoryRail:active{cursor:grabbing!important;}

  .mobileCategoryRailTrack{
    animation:none!important;
    transform:none!important;
    display:flex!important;
    align-items:center!important;
    width:max-content!important;
    gap:12px!important;
  }

  .mobileCategoryRailGroup{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    flex:0 0 auto!important;
  }

  body.mobileLocationOpen{
    overflow-x:hidden!important;
    background:linear-gradient(180deg,#f8f8f9 0%,#eef0f3 100%)!important;
  }

  body.mobileLocationOpen .mobileCatalogHome,
  body.mobileLocationOpen .seccionPromocionesPrincipal,
  body.mobileLocationOpen #catalogo,
  body.mobileLocationOpen #promociones,
  body.mobileLocationOpen .tituloSeccionDestacada{
    display:none!important;
  }

  body.mobileLocationOpen .seccionUbicacion{
    display:block!important;
    max-width:none!important;
    margin:0!important;
    padding:22px 16px 104px!important;
    min-height:calc(100dvh - 68px)!important;
  }

  body.mobileLocationOpen .ubicacionContenedor{
    display:flex!important;
    flex-direction:column!important;
    gap:16px!important;
    border:0!important;
    border-radius:26px!important;
    background:transparent!important;
    box-shadow:none!important;
    overflow:visible!important;
  }

  body.mobileLocationOpen .ubicacionInformacion{
    order:1!important;
    padding:24px 20px!important;
    border-radius:24px!important;
    background:#fff!important;
    box-shadow:0 14px 34px rgba(22,29,39,.10)!important;
  }

  body.mobileLocationOpen .ubicacionEyebrow{
    display:inline-flex!important;
    align-items:center!important;
    gap:6px!important;
    margin-bottom:8px!important;
    padding:7px 11px!important;
    border-radius:999px!important;
    background:#fff0f1!important;
    color:#d90d17!important;
    font-size:11px!important;
    font-weight:900!important;
    letter-spacing:.04em!important;
    text-transform:uppercase!important;
  }

  body.mobileLocationOpen .seccionUbicacion h2{
    margin:0 0 13px!important;
    color:#15171b!important;
    font-size:30px!important;
    line-height:1.05!important;
    letter-spacing:-.035em!important;
  }

  body.mobileLocationOpen .ubicacionDireccion{
    display:flex!important;
    flex-direction:column!important;
    gap:4px!important;
    margin:0 0 18px!important;
    padding:15px 16px!important;
    border-radius:16px!important;
    background:#f5f6f8!important;
    border:1px solid #e7e9ed!important;
    font-style:normal!important;
  }

  body.mobileLocationOpen .ubicacionDireccion strong{
    color:#17191d!important;
    font-size:15px!important;
  }

  body.mobileLocationOpen .ubicacionDireccion span{
    color:#69717d!important;
    font-size:12px!important;
  }

  body.mobileLocationOpen .ubicacionDatos{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    margin:0 0 18px!important;
  }

  body.mobileLocationOpen .ubicacionDato{
    min-height:64px!important;
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    padding:12px 14px!important;
    border-radius:16px!important;
    background:#fff!important;
    border:1px solid #e4e7eb!important;
    color:#17191d!important;
    text-decoration:none!important;
    box-shadow:0 5px 15px rgba(18,24,33,.05)!important;
  }

  body.mobileLocationOpen .ubicacionDatoIcono{
    width:42px!important;
    height:42px!important;
    display:grid!important;
    place-items:center!important;
    flex:0 0 42px!important;
    border-radius:13px!important;
    background:#fff1f1!important;
    font-size:21px!important;
  }

  body.mobileLocationOpen .ubicacionDato small{
    display:block!important;
    margin-bottom:3px!important;
    color:#818894!important;
    font-size:10px!important;
    font-weight:800!important;
    text-transform:uppercase!important;
    letter-spacing:.04em!important;
  }

  body.mobileLocationOpen .ubicacionDato strong{
    display:block!important;
    color:#1a1c20!important;
    font-size:13px!important;
    line-height:1.3!important;
  }

  body.mobileLocationOpen .ubicacionAcciones{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
  }

  body.mobileLocationOpen .botonUbicacion{
    min-height:50px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:12px 10px!important;
    border-radius:14px!important;
    font-size:12px!important;
    font-weight:900!important;
    text-align:center!important;
    text-decoration:none!important;
  }

  body.mobileLocationOpen .botonUbicacionPrimario{
    background:#18b85b!important;
    color:#fff!important;
    box-shadow:0 9px 20px rgba(24,184,91,.22)!important;
  }

  body.mobileLocationOpen .botonUbicacionSecundario{
    background:#16181c!important;
    color:#fff!important;
  }

  body.mobileLocationOpen .ubicacionMapa{
    order:0!important;
    position:relative!important;
    width:100%!important;
    min-height:310px!important;
    border-radius:24px!important;
    overflow:hidden!important;
    background:#e5e7eb!important;
    box-shadow:0 14px 34px rgba(22,29,39,.13)!important;
  }

  body.mobileLocationOpen .ubicacionMapa iframe{
    display:block!important;
    width:100%!important;
    height:310px!important;
    border:0!important;
  }

  body.mobileLocationOpen .ubicacionMapaEnlace{
    position:absolute!important;
    left:14px!important;
    right:14px!important;
    bottom:14px!important;
    min-height:45px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:13px!important;
    background:rgba(255,255,255,.94)!important;
    color:#15171b!important;
    font-size:12px!important;
    font-weight:900!important;
    text-decoration:none!important;
    box-shadow:0 7px 20px rgba(20,24,31,.18)!important;
    backdrop-filter:blur(9px)!important;
  }

  .mobileBottomNav button[data-mobile-nav="location"] span{
    font-size:21px!important;
  }
}

/* =====================================================
   RC31.23 — MAPA MÓVIL VISIBLE Y FUNCIONAL
   Corrige el enlace superpuesto que cubría todo el mapa.
===================================================== */
@media (max-width: 760px){
  body.mobileLocationOpen .ubicacionMapa iframe{
    pointer-events:auto!important;
    filter:none!important;
    background:#e5e7eb!important;
  }

  body.mobileLocationOpen .ubicacionMapaEnlace{
    inset:auto 14px 14px 14px!important;
    top:auto!important;
    width:auto!important;
    height:46px!important;
    min-height:46px!important;
    padding:0 16px!important;
    background:rgba(255,255,255,.96)!important;
    color:#16181c!important;
    border:1px solid rgba(20,24,31,.10)!important;
    border-radius:14px!important;
    box-shadow:0 8px 24px rgba(20,24,31,.20)!important;
    backdrop-filter:blur(10px)!important;
    z-index:3!important;
  }

  body.mobileLocationOpen .ubicacionMapaEnlace span{
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:inherit!important;
    font-size:13px!important;
    font-weight:900!important;
  }
}


/* =========================================================
   RC31.46 — BARRA INFERIOR DEL CARRITO ELIMINADA

   Se quitó el resumen flotante de cantidad y total porque:
   - duplicaba el contador disponible en el encabezado;
   - ocultaba parte de las tarjetas;
   - reducía el área visible de la aplicación.

   El carrito continúa abriéndose desde el botón superior.
========================================================= */


/* =========================================================
   RC31.59 CLIENTE — NAVEGACIÓN INFERIOR REORGANIZADA

   Orden:
   1. Inicio
   2. Ubicación
   3. Cuenta
   4. Carrito

   “Mis pedidos” permanece dentro de Mi cuenta.
========================================================= */

.mobileBottomNav button {
    position: relative;
}

.mobileBottomCartIcon {
    position: relative;
    display: inline-grid;
    place-items: center;
    min-width: 28px;
    min-height: 25px;
}

#mobileBottomCartCount {
    position: absolute;
    top: -7px;
    right: -11px;
    display: grid;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    place-items: center;
    border: 2px solid #fff;
    border-radius: 999px;
    background: var(--pc-red);
    color: #fff;
    font-size: 9px;
    line-height: 1;
    font-weight: 950;
    box-shadow: 0 4px 10px rgba(227, 6, 19, .25);
}

#mobileBottomCartCount:empty,
#mobileBottomCartCount[data-empty="true"] {
    display: none;
}

.mobileBottomNav button[data-mobile-nav="cart"].active {
    color: var(--pc-red);
}

.mobileBottomNav button[data-mobile-nav="account"] span,
.mobileBottomNav button[data-mobile-nav="cart"] span {
    line-height: 1;
}


/* =========================================================
   RC31.60 CLIENTE — PASO 1
   ENCABEZADO SIN CARRITO SUPERIOR DUPLICADO
========================================================= */

@media (max-width: 768px) {
    .mobileAppTopbar {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        grid-template-columns: none !important;
    }

    .mobileAppTopbar .mobileTopbarLogo {
        grid-column: auto !important;
        justify-self: auto !important;
        margin-inline: auto !important;
    }

    .mobileAppTopbar .mobileCartButton {
        display: none !important;
    }
}


/* =========================================================
   RC31.61 CLIENTE — PASO 2
   AVISO DETALLADO EN LA ESQUINA SUPERIOR DERECHA
========================================================= */















@media (max-width: 420px) {
    
}

@media (prefers-reduced-motion: reduce) {
    
}

/* =========================================================
   RC31.83 — UBICACIÓN MÓVIL PROFESIONAL
   La navegación inferior conserva 4 accesos.
   “Mis pedidos” permanece dentro de Mi cuenta.
========================================================= */
@media(max-width:760px){
  .mobileBottomNav button{min-width:0!important;padding-left:2px!important;padding-right:2px!important}
  .mobileBottomNav button small{font-size:10px!important}

  body.mobileLocationOpen .seccionUbicacion{padding:14px 12px 108px!important}
  body.mobileLocationOpen .ubicacionContenedor{gap:14px!important}
  body.mobileLocationOpen .ubicacionMapa{
    min-height:430px!important;
    border-radius:26px!important;
    border:1px solid rgba(20,24,31,.08)!important;
    box-shadow:0 16px 38px rgba(22,29,39,.15)!important;
  }
  body.mobileLocationOpen .ubicacionMapa iframe{height:430px!important;min-height:430px!important}
  body.mobileLocationOpen .ubicacionMapaBadge{
    position:absolute!important;
    z-index:4!important;
    top:14px!important;
    left:14px!important;
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    max-width:calc(100% - 28px)!important;
    padding:9px 12px!important;
    border:1px solid rgba(20,24,31,.08)!important;
    border-radius:15px!important;
    background:rgba(255,255,255,.95)!important;
    color:#17191d!important;
    box-shadow:0 8px 22px rgba(20,24,31,.16)!important;
    backdrop-filter:blur(10px)!important;
  }
  body.mobileLocationOpen .ubicacionMapaBadge>span:first-child{font-size:20px!important}
  body.mobileLocationOpen .ubicacionMapaBadge>span:last-child{display:grid!important;min-width:0!important}
  body.mobileLocationOpen .ubicacionMapaBadge small{color:#d90d17!important;font-size:9px!important;font-weight:950!important;letter-spacing:.08em!important;text-transform:uppercase!important}
  body.mobileLocationOpen .ubicacionMapaBadge strong{overflow:hidden!important;color:#17191d!important;font-size:12px!important;font-weight:900!important;text-overflow:ellipsis!important;white-space:nowrap!important}

  body.mobileLocationOpen .ubicacionInformacion{padding:22px 19px 20px!important;border:1px solid #e7e9ed!important}
  body.mobileLocationOpen .seccionUbicacion h2{margin-bottom:8px!important;font-size:31px!important}
  body.mobileLocationOpen .ubicacionBajada{margin:0 0 18px!important;color:#68717e!important;font-size:13px!important;line-height:1.5!important;font-weight:630!important}
  body.mobileLocationOpen .ubicacionDireccion{display:flex!important;flex-direction:row!important;align-items:flex-start!important;gap:12px!important;padding:14px!important}
  body.mobileLocationOpen .ubicacionDireccionIcono{display:grid!important;place-items:center!important;flex:0 0 42px!important;width:42px!important;height:42px!important;border-radius:13px!important;background:#17191d!important;color:#fff!important;font-size:21px!important}
  body.mobileLocationOpen .ubicacionDireccionTexto{display:grid!important;gap:2px!important;min-width:0!important}
  body.mobileLocationOpen .ubicacionDireccionTexto small{color:#8a9099!important;font-size:9px!important;font-weight:900!important;letter-spacing:.06em!important;text-transform:uppercase!important}
  body.mobileLocationOpen .ubicacionDireccionTexto strong{font-size:14px!important;line-height:1.3!important}
  body.mobileLocationOpen .ubicacionDireccionTexto>span{font-size:11px!important}
  body.mobileLocationOpen .ubicacionDato em{display:block!important;margin-top:2px!important;color:#8a9099!important;font-size:10px!important;font-style:normal!important;font-weight:650!important}
  body.mobileLocationOpen .ubicacionAcciones{gap:9px!important}
  body.mobileLocationOpen .botonUbicacion{gap:6px!important;min-height:54px!important;font-size:11px!important}
}


/* =========================================================
   RC31.112 — ESTADO DEL LOCAL EN APP
========================================================= */
@media (max-width: 768px) {
    .mobileAppTopbar {
        position: relative;
    }

    .mobileStoreStatus {
        position: absolute;
        top: 50%;
        right: 14px;
        transform: translateY(-50%);
        display: inline-flex;
        align-items: center;
        min-height: 24px;
        padding: 0 9px;
        border-radius: 999px;
        font-size: 10px;
        line-height: 1;
        font-weight: 900;
        letter-spacing: .055em;
        box-shadow: 0 2px 8px rgba(0,0,0,.07);
        pointer-events: none;
    }

    .mobileStoreStatus.is-open {
        border: 1px solid #b9e6c6;
        background: #edf9f1;
        color: #16753a;
    }

    .mobileStoreStatus.is-closed {
        border: 1px solid #efc5c8;
        background: #fff2f3;
        color: #b51f2b;
    }

    body.mobileWelcomeOpen .mobileStoreStatus {
        visibility: hidden;
    }
}


/* ==========================================================
   RC31.153 — CARTELERA DINÁMICA / SWIPE / DETALLE
   ========================================================== */
.mobileFeaturedViewport,.welcomePromoCarousel{touch-action:pan-y;user-select:none}
.welcomePromoSlide[role="button"]{cursor:pointer}
.mobileFeatureDots span,.welcomePromoDots span{cursor:pointer}
.promoCampaignDetailModal{position:fixed;inset:0;z-index:99999;display:none;align-items:flex-end;justify-content:center;padding:16px}
.promoCampaignDetailModal.is-open{display:flex}
.promoCampaignDetailBackdrop{position:absolute;inset:0;background:rgba(18,18,22,.58);backdrop-filter:blur(4px)}
.promoCampaignDetailCard{position:relative;width:min(560px,100%);max-height:min(82vh,760px);overflow:auto;background:#fff;border-radius:22px;padding:18px;box-shadow:0 24px 70px rgba(0,0,0,.28);animation:promoCampaignIn .22s ease-out}
.promoCampaignDetailClose{position:absolute;right:12px;top:12px;z-index:2;width:38px;height:38px;border:0;border-radius:50%;font-size:26px;line-height:1;background:rgba(255,255,255,.94);box-shadow:0 2px 14px rgba(0,0,0,.15);cursor:pointer}
.promoCampaignDetailImage{display:block;width:100%;max-height:260px;object-fit:cover;border-radius:16px;margin-bottom:14px}
.promoCampaignDetailBadge{display:inline-flex;padding:5px 9px;border-radius:999px;background:#f4e7e8;color:#a61019;font-size:11px;font-weight:900;letter-spacing:.04em}
.promoCampaignDetailCard h3{margin:10px 0 7px;font-size:23px;line-height:1.12;color:#19191d}
.promoCampaignDetailPeriod{margin:0 0 10px;color:#7a3b3e;font-size:12px;font-weight:700}
.promoCampaignDetailText{white-space:pre-line;margin:0;color:#55545a;line-height:1.55;font-size:14px}
.promoCampaignRelated{margin-top:18px;padding-top:14px;border-top:1px solid #ececef}
.promoCampaignRelated h4{margin:0 0 10px;font-size:14px}
.promoCampaignRelated button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;margin-top:7px;border:1px solid #e5e5e8;border-radius:12px;background:#fafafa;text-align:left;cursor:pointer}
.promoCampaignRelated button span{font-weight:750;color:#28282d}.promoCampaignRelated button strong{color:#b10e18;white-space:nowrap}
@keyframes promoCampaignIn{from{transform:translateY(18px);opacity:.5}to{transform:translateY(0);opacity:1}}


/* =========================================================
   RC31.375 — PRÓXIMA APERTURA BAJO ESTADO CERRADO (APP)
   Sólo informativo; usa el horario central ya sincronizado.
========================================================= */
@media (max-width: 768px) {
    .mobileStoreNextOpen {
        position: absolute;
        top: calc(50% + 18px);
        right: 16px;
        max-width: 150px;
        color: #6f747c;
        font-size: 9px;
        line-height: 1.2;
        font-weight: 650;
        letter-spacing: .01em;
        text-align: right;
        white-space: nowrap;
        pointer-events: none;
    }

    body.mobileWelcomeOpen .mobileStoreNextOpen {
        visibility: hidden;
    }
}