/* Portada estilo marketplace */
body{background:#fff}
.mk-hero-wrap{padding-top:0}
.mk-hero{position:relative;aspect-ratio:5/1;min-height:280px;overflow:hidden;background:#0b0b0b;margin-inline:calc(-1*var(--gutter))}
.mk-slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease;visibility:hidden}
.mk-slide.active{opacity:1;visibility:visible}
.mk-slide img{width:100%;height:100%;object-fit:cover;object-position:65% 30%}
.mk-slide::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgb(5 5 5/.82) 0%,rgb(5 5 5/.55) 32%,rgb(5 5 5/0) 62%)}
.mk-slide-copy{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding-left:calc(var(--gutter) + clamp(40px,6vw,96px))}
.mk-slide-copy h2{margin:0 0 clamp(14px,1.8vw,24px);font:800 clamp(30px,4.6vw,68px)/.98 var(--mk-font);text-transform:uppercase;letter-spacing:.005em;color:#fff;display:grid;text-shadow:0 3px 18px rgb(0 0 0/.35)}
.mk-slide-copy .hl{background:linear-gradient(180deg,#ffd77a,#e9a823);-webkit-background-clip:text;background-clip:text;color:transparent}
.mk-btn-outline{display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:0 22px;border:2px solid var(--gold);border-radius:4px;color:#fff;text-decoration:none;font:600 clamp(14px,1.2vw,18px) var(--font);background:rgb(0 0 0/.25);transition:background .2s}
.mk-btn-outline:hover{background:rgb(242 182 50/.15)}
.mk-btn-outline .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hexes{position:absolute;top:0;height:100%;width:auto;z-index:3;fill:none;stroke:var(--gold);stroke-width:3;pointer-events:none;opacity:.95}
.hexes-l{left:0}.hexes-r{right:0}
.mk-hero-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:44px;height:44px;border-radius:50%;border:0;background:rgb(0 0 0/.45);color:#fff;font-size:26px;line-height:1;display:none}
.mk-hero:hover .mk-hero-nav{display:block}
.mk-hero-nav.prev{left:14px}.mk-hero-nav.next{right:14px}
.mk-dots{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);z-index:4;display:flex;gap:4px;padding:4px 12px;border-radius:999px;background:rgb(0 0 0/.55);border:1px solid rgb(242 182 50/.5)}
.mk-dot{width:26px;height:26px;border:0;padding:0;background:none;position:relative}
.mk-dot::before{content:'';position:absolute;left:50%;top:50%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;background:#8a8a8a}
.mk-dot.active::before{background:var(--gold)}


/* Promos */
.mk-promos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding-bottom:8px}
.mk-promo{position:relative;display:flex;align-items:stretch;min-height:124px;border-radius:8px;overflow:hidden;text-decoration:none;color:#111;transition:transform .2s,box-shadow .2s}
.mk-promo:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgb(0 0 0/.12)}
.mk-promo-copy{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;padding:14px 0 14px 18px;flex:1;min-width:0}
.mk-promo strong{font:800 clamp(15px,1.45vw,21px)/1.05 var(--mk-font);text-transform:uppercase}
.mk-promo span{font:500 clamp(14px,1.3vw,19px)/1.1 var(--mk-font);text-transform:uppercase;margin-top:2px}
.mk-btn-sm{align-self:flex-start;margin-top:12px;font-style:normal;background:var(--gold);color:#111;font-size:12px;font-weight:700;padding:7px 12px;border-radius:4px;white-space:nowrap}
.mk-promo img{width:48%;object-fit:cover;object-position:center}
.mk-promo-dark{background:#000}.mk-promo-dark strong,.mk-promo-dark span{color:var(--gold)}
.mk-promo-light{background:#d7d7d8}.mk-promo-beige{background:#efdecd}.mk-promo-grey{background:#e6e6e8}

/* Productos */
.mk-section{padding-top:var(--space-6)}
.mk-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.mk-head h2{margin:0;font:700 clamp(18px,1.6vw,22px) var(--font)}
.mk-more{background:none;border:0;color:#1b1b1b;font-size:13px;font-weight:600;text-decoration:none;min-height:44px;display:inline-flex;align-items:center;padding:0}
.mk-more:hover{color:#b07c0c}
.mk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:700px){.mk-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1100px){.mk-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.mk-grid .p-card:nth-child(n+7){display:none}}
.p-card .p-cat,.mk-grid .p-stock{display:none}
.mk-grid .p-card{border-radius:8px}
.mk-grid .p-name{font-size:13.5px;font-weight:500;min-height:2.7em}
.mk-grid .p-price{font-size:19px}
.skeleton{border-radius:8px;background:linear-gradient(90deg,#efefef 25%,#f7f7f7 50%,#efefef 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;aspect-ratio:3/4}
@keyframes shimmer{to{background-position:-200% 0}}
.empty-state{grid-column:1/-1;text-align:center;color:var(--muted);padding:var(--space-6);border:1px dashed var(--line);border-radius:8px}

/* Beneficios */
.mk-benefits{margin-top:var(--space-6);border-top:1px solid #eee;border-bottom:1px solid #eee}
.mk-benefits-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;padding-block:18px}
.mk-benefit{display:flex;align-items:center;gap:12px;justify-content:center}
.mk-benefit .ic{width:34px;height:34px;fill:none;stroke:#1b1b1b;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mk-benefit strong{display:block;font-size:13px}.mk-benefit small{color:#6b7079;font-size:12px}
.site-footer{margin-top:0}

/* Listas en el panel */
.results{display:grid;gap:10px}
.item,.cart-product{display:flex;align-items:center;gap:var(--space-4);padding:10px;border:1px solid var(--line);border-radius:var(--radius)}
.item img,.cart-product img{width:84px;height:64px;object-fit:contain;background:#f4f3ef;border-radius:10px;flex:none}
.result-info,.cart-product-info{flex:1;display:grid}
.result-name,.cart-product-name{font-weight:600}
.result-price,.cart-product-price{color:var(--ink-2);font-size:14px}
.cart-summary{display:block;font-size:18px;margin:var(--space-4) 0 4px}
#content .gold{margin-top:10px}

@media(max-width:999px){.mk-promos{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(300px,80%);overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1*var(--gutter));padding-inline:var(--gutter);scroll-snap-type:x mandatory}.mk-promos::-webkit-scrollbar{display:none}.mk-promo{scroll-snap-align:start}
  .mk-benefits-row{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(200px,60%);overflow-x:auto;scrollbar-width:none;justify-content:start}.mk-benefit{justify-content:flex-start}}
@media(max-width:699px){
  .mk-hero{aspect-ratio:4/5;min-height:0;max-height:78svh}
  .mk-slide img{object-position:center}
  .mk-slide::after{background:linear-gradient(180deg,rgb(5 5 5/.15) 30%,rgb(5 5 5/.85) 100%)}
  .mk-slide-copy{justify-content:flex-end;padding:0 var(--gutter) 64px}
  .mk-slide-copy h2{font-size:clamp(34px,11vw,48px)}
  .hexes{height:60%;top:6%;opacity:.7}.hexes-r{display:none}
  .mk-hero-nav{display:none!important}
}
@media(prefers-reduced-motion:reduce){.mk-slide{transition:none}}

/* ===== Banners dentro del margen (observación 2) ===== */
.mk-hero-wrap{padding-top:14px}
.mk-hero{margin-inline:0;border-radius:14px;aspect-ratio:16/5;min-height:240px;max-height:520px;isolation:isolate}
.mk-slide-copy{padding-left:clamp(28px,6vw,96px)}
.mk-slide-link{position:absolute;inset:0;z-index:1}
.hexes{opacity:.6}
.mk-promos{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding-block:4px 8px}
.mk-promo{border-radius:14px;min-height:0;aspect-ratio:2/1}
.mk-promo img{width:50%;height:100%}
.mk-strips{display:grid;gap:14px;margin-top:22px}
.mk-strip{position:relative;display:block;border-radius:14px;overflow:hidden;aspect-ratio:6/1;min-height:120px;color:#fff;text-decoration:none;background:#111}
.mk-strip picture,.mk-strip img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mk-strip::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgb(5 5 5/.85),rgb(5 5 5/.3) 70%)}
.mk-strip-copy{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:center;padding:16px clamp(20px,4vw,56px)}
.mk-strip-copy strong{font:800 clamp(18px,2.2vw,30px)/1.1 var(--mk-font);color:var(--gold)}
.mk-strip-copy span{font-size:clamp(13px,1.2vw,16px);margin-top:4px}
@media(max-width:999px){.mk-promos{display:grid;grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;margin-inline:0;padding-inline:0}.mk-promo{aspect-ratio:auto;min-height:130px}}
@media(max-width:699px){
  .mk-hero-wrap{padding-top:10px}
  .mk-hero{aspect-ratio:1/1;max-height:none;min-height:0;border-radius:12px}
  .mk-slide-copy{padding:0 20px 58px}
  .mk-promo{flex-direction:column;aspect-ratio:1/1;min-height:0}
  .mk-promo-copy{padding:12px 12px 0;flex:none}
  .mk-promo strong{font-size:15px}.mk-promo span{font-size:13px}
  .mk-promo .mk-btn-sm{margin-top:6px;font-size:11px;padding:5px 8px}
  .mk-promo img{width:100%;flex:1;min-height:0;object-fit:cover}
  .mk-strip{aspect-ratio:auto;min-height:130px}
  .mk-strip-copy .mk-btn-sm{margin-top:8px}
}
.hexes-l,.hexes-r{display:none}
@media(min-width:1100px){.hexes-l,.hexes-r{display:block}}

/* fix27: promos sin recorte */
.mk-promo img{object-fit:contain!important;object-position:center;padding:6px;box-sizing:border-box;height:100%}
@media(max-width:699px){.mk-promo img{object-fit:contain!important;padding:4px 8px 8px}}

/* d: botón Ver más productos, beneficios con enlace, promos con panel al ras */
.mk-more-wrap{display:flex;justify-content:center;margin-top:var(--space-5)}
.mk-more-btn{min-height:48px;padding:12px 36px;font-size:15px;font-weight:700}
a.mk-benefit{color:inherit;text-decoration:none;padding:8px 10px;border-radius:12px;transition:background .2s,transform .2s}
a.mk-benefit:hover,a.mk-benefit:focus-visible{background:#f6f1e4;transform:translateY(-1px)}
a.mk-benefit:hover strong{color:#b07c0c;text-decoration:underline}
.mk-promo .mk-promo-media{position:relative;flex:0 0 50%;width:50%;align-self:stretch;overflow:hidden;background:#f5f5f5}
.mk-promo .mk-promo-media img{position:absolute;inset:0;width:100%!important;height:100%!important;padding:0!important;object-fit:contain!important;object-position:center}
@media(max-width:999px){.mk-promo .mk-promo-media{min-height:120px}}
@media(max-width:699px){
  .mk-promo{flex-direction:column}
  .mk-promo .mk-promo-media{order:-1;flex:1 1 auto;width:100%;min-height:0}
  .mk-promo-copy{padding:10px 12px 12px;flex:none}
}

/* e: imagenes de promos llenan todo el panel (sin bordes blancos) */
.mk-promo .mk-promo-media{background:#111}
.mk-promo .mk-promo-media img,.mk-promo img{object-fit:cover!important;object-position:center!important;padding:0!important;width:100%!important;height:100%!important}
.mk-more-btn[hidden],.mk-more[hidden]{display:none!important}
