/* MERAKI WORLD - Home Premium Conversion UX V37
   Parche visual/UX integral:
   - Portada premium mas ordenada.
   - Navegacion rapida tipo app.
   - Menu premium lateral.
   - Secciones de compra rapida.
   - Categorias, ofertas y catalogo mas coherentes.
   - Mobile-first conversion.
   Debe cargar despues de V36.4.
*/

:root{
  --mw37-black:#101828;
  --mw37-black-2:#0b1220;
  --mw37-red:#e11d48;
  --mw37-red-2:#be123c;
  --mw37-red-soft:#fff1f5;
  --mw37-green:#16a34a;
  --mw37-green-2:#22c55e;
  --mw37-muted:#667085;
  --mw37-ink:#111827;
  --mw37-border:#e5e7eb;
  --mw37-card:#ffffff;
  --mw37-shadow:0 18px 46px rgba(16,24,40,.09);
  --mw37-shadow-strong:0 28px 80px rgba(16,24,40,.14);
}

body{
  background:
    radial-gradient(circle at 12% 6%, rgba(255,228,235,.46), transparent 24rem),
    radial-gradient(circle at 92% 12%, rgba(241,245,249,.66), transparent 26rem),
    radial-gradient(circle at 46% 96%, rgba(236,253,245,.32), transparent 28rem),
    #fffafa !important;
}

.mw-home-page-v5{
  max-width:1220px !important;
}

/* ===== HERO PREMIUM ===== */
.mw-home-v5-hero{
  position:relative !important;
  overflow:hidden !important;
  border-radius:34px !important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,248,250,.90) 48%,rgba(245,247,251,.92) 74%,rgba(240,253,250,.82)) !important;
  border:1px solid rgba(255,255,255,.86) !important;
  box-shadow:var(--mw37-shadow-strong) !important;
}

.mw-home-v5-hero:after{
  content:"";
  position:absolute;
  right:-100px;
  top:-90px;
  width:260px;
  height:260px;
  border-radius:999px;
  background:radial-gradient(circle,rgba(225,29,72,.16),rgba(225,29,72,0) 70%);
  pointer-events:none;
}

.mw-home-v5-eyebrow{
  background:#fff !important;
  color:var(--mw37-red-2) !important;
  border:1px solid #ffe4ea !important;
  box-shadow:0 10px 24px rgba(225,29,72,.07) !important;
}

.mw-home-v5-copy h1{
  color:var(--mw37-ink) !important;
  text-wrap:balance !important;
}

.mw-home-v5-copy p{
  color:#5f6b7a !important;
  font-weight:780 !important;
  text-wrap:balance !important;
}

.mw-home-v5-quick-search{
  background:#fff !important;
  border:1px solid rgba(229,231,235,.92) !important;
  box-shadow:0 14px 34px rgba(16,24,40,.08) !important;
}

.mw-home-v5-quick-search i{
  color:var(--mw37-red) !important;
}

.mw-home-v5-quick-search button{
  background:var(--mw37-black) !important;
  background-image:none !important;
  border-color:var(--mw37-black) !important;
  color:#fff !important;
}

.mw-home-v5-actions .mw-home-v5-btn.primary{
  background:var(--mw37-black) !important;
  background-image:none !important;
  border-color:var(--mw37-black) !important;
  color:#fff !important;
}

.mw-home-v5-actions .mw-home-v5-btn.whatsapp{
  background:linear-gradient(135deg,var(--mw37-green-2),var(--mw37-green)) !important;
  color:#fff !important;
}

.mw-home-v5-trust span{
  background:#fff !important;
  border:1px solid #edf0f5 !important;
  color:#4b5563 !important;
  box-shadow:0 8px 20px rgba(16,24,40,.045) !important;
}

/* ===== NAVEGACION PREMIUM RAPIDA ===== */
.mw-v37-premium-nav{
  margin:1rem 0 !important;
  padding:.5rem !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.92) !important;
  border:1px solid rgba(255,255,255,.9) !important;
  box-shadow:var(--mw37-shadow) !important;
  display:flex !important;
  gap:.45rem !important;
  overflow:auto !important;
  scroll-snap-type:x proximity !important;
  position:sticky !important;
  top:8px !important;
  z-index:60 !important;
  backdrop-filter:blur(16px) !important;
}

.mw-v37-premium-nav::-webkit-scrollbar{display:none;}

.mw-v37-premium-nav a,
.mw-v37-premium-nav button{
  appearance:none !important;
  border:1px solid var(--mw37-border) !important;
  background:#fff !important;
  color:#344054 !important;
  min-height:42px !important;
  padding:.58rem .82rem !important;
  border-radius:999px !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:.42rem !important;
  font-weight:950 !important;
  font-size:.84rem !important;
  scroll-snap-align:start !important;
}

.mw-v37-premium-nav a.is-primary{
  background:var(--mw37-black) !important;
  color:#fff !important;
  border-color:var(--mw37-black) !important;
}

.mw-v37-premium-nav a.is-whatsapp{
  background:var(--mw37-green-soft,#ecfdf5) !important;
  color:#15803d !important;
  border-color:#bbf7d0 !important;
}

.mw-v37-premium-nav button{
  background:var(--mw37-red-soft) !important;
  color:var(--mw37-red) !important;
  border-color:#ffe4ea !important;
}

/* ===== ASISTENTE DE COMPRA PREMIUM ===== */
.mw-v37-assistant{
  margin:1rem 0 !important;
  padding:1rem !important;
  border-radius:28px !important;
  background:
    radial-gradient(circle at 94% 0%,rgba(225,29,72,.08),transparent 18rem),
    linear-gradient(135deg,#fff,#fff9fb) !important;
  border:1px solid rgba(255,255,255,.88) !important;
  box-shadow:var(--mw37-shadow) !important;
}

.mw-v37-assistant-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:flex-end !important;
  gap:.8rem !important;
  margin-bottom:.85rem !important;
}

.mw-v37-assistant h2{
  margin:0 !important;
  font-size:clamp(1.18rem,3.8vw,1.55rem) !important;
  line-height:1.05 !important;
  letter-spacing:-.035em !important;
  color:var(--mw37-ink) !important;
}

.mw-v37-assistant p{
  margin:.25rem 0 0 !important;
  color:var(--mw37-muted) !important;
  font-weight:750 !important;
  font-size:.88rem !important;
}

.mw-v37-assistant-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:.65rem !important;
}

.mw-v37-assistant-card{
  min-height:92px !important;
  border-radius:22px !important;
  background:#fff !important;
  border:1px solid #edf0f5 !important;
  padding:.86rem !important;
  text-decoration:none !important;
  color:var(--mw37-ink) !important;
  box-shadow:0 10px 24px rgba(16,24,40,.055) !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}

.mw-v37-assistant-card:hover{
  transform:translateY(-3px) !important;
  border-color:#fecdd3 !important;
  box-shadow:0 16px 32px rgba(16,24,40,.09) !important;
}

.mw-v37-assistant-card i{
  width:36px !important;
  height:36px !important;
  border-radius:14px !important;
  background:var(--mw37-red-soft) !important;
  color:var(--mw37-red) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin-bottom:.58rem !important;
}

.mw-v37-assistant-card strong{
  font-size:.9rem !important;
  line-height:1.15 !important;
}

.mw-v37-assistant-card span{
  color:var(--mw37-muted) !important;
  font-size:.76rem !important;
  font-weight:760 !important;
  margin-top:.18rem !important;
}

/* ===== BENEFICIOS MAS PREMIUM ===== */
.mw-home-v5-strip article{
  background:#fff !important;
  border:1px solid #edf0f5 !important;
  box-shadow:0 12px 30px rgba(16,24,40,.055) !important;
}

.mw-home-v5-strip i,
.mw-home-v5-cat-icon{
  background:linear-gradient(135deg,#991b1b,var(--mw37-red)) !important;
  color:#fff !important;
}

/* ===== CATEGORIAS CON MAS INTENCION COMERCIAL ===== */
.mw-home-v5-categories{
  background:
    radial-gradient(circle at 100% 0%,rgba(225,29,72,.06),transparent 16rem),
    linear-gradient(145deg,#fff,#fff9fb) !important;
  border:1px solid rgba(255,255,255,.9) !important;
  box-shadow:var(--mw37-shadow) !important;
}

.mw-home-v5-cat-card{
  background:#fff !important;
  border:1px solid #edf0f5 !important;
  box-shadow:0 12px 30px rgba(16,24,40,.055) !important;
}

.mw-home-v5-cat-card h3{
  letter-spacing:-.025em !important;
}

/* ===== OFERTAS DESTACADAS PREMIUM ===== */
.mw-home-v5-offers{
  background:
    radial-gradient(circle at 0% 0%,rgba(225,29,72,.06),transparent 16rem),
    linear-gradient(145deg,#fff,#fff9fb) !important;
  border:1px solid rgba(255,255,255,.9) !important;
  box-shadow:var(--mw37-shadow) !important;
}

.mw-home-v5-offer-card{
  border-radius:24px !important;
  background:#fff !important;
  border:1px solid #edf0f5 !important;
  box-shadow:0 12px 30px rgba(16,24,40,.055) !important;
}

.mw-home-v5-offer-card button,
.mw-home-v5-offer-card .btn,
.mw-home-v5-offer-card a[href*="carrito"],
.mw-home-v5-offer-card a[href*="cart"],
.mw-home-v5-offer-card [class*="add"],
.mw-home-v5-offer-card [class*="agregar"],
.mw-home-v5-offer-card [class*="Add"],
.mw-home-v5-offer-card [class*="Agregar"]{
  background:var(--mw37-black) !important;
  color:#fff !important;
}

/* ===== CATALOGO: MANTENER PREMIUM Y CONVERSION ===== */
.mw-catalog-v13{
  border-radius:34px !important;
  background:
    radial-gradient(circle at 96% 0%,rgba(225,29,72,.06),transparent 18rem),
    radial-gradient(circle at 0% 100%,rgba(22,163,74,.055),transparent 18rem),
    linear-gradient(145deg,#fff,#fffafb,#f8fafc) !important;
  border:1px solid rgba(255,255,255,.9) !important;
  box-shadow:var(--mw37-shadow-strong) !important;
}

.mw-catalog-v13-card{
  border-radius:24px !important;
  box-shadow:0 12px 30px rgba(16,24,40,.06) !important;
}

.mw-catalog-v13-add{
  background:var(--mw37-black) !important;
  color:#fff !important;
}

.mw-catalog-v13-detail{
  color:var(--mw37-red) !important;
  border-color:#fecdd3 !important;
  background:#fff !important;
}

/* ===== SECCIONES CLONADAS / RIELES PREMIUM ===== */
.mw-v37-rail{
  margin:1rem 0 !important;
  padding:1rem !important;
  border-radius:28px !important;
  background:#fff !important;
  border:1px solid rgba(255,255,255,.9) !important;
  box-shadow:var(--mw37-shadow) !important;
}

.mw-v37-rail-head{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:.8rem !important;
  margin-bottom:.85rem !important;
}

.mw-v37-rail-head h2{
  margin:0 !important;
  font-size:clamp(1.22rem,4vw,1.75rem) !important;
  line-height:1.05 !important;
  letter-spacing:-.04em !important;
  color:var(--mw37-ink) !important;
}

.mw-v37-rail-head span{
  display:inline-flex !important;
  align-items:center !important;
  gap:.35rem !important;
  padding:.42rem .64rem !important;
  border-radius:999px !important;
  background:var(--mw37-red-soft) !important;
  color:var(--mw37-red) !important;
  font-weight:950 !important;
  font-size:.72rem !important;
  white-space:nowrap !important;
}

.mw-v37-rail-row{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:.75rem !important;
}

.mw-v37-mini-product{
  border:1px solid #edf0f5 !important;
  border-radius:22px !important;
  padding:.65rem !important;
  background:#fff !important;
  text-decoration:none !important;
  color:var(--mw37-ink) !important;
  display:grid !important;
  grid-template-columns:72px 1fr !important;
  gap:.65rem !important;
  align-items:center !important;
  box-shadow:0 10px 24px rgba(16,24,40,.045) !important;
}

.mw-v37-mini-product img{
  width:72px !important;
  height:72px !important;
  object-fit:contain !important;
  border-radius:18px !important;
  background:#fff7f9 !important;
}

.mw-v37-mini-product strong{
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
  font-size:.86rem !important;
  line-height:1.18 !important;
}

.mw-v37-mini-product span{
  display:block !important;
  margin-top:.25rem !important;
  color:var(--mw37-red) !important;
  font-weight:1000 !important;
}

/* ===== DRAWER PREMIUM ===== */
.mw-v37-drawer-backdrop{
  position:fixed !important;
  inset:0 !important;
  z-index:2000 !important;
  background:rgba(15,23,42,.44) !important;
  opacity:0 !important;
  pointer-events:none !important;
  transition:opacity .22s ease !important;
}

.mw-v37-drawer{
  position:fixed !important;
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  z-index:2001 !important;
  width:min(390px,92vw) !important;
  transform:translateX(104%) !important;
  background:#fff !important;
  border-left:1px solid #edf0f5 !important;
  box-shadow:-28px 0 70px rgba(16,24,40,.18) !important;
  transition:transform .25s ease !important;
  padding:1rem !important;
  overflow:auto !important;
}

body.mw-v37-drawer-open{
  overflow:hidden !important;
}

body.mw-v37-drawer-open .mw-v37-drawer-backdrop{
  opacity:1 !important;
  pointer-events:auto !important;
}

body.mw-v37-drawer-open .mw-v37-drawer{
  transform:translateX(0) !important;
}

.mw-v37-drawer-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:flex-start !important;
  gap:1rem !important;
  padding:.5rem .2rem 1rem !important;
}

.mw-v37-drawer-head h2{
  margin:0 !important;
  font-size:1.6rem !important;
  letter-spacing:-.045em !important;
  color:var(--mw37-ink) !important;
}

.mw-v37-drawer-head p{
  margin:.25rem 0 0 !important;
  color:var(--mw37-muted) !important;
  font-weight:760 !important;
}

.mw-v37-drawer-close{
  width:42px !important;
  height:42px !important;
  border-radius:16px !important;
  border:1px solid #edf0f5 !important;
  background:#fff !important;
  color:var(--mw37-black) !important;
  font-weight:1000 !important;
}

.mw-v37-drawer-links{
  display:grid !important;
  gap:.55rem !important;
}

.mw-v37-drawer-links a{
  min-height:50px !important;
  border-radius:18px !important;
  padding:.75rem .85rem !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  text-decoration:none !important;
  background:#f8fafc !important;
  border:1px solid #edf0f5 !important;
  color:var(--mw37-ink) !important;
  font-weight:950 !important;
}

.mw-v37-drawer-links a.is-whatsapp{
  background:#ecfdf5 !important;
  color:#15803d !important;
  border-color:#bbf7d0 !important;
}

.mw-v37-drawer-links a.is-primary{
  background:var(--mw37-black) !important;
  color:#fff !important;
  border-color:var(--mw37-black) !important;
}

/* ===== BARRA MOBILE CONTROLADA ===== */
.mw-v36-mobile-actions{
  box-shadow:0 18px 42px rgba(16,24,40,.18) !important;
}

/* ===== MOBILE ===== */
@media(max-width:780px){
  .mw-v37-assistant-grid,
  .mw-v37-rail-row{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media(max-width:575.98px){
  .mw-home-page-v5{
    padding-inline:.68rem !important;
  }

  .mw-home-v5-hero{
    border-radius:28px !important;
  }

  .mw-home-v5-copy h1{
    font-size:clamp(2.28rem,10.8vw,3.22rem) !important;
  }

  .mw-v37-premium-nav{
    margin:.75rem 0 !important;
    border-radius:20px !important;
    top:6px !important;
  }

  .mw-v37-premium-nav a,
  .mw-v37-premium-nav button{
    min-height:40px !important;
    padding:.52rem .72rem !important;
    font-size:.8rem !important;
  }

  .mw-v37-assistant{
    border-radius:24px !important;
    padding:.85rem !important;
  }

  .mw-v37-assistant-head{
    display:block !important;
  }

  .mw-v37-assistant-grid{
    gap:.55rem !important;
  }

  .mw-v37-assistant-card{
    min-height:96px !important;
    border-radius:19px !important;
    padding:.75rem !important;
  }

  .mw-v37-assistant-card i{
    width:32px !important;
    height:32px !important;
    border-radius:12px !important;
  }

  .mw-v37-assistant-card strong{
    font-size:.83rem !important;
  }

  .mw-v37-assistant-card span{
    font-size:.7rem !important;
  }

  .mw-v37-rail{
    border-radius:24px !important;
    padding:.85rem !important;
  }

  .mw-v37-rail-head{
    display:block !important;
  }

  .mw-v37-rail-head span{
    margin-top:.45rem !important;
  }

  .mw-v37-rail-row{
    display:flex !important;
    overflow:auto !important;
    padding-bottom:.3rem !important;
    scroll-snap-type:x proximity !important;
  }

  .mw-v37-rail-row::-webkit-scrollbar{display:none;}

  .mw-v37-mini-product{
    min-width:245px !important;
    scroll-snap-align:start !important;
  }

  .mw-home-v5-strip{
    gap:.58rem !important;
  }

  .mw-home-v5-strip article{
    min-height:102px !important;
  }

  .mw-home-v5-cat-card{
    min-height:132px !important;
  }

  .mw-catalog-v13{
    border-radius:28px !important;
  }
}

@media(max-width:380px){
  .mw-v37-assistant-grid{
    grid-template-columns:1fr !important;
  }
}