/* =============================================================================
   IKARASPORT — REDISEÑO ficha producto + listado categoría
   Cargado solo en controllers `product` y `category` desde el módulo
   ikarasport_customassets (hookActionFrontControllerSetMedia).
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');

/* Cross-document View Transitions: en navegadores que lo soportan (Chrome 126+,
   Safari 18+) cada navegación same-origin se cross-fadea suavemente en vez del
   flash blanco habitual. En navegadores sin soporte el comportamiento es el
   mismo de siempre (degradación silenciosa). */
@view-transition { navigation: auto; }

/* Tunear la animación por defecto: un fade limpio en 180ms es más "premium"
   que el slide blanco que algunos navegadores hacen. */
::view-transition-old(root),
::view-transition-new(root){
  animation-duration:.18s;
  animation-timing-function:cubic-bezier(.4,0,.2,1);
}

/* === Skeleton shimmer state ===
   .products gets `.is-refreshing` toggled by redesign.js around PrestaShop's
   faceted-search AJAX cycle. Each card gets a sweeping highlight overlay so
   the user has visible feedback that the list is updating, instead of
   "frozen page then sudden swap". */
@keyframes ikara-shimmer{
  0%{background-position:200% 0;}
  100%{background-position:-200% 0;}
}
.products.is-refreshing .product-card{
  position:relative;
  pointer-events:none;
}
.products.is-refreshing .product-card > *{
  opacity:.45;
  transition:opacity .2s;
}
.products.is-refreshing .product-card::after{
  content:"";
  position:absolute;inset:0;
  border-radius:inherit;
  background:linear-gradient(110deg,
    rgba(255,255,255,0) 30%,
    rgba(255,255,255,.55) 50%,
    rgba(255,255,255,0) 70%);
  background-size:200% 100%;
  animation:ikara-shimmer 1.4s ease-in-out infinite;
  pointer-events:none;
  z-index:5;
}

/* =============================================================================
   FICHA DE PRODUCTO
   ========================================================================== */

/* --- Galería ---------------------------------------------------------------- */
/* Wrapper transparente: el theme base dibuja un fondo gris / card que choca con
   el rediseño. */
.product__images,
.js-images-container,
.ikara-gallery-container{
  background:transparent!important;
  box-shadow:none!important;
  border:none!important;
  padding:0!important;
}

/* Mobile: kill the accidental double-tap zoom that fires when the user
   double-clicks a button/image. Pinch zoom remains available. */
html,body{touch-action:manipulation;}
.gallery-stack__shot,
.product-gallery__main,
.variant-color,
.variant-size,
.add-to-cart,
.product__add-to-cart-button,
.btn,
button,
a{touch-action:manipulation;}

/* iOS Safari auto-zooms on focus when input font-size < 16px. Forcing 16px
   only on small screens stops the zoom-in while keeping desktop UI compact.
   Selects need the same. Excludes the search-input badge variants where the
   theme uses smaller text intentionally. */
@media (max-width:768px){
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="password"],
  input[type="number"],
  input[type="search"],
  input[type="url"],
  input[type="date"],
  input[type="datetime-local"],
  input[type="month"],
  input[type="time"],
  input[type="week"],
  select,
  textarea{font-size:16px!important;}
}

/* Defensive horizontal-overflow guard. Some elementor/CE widgets and old
   product carousels overflow the viewport on mobile, which makes the page
   load already zoomed-out. Clip at the document root. Individual containers
   that need horizontal scroll (price slider, etc.) opt in via their own
   `overflow-x:auto` rules below.
   `clip` (not `hidden`) so html/body don't become a scroll container —
   `overflow:hidden` on the root breaks `position:sticky` on descendants
   because the sticky element binds to the body scroll context instead of
   the viewport, and the header stops sticking site-wide. */
html,body{overflow-x:clip;max-width:100vw;}

/* === Galería V1 (Editorial Stack) ===
   Todas las imágenes apiladas verticalmente, sin tira de thumbnails. Cada
   "shot" llena el ancho de la columna y se alterna entre cuadrado / 4:5 /
   3:2 para dar ritmo editorial. Click en cualquiera abre el modal de zoom. */
.product-gallery,
.product-gallery--stack{
  display:flex;flex-direction:column;gap:.85rem;
  background:transparent;
}
.product-gallery__thumbs{display:none;}

.gallery-stack__shot{
  position:relative;width:100%;
  aspect-ratio:1/1;
  border-radius:1.25rem;overflow:hidden;
  background:#fafaf9;
  border:none;padding:0;cursor:zoom-in;
  outline:none!important;box-shadow:none!important;
}
.gallery-stack__shot picture,
.gallery-stack__shot img{width:100%;height:100%;display:block;}
.gallery-stack__shot img{object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1);}
.gallery-stack__shot:hover img{transform:scale(1.02);}
.gallery-stack__shot--portrait{aspect-ratio:4/5;}
.gallery-stack__shot--wide{aspect-ratio:3/2;}

.gallery-stack__flags{
  position:absolute;top:1rem;left:1rem;z-index:2;
  display:flex;flex-direction:column;gap:.4rem;
  pointer-events:none;
}
.gallery-stack__flags .flag{
  font-size:.7rem;font-weight:700;
  padding:.25rem .65rem;border-radius:.3rem;
  color:#fff;background:#0c0a09;
  text-transform:uppercase;letter-spacing:.05em;
}
.gallery-stack__flags .flag.discount,
.gallery-stack__flags .flag.on-sale{background:linear-gradient(135deg,#dc2626,#991b1b);}
.gallery-stack__flags .flag.new{background:#16a34a;}
.gallery-stack__flags .flag.out-of-stock{background:#57534e;}

.gallery-stack__zoom-hint{
  position:absolute;top:1rem;right:1rem;z-index:2;
  display:inline-flex;align-items:center;gap:.3rem;
  background:rgba(255,255,255,.92);backdrop-filter:blur(6px);
  padding:.4rem .7rem;border-radius:999px;
  font-size:.7rem;font-weight:600;color:#0c0a09;
  pointer-events:none;
}
.gallery-stack__zoom-hint .material-icons{font-size:14px;}

@media(max-width:600px){
  .product-gallery,
  .product-gallery--stack{gap:.6rem;}
  .gallery-stack__shot{border-radius:1rem;}
}

/* On mobile the editorial stack becomes a horizontal scroll-snap slider so
   the user doesn't have to scroll past every image to reach the variants and
   buy box below. All shots normalize to 1:1 inside the slider — the editorial
   portrait/wide ratios are a desktop-only flourish. */
@media(max-width:991.98px){
  .ikara-gallery-container{position:relative;}
  .product-gallery--stack{
    flex-direction:row;
    overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;-ms-overflow-style:none;
    margin:0;padding:0;gap:.5rem;
  }
  .product-gallery--stack::-webkit-scrollbar{display:none;}
  .gallery-stack__shot{
    flex:0 0 100%;
    aspect-ratio:1/1;
    scroll-snap-align:center;
    border-radius:1rem;
  }
  .gallery-stack__shot--portrait,
  .gallery-stack__shot--wide{aspect-ratio:1/1;}
  /* Page counter pill — injected by inline JS in product-cover-thumbnails.tpl,
     updated on scroll. Sits over the bottom-center of the slider. */
  .ikara-gallery-counter{
    position:absolute;bottom:.85rem;left:50%;transform:translateX(-50%);
    background:rgba(12,10,9,.78);color:#fff;
    padding:.32rem .8rem;border-radius:999px;
    font-family:'Inter',sans-serif;font-weight:600;font-size:.7rem;
    letter-spacing:.05em;line-height:1;
    backdrop-filter:blur(6px);
    pointer-events:none;z-index:3;
  }
  /* Prev/next chevron arrows so the user sees there are more images. Each
     fades out (.is-hidden) when the slider reaches its boundary. */
  .ikara-gallery-arrow{
    position:absolute;top:50%;transform:translateY(-50%);
    width:40px;height:40px;border-radius:50%;
    background:rgba(255,255,255,.92);color:#0c0a09;
    border:1px solid rgba(12,10,9,.08);
    backdrop-filter:blur(6px);
    box-shadow:0 4px 14px -4px rgba(12,10,9,.25);
    display:inline-flex;align-items:center;justify-content:center;
    padding:0;cursor:pointer;z-index:4;
    transition:opacity .2s,transform .2s,background .15s;
  }
  .ikara-gallery-arrow .material-icons{font-size:22px;}
  .ikara-gallery-arrow--prev{left:.6rem;}
  .ikara-gallery-arrow--next{right:.6rem;}
  .ikara-gallery-arrow:hover{background:#0c0a09;color:#fff;}
  .ikara-gallery-arrow.is-hidden{opacity:0;pointer-events:none;}
  .ikara-gallery-arrow--prev.is-hidden{transform:translate(-.4rem,-50%);}
  .ikara-gallery-arrow--next.is-hidden{transform:translate(.4rem,-50%);}
}
@media(min-width:992px){
  .ikara-gallery-counter,
  .ikara-gallery-arrow{display:none!important;}
}

/* --- Size guide trigger (lives inside the size variant-group label) -------- */
.size-guide-trigger{
  margin-left:auto;
  display:inline-flex;align-items:center;gap:.4rem;
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:#0c0a09;
  background:transparent;border:none;padding:0;cursor:pointer;
  transition:color .15s,gap .2s;
}
.size-guide-trigger .material-icons{font-size:16px;color:#dc2626;}
.size-guide-trigger:hover{color:#dc2626;gap:.55rem;}
.variant-group__label{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem;}

/* --- Size guide modal ------------------------------------------------------- */
.ikara-size-guide-modal{
  position:fixed;inset:0;z-index:1080;
  display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;
  transition:opacity .2s ease,visibility .2s ease;
}
.ikara-size-guide-modal[hidden]{display:none;}
.ikara-size-guide-modal.is-open{opacity:1;visibility:visible;}
.ikara-size-guide-modal__backdrop{
  position:absolute;inset:0;background:rgba(12,10,9,.55);
  backdrop-filter:blur(4px);cursor:pointer;
}
.ikara-size-guide-modal__dialog{
  position:relative;
  width:min(880px, calc(100vw - 2rem));
  max-height:calc(100vh - 4rem);
  overflow:auto;
  /* Hide vertical scrollbar visually while keeping scroll functional */
  scrollbar-width:none;
  -ms-overflow-style:none;
  background:#fff;border-radius:1.25rem;
  padding:2rem 2.25rem 2.25rem;
  box-shadow:0 30px 80px -20px rgba(12,10,9,.4);
  transform:translateY(12px) scale(.98);
  transition:transform .25s ease;
}
.ikara-size-guide-modal__dialog::-webkit-scrollbar{display:none;width:0;height:0;}
.ikara-size-guide-modal.is-open .ikara-size-guide-modal__dialog{
  transform:translateY(0) scale(1);
}
.ikara-size-guide-modal__close{
  position:absolute;top:1rem;right:1rem;
  width:38px;height:38px;border-radius:999px;
  background:#f5f5f4;border:1px solid #e7e5e4;
  display:inline-flex;align-items:center;justify-content:center;
  color:#0c0a09;cursor:pointer;
  transition:background .15s,color .15s;
}
.ikara-size-guide-modal__close:hover{background:#0c0a09;color:#fff;}
.ikara-size-guide-modal__close .material-icons{font-size:20px;}
.ikara-size-guide-modal__header{margin-bottom:1.1rem;padding-right:3rem;}
.ikara-size-guide-modal__eyebrow{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:'Inter',sans-serif;
  font-weight:700;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  color:#dc2626;margin-bottom:.5rem;
}
.ikara-size-guide-modal__eyebrow::before{
  content:"";display:inline-block;width:18px;height:2px;
  background:#dc2626;transform:skewX(-20deg);
}
.ikara-size-guide-modal__title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:1.85rem;letter-spacing:-.02em;line-height:1.1;
  color:#0c0a09;margin:0;
}
.ikara-size-guide-modal__body{
  font-family:'Inter',sans-serif;font-size:.95rem;line-height:1.6;color:#1c1917;
}
.ikara-size-guide-modal__body h1,
.ikara-size-guide-modal__body h2,
.ikara-size-guide-modal__body h3,
.ikara-size-guide-modal__body h4{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;color:#0c0a09;margin:.85rem 0 .5rem;line-height:1.2;
}
.ikara-size-guide-modal__body h1{font-size:1.4rem;display:none;}
.ikara-size-guide-modal__body h2{font-size:1rem;letter-spacing:.04em;text-transform:uppercase;}
.ikara-size-guide-modal__body h3{font-size:.95rem;}
.ikara-size-guide-modal__body p{margin:0 0 .65rem;}
.ikara-size-guide-modal__body p:last-child,
.ikara-size-guide-modal__body table:last-child{margin-bottom:0;}
.ikara-size-guide-modal__body table{
  width:100%;border-collapse:collapse;margin:.5rem 0 .85rem;
  font-size:.82rem;
}
.ikara-size-guide-modal__body table th,
.ikara-size-guide-modal__body table td{
  padding:.45rem .7rem;border-bottom:1px solid #e7e5e4;text-align:left;
}
.ikara-size-guide-modal__body table th{
  background:#0c0a09;color:#fff;font-weight:700;
  font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
}
.ikara-size-guide-modal__body img{max-width:100%;height:auto;border-radius:.5rem;display:block;}
.ikara-size-guide-modal__body a{color:#dc2626;text-decoration:underline;}
.ikara-size-guide-modal__loader{
  display:flex;align-items:center;justify-content:center;gap:.6rem;
  padding:3rem 0;color:#78716c;
  font-family:'Inter',sans-serif;font-size:.9rem;
}
.ikara-size-guide-modal__loader .material-icons{
  animation:ikara-spin 1.4s linear infinite;color:#dc2626;
}
@keyframes ikara-spin{to{transform:rotate(360deg);}}
.ikara-size-guide-modal__error{
  padding:1.25rem;background:#fef2f2;border:1px solid #fecaca;
  border-radius:.65rem;color:#7f1d1d;font-size:.9rem;
}
@media(max-width:600px){
  .ikara-size-guide-modal__dialog{padding:1.5rem 1.25rem 1.75rem;border-radius:1rem;}
  .ikara-size-guide-modal__title{font-size:1.4rem;}
}
.product-gallery__zoom-hint{
  position:absolute;top:1rem;right:1rem;
  background:rgba(255,255,255,.9);backdrop-filter:blur(6px);
  padding:.4rem .7rem;border-radius:999px;
  font-size:.7rem;font-weight:600;color:#0c0a09;
  display:flex;align-items:center;gap:.3rem;
}
.product-gallery__flags{
  position:absolute;top:1rem;left:1rem;
  display:flex;flex-direction:column;gap:.4rem;z-index:2;
}
.product-gallery__flags .flag{
  font-size:.7rem;font-weight:700;
  padding:.25rem .65rem;border-radius:.3rem;
  color:#fff;background:#0c0a09;
  text-transform:uppercase;letter-spacing:.05em;
}
.product-gallery__flags .flag.discount,
.product-gallery__flags .flag.on-sale{background:linear-gradient(135deg,#dc2626,#991b1b);}
.product-gallery__flags .flag.new{background:#16a34a;}
.product-gallery__flags .flag.out-of-stock{background:#57534e;}
@media(max-width:767px){
  .product-gallery__thumb{width:65px;height:78px;}
}

/* --- Info producto ---------------------------------------------------------- */
.product-info{padding-left:.5rem;}
.product-info__brand{
  font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;
  color:#dc2626;font-weight:700;margin-bottom:.7rem;
  display:flex;align-items:center;gap:.5rem;
}
.product-info__brand a{color:inherit;text-decoration:none;}
.product-info__brand a:hover{color:#0c0a09;}
.product-info__brand::before{
  content:"";display:inline-block;width:24px;height:2px;background:#dc2626;
}
.product-info__title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-size:2rem;font-weight:700;
  letter-spacing:-.02em;line-height:1.2;
  margin-bottom:.7rem;
  color:#0c0a09;
}
.product-info__ref{font-size:.78rem;color:#a8a29e;margin-bottom:1.5rem;}

.product-info__price-block.product__prices-block{
  display:block;
  background:none;border:none;
  padding:1.25rem 0;
  margin-bottom:2rem;
  gap:0;
  border-top:1px solid #f5f5f4;
  border-bottom:1px solid #f5f5f4;
}
.product-info__price-block .product-info__price-row{
  display:flex;align-items:baseline;gap:.9rem;flex-wrap:wrap;
}
.product-info__price-block .product-info__price{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-size:2.4rem;font-weight:700;color:#0c0a09;letter-spacing:-.025em;
  line-height:1.05;
}
.product-info__price-block .product-info__old-price{
  font-size:1.05rem;color:#a8a29e;text-decoration:line-through;
  font-weight:500;
}
.product-info__price-block .product-info__discount{
  background:linear-gradient(135deg,#dc2626,#991b1b);
  color:#fff;font-weight:700;font-size:.78rem;
  padding:.3rem .6rem;border-radius:.35rem;
  box-shadow:0 4px 10px rgba(220,38,38,.25);
  letter-spacing:.02em;
}
.product-info__price-block .product-info__tax{
  font-size:.78rem;color:#78716c;margin-top:.65rem;line-height:1.4;
}
.product-info__savings{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.82rem;font-weight:600;color:#15803d;
  background:#f0fdf4;
  border:1px solid #dcfce7;
  padding:.45rem .8rem;border-radius:999px;
  margin-top:.9rem;
}
.product-info__savings::before{
  content:"savings";font-family:'Material Icons';
  font-size:16px;color:#16a34a;
}

/* Indicador stock */
.stock-indicator{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.85rem;color:#16a34a;font-weight:600;
  margin-bottom:1.5rem;
}
.stock-indicator::before{
  content:"";width:8px;height:8px;border-radius:50%;
  background:#16a34a;animation:ikara-pulse 2s infinite;
}
.stock-indicator.is-out{color:#dc2626;}
.stock-indicator.is-out::before{background:#dc2626;animation:none;}
@keyframes ikara-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(22,163,74,.5);}
  50%{box-shadow:0 0 0 6px rgba(22,163,74,0);}
}

/* Descripción corta */
.product-info__description-short{
  background:#fafaf9;
  border-left:3px solid #dc2626;
  padding:1.1rem 1.25rem;
  border-radius:0 .5rem .5rem 0;
  font-size:.9rem;line-height:1.6;
  color:#44403c;
  margin-bottom:1.5rem;
}

/* --- Variantes -------------------------------------------------------------- */
.variant-group{margin-bottom:1.75rem;}
.variant-group__label{
  display:flex;justify-content:space-between;align-items:baseline;
  margin-bottom:.75rem;
}
.variant-group__label .name{
  font-size:.85rem;font-weight:600;color:#0c0a09;
}
.variant-group__label .value{
  font-size:.85rem;color:#78716c;
}
.variant-group__label .value strong{color:#0c0a09;font-weight:600;}
.variant-options{display:flex;flex-wrap:wrap;gap:.7rem;}

/* Color swatches */
.variant-color{
  width:48px;height:48px;border-radius:50%;
  border:3px solid #fff;box-shadow:0 0 0 1px #d6d3d1;
  cursor:pointer;padding:0;position:relative;
  transition:all .15s;
  background-color:#fff;
}
.variant-color:hover{transform:scale(1.05);}
.variant-color.active{box-shadow:0 0 0 2px #0c0a09;}
.variant-color.active::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  border:2px solid rgba(255,255,255,.5);
}
.variant-color[disabled],
.variant-color.is-oos{opacity:.45;cursor:not-allowed;}
.variant-color.is-oos::before{
  content:"";position:absolute;inset:6px;
  background:linear-gradient(to top right, transparent calc(50% - 1px), #dc2626 calc(50% - 1px), #dc2626 calc(50% + 1px), transparent calc(50% + 1px));
  border-radius:50%;
  pointer-events:none;
}

/* Talla buttons */
.variant-size{
  min-width:60px;padding:.7rem 1rem;
  border:2px solid var(--bs-border-color);background:#fff;
  border-radius:.5rem;font-size:.88rem;font-weight:600;color:#0c0a09;
  cursor:pointer;transition:all .15s;
  text-align:center;
}
.variant-size:hover{border-color:#0c0a09;}
.variant-size.active{background:#0c0a09;color:#fff;border-color:#0c0a09;}
.variant-size.disabled,
.variant-size[disabled],
.variant-size.is-oos{
  opacity:.45;cursor:not-allowed;text-decoration:line-through;
  background:#fafaf9;color:#a8a29e;border-color:#e7e5e4;
}
.variant-size.is-oos:hover{border-color:#e7e5e4;}

/* When the FULL selected combination has 0 stock, hide the add-to-cart UI
   on both desktop (.product__actions-qty-add) and mobile (mobile buy bar +
   bottom-sheet CTA). The stock-alert subscribe form already takes its place. */
body.is-combo-oos .product__actions-qty-add,
body.is-combo-oos .product-quantity,
body.is-combo-oos .mobile-buy-bar__cta,
body.is-combo-oos .bsheet__cta{display:none!important;}

/* --- Bootstrap toasts (PrestaShop AJAX cart updates) restyled -------------
   PS uses .toast-container#js-toast-container with cloned templates from
   <template class="js-toast-template">. We override the Bootstrap chrome
   to match our editorial language (rounded panel, color-coded left bar). */
#js-toast-container,
.toast-container.position-fixed.top-0.end-0{
  top:1rem!important;right:1rem!important;
  padding:0!important;
  z-index:1090;
  display:flex;flex-direction:column;gap:.6rem;
}
#js-toast-container .toast,
.toast-container .toast{
  background:#fff!important;color:#0c0a09!important;
  border:1px solid #e7e5e4!important;border-left:3px solid #0c0a09!important;
  border-radius:.7rem!important;
  box-shadow:0 25px 60px -15px rgba(12,10,9,.18)!important;
  min-width:320px;max-width:min(440px, calc(100vw - 2rem));
  font-family:'Inter',sans-serif;font-size:.88rem;line-height:1.45;
  overflow:hidden;
  animation:ikara-toast-in .35s cubic-bezier(.2,.7,.2,1) both;
  --bs-toast-bg:#fff;
  --bs-toast-color:#0c0a09;
  --bs-toast-border-color:#e7e5e4;
}
#js-toast-container .toast .d-flex,
.toast-container .toast .d-flex{align-items:flex-start;gap:.75rem;padding:.95rem 1rem;}
#js-toast-container .toast .toast-body,
.toast-container .toast .toast-body{
  flex:1;padding:0;color:inherit;
  display:flex;align-items:flex-start;gap:.75rem;
}
#js-toast-container .toast .toast-body::before,
.toast-container .toast .toast-body::before{
  content:"info";font-family:'Material Icons','Material Icons Outlined',sans-serif;
  font-size:16px;line-height:1;color:#0c0a09;background:#f5f5f4;
  flex-shrink:0;width:24px;height:24px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-feature-settings:'liga';-webkit-font-feature-settings:'liga';
  text-transform:none;letter-spacing:0;
}
#js-toast-container .toast .btn-close,
.toast-container .toast .btn-close{
  display:inline-flex!important;
  width:24px;height:24px;border-radius:999px;
  background:transparent;border:none;cursor:pointer;
  align-items:center;justify-content:center;
  opacity:.55;transition:opacity .15s,background .15s;
  color:#0c0a09;font-size:0;margin:0!important;flex-shrink:0;
}
#js-toast-container .toast .btn-close::before,
.toast-container .toast .btn-close::before{
  content:"close";font-family:'Material Icons';font-size:18px;
  font-feature-settings:'liga';-webkit-font-feature-settings:'liga';
  text-transform:none;letter-spacing:0;
}
#js-toast-container .toast .btn-close:hover,
.toast-container .toast .btn-close:hover{opacity:1;background:#f5f5f4;}

/* Bootstrap variants — borrar estilos rojos/verdes nativos y aplicar
   nuestros tonos en el border-left + icono. */
#js-toast-container .toast.text-bg-success,
.toast-container .toast.text-bg-success{border-left-color:#16a34a!important;}
#js-toast-container .toast.text-bg-success .toast-body::before,
.toast-container .toast.text-bg-success .toast-body::before{content:"check_circle";color:#16a34a;background:#ecfdf5;}
#js-toast-container .toast.text-bg-danger,
.toast-container .toast.text-bg-danger{border-left-color:#dc2626!important;}
#js-toast-container .toast.text-bg-danger .toast-body::before,
.toast-container .toast.text-bg-danger .toast-body::before{content:"error_outline";color:#dc2626;background:#fef2f2;}
#js-toast-container .toast.text-bg-warning,
.toast-container .toast.text-bg-warning{border-left-color:#d97706!important;}
#js-toast-container .toast.text-bg-warning .toast-body::before,
.toast-container .toast.text-bg-warning .toast-body::before{content:"warning";color:#d97706;background:#fef3c7;}
#js-toast-container .toast.text-bg-info,
.toast-container .toast.text-bg-info{border-left-color:#0c0a09!important;}
#js-toast-container .toast.text-bg-info .toast-body::before,
.toast-container .toast.text-bg-info .toast-body::before{content:"info";color:#0c0a09;background:#f5f5f4;}

@media(max-width:600px){
  #js-toast-container,
  .toast-container.position-fixed.top-0.end-0{
    top:.75rem!important;right:.75rem!important;left:.75rem!important;
  }
  #js-toast-container .toast,
  .toast-container .toast{min-width:0;max-width:none;width:100%;}
}

/* --- Native PrestaShop notifications restyled to match the redesign -------
   PS dumps Bootstrap .alert blocks inside #notifications.container — apply
   the editorial language (rounded panel, eyebrow, color-coded left border)
   and float them as a top-right toast that slides in. */
#notifications{
  position:fixed;top:1rem;right:1rem;left:auto;
  z-index:1090;
  width:auto;max-width:min(440px, calc(100vw - 2rem));
  pointer-events:none;
}
#notifications > .container{
  width:auto;max-width:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:.6rem;
}
#notifications .alert,
.js-cart-update-alert .alert{
  pointer-events:auto;
  display:flex;align-items:flex-start;gap:.75rem;
  padding:.95rem 2.25rem .95rem 1.05rem;
  margin:0 0 .8rem;
  background:#fff;color:#0c0a09;
  border:1px solid #e7e5e4;border-left:3px solid #0c0a09;
  border-radius:.7rem;
  box-shadow:0 25px 60px -15px rgba(12,10,9,.18);
  font-family:'Inter',sans-serif;font-size:.88rem;line-height:1.45;
  position:relative;overflow:hidden;
  animation:ikara-toast-in .35s cubic-bezier(.2,.7,.2,1) both;
}
#notifications .alert::before,
.js-cart-update-alert .alert::before{
  content:"";flex-shrink:0;width:24px;height:24px;border-radius:50%;
  background:#fef2f2 center/16px no-repeat;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:'Material Icons','Material Icons Outlined',sans-serif;
  font-size:16px;line-height:1;
  font-feature-settings:'liga';-webkit-font-feature-settings:'liga';
  text-transform:none;letter-spacing:0;
}
#notifications .alert ul,
.js-cart-update-alert .alert ul{margin:0;padding-left:1.1rem;}
#notifications .alert ul li,
.js-cart-update-alert .alert ul li{margin:0 0 .15rem;}
.js-cart-update-alert .alert .alert-link{
  color:#0c0a09;font-weight:600;text-decoration:underline;text-underline-offset:.18em;
}
.js-cart-update-alert .alert .alert-link:hover{color:#dc2626;}
#notifications .alert .btn-close,
.js-cart-update-alert .alert .btn-close{
  position:absolute;top:.55rem;right:.55rem;
  width:24px;height:24px;padding:0;border-radius:999px;
  background:transparent;border:none;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  opacity:.55;transition:opacity .15s,background .15s;
  color:#0c0a09;font-size:0;
  flex-shrink:0;
}
#notifications .alert .btn-close::before,
.js-cart-update-alert .alert .btn-close::before{
  content:"close";font-family:'Material Icons';font-size:18px;
  font-feature-settings:'liga';-webkit-font-feature-settings:'liga';
  text-transform:none;letter-spacing:0;
}
#notifications .alert .btn-close:hover,
.js-cart-update-alert .alert .btn-close:hover{opacity:1;background:#f5f5f4;}

/* Type-specific colors */
#notifications .alert-success,
.js-cart-update-alert .alert-success{border-left-color:#16a34a;}
#notifications .alert-success::before,
.js-cart-update-alert .alert-success::before{content:"check_circle";color:#16a34a;background:#ecfdf5;}
#notifications .alert-info,
.js-cart-update-alert .alert-info{border-left-color:#0c0a09;}
#notifications .alert-info::before,
.js-cart-update-alert .alert-info::before{content:"info";color:#0c0a09;background:#f5f5f4;}
#notifications .alert-warning,
.js-cart-update-alert .alert-warning{border-left-color:#d97706;}
#notifications .alert-warning::before,
.js-cart-update-alert .alert-warning::before{content:"warning";color:#d97706;background:#fef3c7;}
#notifications .alert-danger,
.js-cart-update-alert .alert-danger{border-left-color:#dc2626;}
#notifications .alert-danger::before,
.js-cart-update-alert .alert-danger::before{content:"error_outline";color:#dc2626;background:#fef2f2;}

@keyframes ikara-toast-in{
  from{transform:translateX(20px);opacity:0;}
  to{transform:translateX(0);opacity:1;}
}

@media(max-width:600px){
  #notifications{top:.75rem;right:.75rem;left:.75rem;max-width:none;}
}

/* --- Cart remove confirmation modal -------------------------------------- */
.ikara-cart-confirm{
  position:fixed;inset:0;z-index:1080;
  display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;
  transition:opacity .2s ease,visibility .2s ease;
}
.ikara-cart-confirm[hidden]{display:none;}
.ikara-cart-confirm.is-open{opacity:1;visibility:visible;}
.ikara-cart-confirm__backdrop{
  position:absolute;inset:0;background:rgba(12,10,9,.55);
  backdrop-filter:blur(4px);cursor:pointer;
}
.ikara-cart-confirm__dialog{
  position:relative;
  width:min(440px, calc(100vw - 2rem));
  background:#fff;border-radius:1rem;
  padding:2rem 1.75rem 1.75rem;
  box-shadow:0 30px 80px -20px rgba(12,10,9,.4);
  text-align:center;
  transform:translateY(12px) scale(.98);
  transition:transform .25s ease;
}
.ikara-cart-confirm.is-open .ikara-cart-confirm__dialog{transform:translateY(0) scale(1);}
.ikara-cart-confirm__icon{
  width:56px;height:56px;border-radius:50%;
  background:#fef2f2;color:#dc2626;
  display:inline-flex;align-items:center;justify-content:center;
  margin:0 auto 1rem;
}
.ikara-cart-confirm__icon .material-icons{font-size:28px;}
.ikara-cart-confirm__title{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:800;
  font-size:1.25rem;letter-spacing:-.015em;
  color:#0c0a09;margin:0 0 .55rem;
}
.ikara-cart-confirm__text{
  font-size:.92rem;color:#44403c;margin:0 0 1.5rem;line-height:1.5;
}
.ikara-cart-confirm__actions{
  display:flex;gap:.55rem;
}
.ikara-cart-confirm__cancel,
.ikara-cart-confirm__confirm{
  flex:1;
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
  font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;
  padding:.85rem 1rem;border-radius:.6rem;
  cursor:pointer;border:none;
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  transition:background .15s,color .15s,border-color .15s;
}
.ikara-cart-confirm__cancel{
  background:transparent;color:#0c0a09;
  border:1px solid #0c0a09;
}
.ikara-cart-confirm__cancel:hover{background:#0c0a09;color:#fff;}
.ikara-cart-confirm__confirm{
  background:#dc2626;color:#fff;
}
.ikara-cart-confirm__confirm:hover{background:#0c0a09;}
.ikara-cart-confirm__confirm .material-icons{font-size:16px;}
@media(max-width:600px){
  .ikara-cart-confirm__dialog{padding:1.5rem 1.25rem;}
  .ikara-cart-confirm__actions{flex-direction:column-reverse;}
}

/* Compact banner over the variants when the current combo can't be bought —
   suggests which attribute (talla / color / categoría) to change to find an
   in-stock combo. Injected by product-variants.tpl. */
.ikara-oos-banner{
  display:none;align-items:flex-start;gap:.7rem;
  margin:0 0 1rem;padding:.75rem .9rem;
  background:#fef2f2;border:1px solid #fecaca;border-left:3px solid #dc2626;
  border-radius:.55rem;
  font-family:'Inter',sans-serif;color:#0c0a09;line-height:1.4;
}
.ikara-oos-banner.is-visible{display:flex;}
.ikara-oos-banner__icon{color:#dc2626;font-size:20px;flex-shrink:0;line-height:1.3;}
.ikara-oos-banner__body{flex:1;min-width:0;}
.ikara-oos-banner__body strong{display:block;font-weight:700;font-size:.82rem;letter-spacing:-.005em;margin-bottom:.15rem;}
.ikara-oos-banner__body p{margin:0;font-size:.78rem;color:#44403c;}


/* --- Cart-added toast (custom.js) ----------------------------------------- */
.ikara-cart-toast{
  position:fixed;bottom:1.5rem;right:1.5rem;z-index:1090;
  display:flex;align-items:center;gap:1rem;
  background:#0c0a09;color:#fff;
  padding:1rem 1.25rem;border-radius:.85rem;
  box-shadow:0 25px 60px -15px rgba(0,0,0,.45);
  min-width:340px;max-width:440px;
  font-family:'Inter',sans-serif;
  transform:translateX(120%);opacity:0;
  transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .25s ease;
  pointer-events:auto;
}
.ikara-cart-toast.is-visible{transform:translateX(0);opacity:1;}
.ikara-cart-toast__icon{
  width:42px;height:42px;border-radius:50%;
  background:#16a34a;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
}
.ikara-cart-toast__icon .material-icons{font-size:24px;}
.ikara-cart-toast__body{flex:1;min-width:0;}
.ikara-cart-toast__title{font-weight:700;font-size:.95rem;letter-spacing:-.005em;line-height:1.2;}
.ikara-cart-toast__sub{font-size:.78rem;color:rgba(255,255,255,.7);margin-top:.2rem;line-height:1.3;}
.ikara-cart-toast__cta{
  font-family:'Inter',sans-serif;font-weight:700;
  font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  background:#dc2626;color:#fff!important;
  padding:.6rem .95rem;border-radius:999px;
  text-decoration:none;flex-shrink:0;
  transition:background .15s,color .15s;
}
.ikara-cart-toast__cta:hover{background:#fff;color:#0c0a09!important;}
.ikara-cart-toast__close{
  background:transparent;border:none;color:rgba(255,255,255,.55);
  cursor:pointer;padding:0;flex-shrink:0;
  width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;
  transition:color .15s;
}
.ikara-cart-toast__close:hover{color:#fff;}
.ikara-cart-toast__close .material-icons{font-size:18px;}
@media(max-width:991.98px){
  /* Slide in from the top on tablet/mobile so the toast doesn't compete with
     the mobile buy bar or the bottom sheet. Smaller chrome to feel less like
     a desktop notification. */
  .ikara-cart-toast{
    top:.7rem;left:.7rem;right:.7rem;bottom:auto;
    min-width:0;max-width:none;width:auto;
    padding:.6rem .75rem;gap:.7rem;
    border-radius:.7rem;
    transform:translateY(-120%);
  }
  .ikara-cart-toast.is-visible{transform:translateY(0);}
  .ikara-cart-toast__icon{width:32px;height:32px;}
  .ikara-cart-toast__icon .material-icons{font-size:18px;}
  .ikara-cart-toast__title{font-size:.82rem;}
  .ikara-cart-toast__sub{font-size:.68rem;margin-top:.1rem;}
  .ikara-cart-toast__cta{padding:.4rem .65rem;font-size:.6rem;letter-spacing:.12em;}
  .ikara-cart-toast__close{width:22px;height:22px;}
  .ikara-cart-toast__close .material-icons{font-size:16px;}
}
@media(max-width:380px){
  /* Hide the subtitle on narrow phones — title + CTA are enough. */
  .ikara-cart-toast__sub{display:none;}
}

/* --- Cantidad + Add to cart ------------------------------------------------- */
.product-actions{
  display:flex;gap:.85rem;margin-bottom:1.5rem;align-items:center;
}
.qty-selector{
  display:flex;align-items:center;
  border:2px solid var(--bs-border-color);
  border-radius:.65rem;
  overflow:hidden;
  background:#fff;
}
.qty-selector button{
  background:none;border:none;
  width:46px;height:54px;
  font-size:1.25rem;color:#0c0a09;
  cursor:pointer;
}
.qty-selector button:hover{background:#f5f5f4;}
.qty-selector input{
  border:none;width:54px;height:54px;
  text-align:center;font-weight:600;font-size:1rem;
  background:transparent;
}
.qty-selector input:focus{outline:none;}
.btn-add-cart{
  flex:1;
  background:#0c0a09;
  color:#fff;
  border:none;
  border-radius:.65rem;
  padding:0 1.5rem;
  font-weight:700;font-size:.95rem;letter-spacing:.02em;
  display:flex;align-items:center;justify-content:center;gap:.5rem;
  cursor:pointer;
  transition:background .2s;
  height:54px;
}
.btn-add-cart:hover{background:#1c1917;}
.btn-add-cart .material-icons{font-size:20px;}
.btn-add-cart[disabled]{opacity:.6;cursor:not-allowed;}
.btn-add-cart[disabled]:hover{background:#0c0a09;}

.product-secondary-actions{display:flex;gap:.65rem;margin-bottom:2rem;}
.btn-secondary-action{
  flex:1;background:#fff;border:1px solid var(--bs-border-color);
  border-radius:.55rem;padding:.75rem .5rem;
  font-size:.82rem;font-weight:500;color:#44403c;
  display:flex;align-items:center;justify-content:center;gap:.45rem;
  cursor:pointer;transition:all .15s;
  text-decoration:none;
}
.btn-secondary-action:hover{border-color:#0c0a09;color:#0c0a09;}
.btn-secondary-action .material-icons{font-size:18px;}

/* --- Trust badges ----------------------------------------------------------- */
.trust-badges{
  display:grid;grid-template-columns:repeat(2,1fr);gap:.85rem;
  margin-bottom:2rem;
}
.trust-badge{
  display:flex;align-items:center;gap:.75rem;
  background:#fff;border:1px solid var(--bs-border-color);
  border-radius:.6rem;padding:.95rem 1.05rem;
  font-size:.8rem;
}
.trust-badge .icon{
  width:38px;height:38px;border-radius:50%;
  background:#fef2f2;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.trust-badge .icon .material-icons{font-size:19px;color:#dc2626;}
.trust-badge .text strong{display:block;color:#0c0a09;font-weight:600;line-height:1.3;}
.trust-badge .text span{color:#78716c;font-size:.72rem;}

/* --- Tabs (premium) --------------------------------------------------------- */
.product-tabs{
  margin-top:4.5rem;
  background:#fff;
  border-radius:1rem;
  border:1px solid var(--bs-border-color);
  overflow:hidden;
  box-shadow:0 1px 3px rgba(0,0,0,.02);
}
.product-tabs__nav{
  display:flex;
  background:linear-gradient(135deg,#0c0a09 0%,#1c1917 50%,#292524 100%);
  position:relative;
  border-bottom:1px solid #0c0a09;
}
.product-tabs__nav::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent 0%,#dc2626 30%,#dc2626 70%,transparent 100%);
  opacity:.85;
}
.product-tabs__nav::after{
  content:"";position:absolute;top:0;left:0;right:0;height:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.04) 0%,transparent 100%);
  pointer-events:none;
}
.product-tabs__nav button{
  flex:1;background:none;border:none;
  padding:1.35rem 1rem;
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:600;font-size:.93rem;letter-spacing:.01em;
  color:#fff;
  cursor:pointer;
  transition:background .25s;
  position:relative;z-index:1;
}
.product-tabs__nav button.active{background:rgba(255,255,255,.05);}
.product-tabs__nav button.active::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background:linear-gradient(90deg,#dc2626 0%,#991b1b 100%);
  box-shadow:0 0 12px rgba(220,38,38,.5);
}
.product-tabs__nav button:hover{background:rgba(255,255,255,.04);}
.product-tabs__nav button + button{border-left:1px solid rgba(255,255,255,.06);}

.product-tabs__content{font-size:.92rem;line-height:1.7;color:#44403c;}
.product-tabs__pane{display:none;padding:2.25rem;}
.product-tabs__pane.active{display:block;animation:ikara-fadeIn .25s ease;}

.product-tabs__acc-header{display:none;}

@media (max-width:991.98px){
  .product-tabs__nav{display:none;}
  /* Mobile accordion mirrors the desktop tab bar visual (dark gradient + white
     text + red active accent) so the section headers feel like the same
     component, just stacked vertically. */
  .product-tabs__acc-header{
    display:flex;width:100%;align-items:center;justify-content:space-between;
    background:linear-gradient(135deg,#0c0a09 0%,#1c1917 50%,#292524 100%);
    border:none;
    padding:1.15rem 1.25rem;
    font-family:'Space Grotesk','Inter',sans-serif;
    font-weight:600;font-size:.95rem;letter-spacing:.01em;color:#fff;
    cursor:pointer;text-align:left;position:relative;
    border-top:1px solid rgba(255,255,255,.08);
    transition:background .15s,color .15s;
  }
  .product-tabs__acc-header:first-child{border-top:none;}
  .product-tabs__acc-header:hover,
  .product-tabs__acc-header:focus-visible{
    background:linear-gradient(135deg,#1c1917 0%,#292524 50%,#3a3633 100%);
    outline:none;
  }
  .product-tabs__acc-header .material-icons{
    color:rgba(255,255,255,.7);font-size:26px;
    transition:transform .3s cubic-bezier(.4,0,.2,1),color .2s;
  }
  .product-tabs__acc-header.active::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
    background:linear-gradient(90deg,#dc2626 0%,#991b1b 100%);
    box-shadow:0 0 12px rgba(220,38,38,.45);
  }
  .product-tabs__acc-header.active .material-icons{
    transform:rotate(180deg);color:#dc2626;
  }
  /* Breathe under the red accent of the active header — .25rem was butting
     the first line against the underline. */
  .product-tabs__pane{padding:1.25rem 1.25rem 1.5rem;}
  .product-tabs__pane.active + .product-tabs__acc-header{border-top:1px solid rgba(255,255,255,.08);}
}
@keyframes ikara-fadeIn{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:translateY(0);}}

.product-tabs__content p{margin-bottom:1.1rem;}
.product-tabs__content h4{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:1.1rem;
  margin-bottom:1rem;color:#0c0a09;
  display:flex;align-items:center;gap:.5rem;
}
.product-tabs__content h4::before{
  content:"";display:inline-block;width:3px;height:1.1rem;
  background:#dc2626;border-radius:2px;
}

/* Lead destacado */
.tab-lead{
  font-size:1.05rem;line-height:1.65;color:#1c1917;
  font-weight:500;
  padding:1.1rem 1.4rem;
  background:linear-gradient(135deg,#fef2f2 0%,#fafaf9 100%);
  border-left:3px solid #dc2626;
  border-radius:0 .55rem .55rem 0;
  margin-bottom:1.75rem;
}

/* Feature grid (descripción enriquecida) */
.feat-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:1rem;margin:1.5rem 0 1.75rem;
}
.feat-card{
  display:flex;flex-direction:column;align-items:flex-start;gap:.55rem;
  background:#fafaf9;border:1px solid #f5f5f4;
  border-radius:.7rem;padding:1.1rem 1.2rem;
  transition:transform .2s,border-color .2s,box-shadow .2s;
}
.feat-card:hover{
  transform:translateY(-2px);
  border-color:#fde8e8;
  box-shadow:0 8px 22px -10px rgba(220,38,38,.18);
}
.feat-card__icon{
  width:42px;height:42px;border-radius:50%;
  background:linear-gradient(135deg,#fee2e2,#fef2f2);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.feat-card__icon .material-icons{font-size:20px;color:#dc2626;}
.feat-card__title{font-weight:700;font-size:.92rem;color:#0c0a09;line-height:1.25;}
.feat-card__desc{font-size:.83rem;color:#78716c;line-height:1.5;}

/* Specs table */
.spec-table{
  width:100%;font-size:.92rem;
  background:#fff;border:1px solid #f5f5f4;border-radius:.7rem;
  overflow:hidden;
  border-collapse:separate;border-spacing:0;
}
.spec-table tr{transition:background .15s;}
.spec-table tr:hover{background:#fafaf9;}
.spec-table tr:nth-child(even){background:#fcfcfc;}
.spec-table tr:nth-child(even):hover{background:#fafaf9;}
.spec-table td{padding:1rem 1.25rem;border-bottom:1px solid #f5f5f4;vertical-align:middle;}
.spec-table td:first-child{
  color:#78716c;font-weight:500;width:38%;
}
.spec-table td:last-child{color:#0c0a09;font-weight:600;}
.spec-table tr:last-child td{border-bottom:none;}

.spec-chip{
  display:inline-block;
  background:#f5f5f4;color:#0c0a09;
  font-size:.78rem;font-weight:600;
  padding:.2rem .55rem;border-radius:.3rem;
  margin-right:.3rem;
}

/* Guía de tallas */
.size-guide{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:.75rem;margin:1.25rem 0;
}
.size-guide__card{
  text-align:center;padding:1.1rem .85rem;
  background:#fff;border:1.5px solid #f5f5f4;border-radius:.7rem;
  transition:all .2s;
}
.size-guide__card:hover{border-color:#dc2626;transform:translateY(-2px);}
.size-guide__weight{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:1.4rem;color:#0c0a09;letter-spacing:-.02em;
  margin-bottom:.4rem;
}
.size-guide__use{font-size:.78rem;color:#78716c;line-height:1.45;}
.size-guide__user{
  font-size:.7rem;color:#dc2626;font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;
  margin-top:.5rem;display:block;
}

/* Bloques envío */
.shipping-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:1rem;margin:1.25rem 0;
}
.shipping-card{
  display:flex;gap:.85rem;align-items:flex-start;
  padding:1.2rem;border:1px solid #f5f5f4;border-radius:.7rem;
  background:#fff;
  transition:border-color .2s,transform .2s;
}
.shipping-card:hover{border-color:#fde8e8;transform:translateY(-2px);}
.shipping-card__icon{
  width:46px;height:46px;border-radius:.55rem;
  background:linear-gradient(135deg,#fee2e2,#fef2f2);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.shipping-card__icon .material-icons{font-size:24px;color:#dc2626;}
.shipping-card__body strong{
  display:block;color:#0c0a09;font-weight:700;font-size:.95rem;
  margin-bottom:.2rem;
}
.shipping-card__body p{
  margin:0;font-size:.83rem;color:#78716c;line-height:1.5;
}

/* --- Productos relacionados ------------------------------------------------- */
.related-section{margin-top:4.5rem;}
.related-section__title{
  display:flex;justify-content:space-between;align-items:end;
  margin-bottom:1.75rem;
}
.related-section__title h2{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:1.5rem;letter-spacing:-.02em;margin:0;
  display:flex;align-items:center;gap:.6rem;
}
.related-section__title h2::after{
  content:"";display:inline-block;width:4px;height:1.3rem;background:#dc2626;
}
.related-section .see-all{
  font-size:.85rem;color:#78716c;text-decoration:none;font-weight:500;
  display:inline-flex;align-items:center;gap:.3rem;
}
.related-section .see-all:hover{color:#dc2626;}

.mini-card{
  display:block;background:#fff;border-radius:.6rem;overflow:hidden;
  border:1px solid var(--bs-border-color);
  transition:transform .2s, box-shadow .2s;
  text-decoration:none;color:inherit;
}
/* No hover effects on the mini card — same reason as .product-card. */
.mini-card__img{aspect-ratio:5/6;overflow:hidden;background:#f5f5f4;}
.mini-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.mini-card__body{padding:.95rem 1rem 1.1rem;}
.mini-card__brand{font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:#dc2626;font-weight:700;margin-bottom:.2rem;}
.mini-card__title{font-family:'Space Grotesk','Inter',sans-serif;font-weight:600;font-size:.85rem;line-height:1.25;margin-bottom:.3rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#0c0a09;}
.mini-card__price{font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;font-size:.95rem;color:#0c0a09;}

/* --- Desktop overrides (≥992px) -------------------------------------------- */
@media (min-width:992px){
  .product-page-wrap{padding-top:2rem!important;padding-bottom:5rem!important;}
  .product-page-wrap > .row{--bs-gutter-x:5rem;row-gap:0;}

  /* Galería en flow normal — el editorial stack es alto a propósito y el
     usuario scrollea para ver las imágenes. Es la columna de info la que se
     queda sticky a la derecha. */
  .product-gallery-col{align-self:start;}
  .product__right{position:sticky;top:9.5rem;align-self:start;}
  .product-gallery,
  .product-gallery--stack{gap:1rem;}
  .gallery-stack__shot{border-radius:1.25rem;}

  .product-info{padding-left:0;padding-top:0;}
  .product-info__title{font-size:2.4rem;line-height:1.05;margin-bottom:.5rem;}
  .product-info__ref{margin-bottom:.6rem;}
  .product-info__price-block.product__prices-block{padding:1rem 0;margin-bottom:1.25rem;}
  .product-info__price-block .product-info__price{font-size:2.2rem;}
  .product-info__price-block .product-info__old-price{font-size:1.05rem;}
  .product-info__price-block .product-info__tax{margin-top:.4rem;}

  .stock-indicator{margin-bottom:1rem;font-size:.85rem;}

  .variant-group{margin-bottom:1.25rem;}
  .variant-group__label{margin-bottom:.55rem;}
  .variant-group__label .name{font-size:.88rem;}
  .variant-group__label .value{font-size:.85rem;}
  .variant-color{width:42px;height:42px;}
  .variant-size{min-width:54px;padding:.6rem 1rem;font-size:.88rem;}
  .variant-options{gap:.55rem;}

  .product-actions{gap:.75rem;margin-bottom:1.25rem;}
  .qty-selector button{width:44px;height:48px;}
  .qty-selector input{width:54px;height:48px;font-size:1rem;}
  .btn-add-cart{height:48px;font-size:.95rem;padding:0 1.5rem;border-radius:.7rem;}

  .product-secondary-actions{gap:.6rem;margin-bottom:1.5rem;}
  .btn-secondary-action{padding:.65rem .5rem;font-size:.82rem;border-radius:.6rem;}

  .trust-badges{gap:.6rem;margin-bottom:1.25rem;}
  .trust-badge{padding:.7rem .85rem;border-radius:.6rem;}
  .trust-badge .icon{width:34px;height:34px;}
  .trust-badge .icon .material-icons{font-size:18px;}
  .trust-badge .text strong{font-size:.82rem;}
  .trust-badge .text span{font-size:.72rem;}

  .product-info__description-short{padding:.85rem 1.1rem;font-size:.88rem;margin-bottom:1.25rem;}

  .product-tabs{margin-top:6rem;border-radius:1rem;}
  .product-tabs__nav button{padding:1.35rem 1.25rem;font-size:.98rem;}
  .product-tabs__pane{padding:2.75rem 2.75rem 2.5rem;}
  .product-tabs__content{font-size:.95rem;}
  .product-tabs__content h4{font-size:1.2rem;margin-bottom:1.2rem;}
  .product-tabs__content p{margin-bottom:1.25rem;}
  .spec-table td{padding:1.1rem 1.15rem;}

  .related-section{margin-top:6rem;}
  .related-section__title{margin-bottom:2rem;}
  .related-section__title h2{font-size:1.7rem;}
}

/* --- Mobile sticky buy bar (pill style) ------------------------------------
   Floating panel: detached from the viewport edges, very rounded corners,
   diffuse shadow. Two pill-shaped buttons inside on the same row, sized so
   the buy button reads as the primary action without screaming. */
.mobile-buy-bar{display:none;}
@media (max-width:991.98px){
  .mobile-buy-bar{
    display:flex;flex-direction:column;
    position:fixed;
    left:.75rem;right:.75rem;
    bottom:calc(.75rem + env(safe-area-inset-bottom));
    z-index:1040;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border:1px solid rgba(0,0,0,.05);
    border-radius:1.5rem;
    box-shadow:
      0 24px 48px -16px rgba(0,0,0,.22),
      0 4px 14px -4px rgba(0,0,0,.08);
    padding:.95rem 1rem;
    gap:.85rem;
  }
  body.page-product{padding-bottom:160px;}

  /* Info strip: price + selected variant, comfortably spaced. */
  .mobile-buy-bar__info-strip{
    display:flex;align-items:baseline;gap:.6rem;
    line-height:1.15;min-width:0;
    padding:0 .15rem;
  }
  .mobile-buy-bar__price{
    font-family:'Space Grotesk','Inter',sans-serif;
    font-weight:700;font-size:1.05rem;color:#0c0a09;letter-spacing:-.01em;
    flex-shrink:0;
  }
  .mobile-buy-bar__old{
    font-size:.74rem;color:#a8a29e;text-decoration:line-through;font-weight:500;
    flex-shrink:0;
  }
  .mobile-buy-bar__discount{
    background:linear-gradient(135deg,#dc2626,#991b1b);
    color:#fff;font-weight:700;font-size:.6rem;
    padding:.12rem .38rem;border-radius:999px;letter-spacing:.03em;line-height:1.3;
    flex-shrink:0;
  }
  .mobile-buy-bar__variant-sep{color:#d6d3d1;flex-shrink:0;}
  .mobile-buy-bar__variant{
    font-size:.8rem;color:#57534e;font-weight:500;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    min-width:0;flex:1;
  }
  .mobile-buy-bar__variant strong{color:#0c0a09;font-weight:600;}

  /* Buttons row */
  .mobile-buy-bar__buttons{
    display:flex;gap:.55rem;align-items:stretch;
  }

  /* "Ver más opciones" — soft pill with quiet eye icon, no aggressive uppercase. */
  .mobile-buy-bar__options{
    flex:1;
    display:flex;align-items:center;justify-content:center;gap:.4rem;
    background:#f5f5f4;color:#0c0a09;
    border:none;
    border-radius:1rem;
    height:54px;padding:0 .85rem;
    font-family:'Space Grotesk','Inter',sans-serif;
    font-weight:600;font-size:.86rem;letter-spacing:.005em;
    cursor:pointer;text-align:center;line-height:1.15;
    transition:background .15s,transform .12s;
  }
  .mobile-buy-bar__options:hover,
  .mobile-buy-bar__options:focus-visible{
    background:#e7e5e4;outline:none;
  }
  .mobile-buy-bar__options:active{transform:scale(.97);}
  .mobile-buy-bar__options-icon{
    width:18px;height:18px;flex-shrink:0;
    stroke:currentColor;fill:none;
    stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
  }

  /* Black buy CTA — pill-shaped, sized close to 2x the options button. */
  .mobile-buy-bar__cta{
    flex:1.9;
    display:flex;align-items:center;justify-content:center;gap:.45rem;
    background:#0c0a09;color:#fff;
    border:none;
    border-radius:1rem;
    height:54px;padding:0 .9rem;
    font-family:'Space Grotesk','Inter',sans-serif;
    font-weight:700;font-size:.92rem;letter-spacing:.01em;
    cursor:pointer;position:relative;
    box-shadow:0 6px 14px -6px rgba(12,10,9,.35);
    transition:background .2s,transform .12s,box-shadow .2s;
  }
  .mobile-buy-bar__cta:hover{
    background:#1c1917;
    box-shadow:0 8px 18px -6px rgba(12,10,9,.45);
  }
  .mobile-buy-bar__cta:active{transform:scale(.97);}
  .mobile-buy-bar__cta .material-icons{font-size:20px;}
  .mobile-buy-bar__cta.is-loading{pointer-events:none;}
  .mobile-buy-bar__cta.is-loading span:not(.mobile-buy-bar__cta-spinner){opacity:.4;}
  .mobile-buy-bar__cta-spinner{
    display:none;
    width:16px;height:16px;border-radius:50%;
    border:2px solid rgba(255,255,255,.45);
    border-top-color:#fff;
    animation:ikara-spin 1s linear infinite;
    margin-left:.2rem;
  }
  .mobile-buy-bar__cta.is-loading .mobile-buy-bar__cta-spinner{display:inline-block;}

  /* Success flash after add-to-cart succeeds (~1.8s). Background pulses to a
     subtle green so the user has unmistakable feedback even when the theme
     does not pop a confirmation modal. */
  .mobile-buy-bar__cta.is-success{
    background:#16a34a;
    box-shadow:0 8px 18px -6px rgba(22,163,74,.45);
    pointer-events:none;
  }
}

@media (max-width:380px){
  .mobile-buy-bar{padding:.85rem .85rem;}
  .mobile-buy-bar__cta{font-size:.85rem;padding:0 .55rem;}
  .mobile-buy-bar__options{font-size:.78rem;padding:0 .45rem;}
  .mobile-buy-bar__old,
  .mobile-buy-bar__discount{display:none;}
}

/* Ocultar bloques desktop ya cubiertos por sticky/sheet en móvil */
@media (max-width:991.98px){
  .product-info__price-block,
  .product-info .variant-group,
  .product-info .product-actions{display:none;}
}

/* --- Bottom sheet (móvil) -------------------------------------------------- */
.bsheet-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,.45);
  z-index:1050;opacity:0;pointer-events:none;
  transition:opacity .25s ease;
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
}
.bsheet-backdrop.is-open{opacity:1;pointer-events:auto;}
.bsheet{
  position:fixed;left:0;right:0;bottom:0;
  z-index:1060;
  background:#fff;
  border-top-left-radius:1.1rem;border-top-right-radius:1.1rem;
  padding:.65rem 1.1rem calc(1.1rem + env(safe-area-inset-bottom));
  box-shadow:0 -10px 40px -10px rgba(0,0,0,.25);
  transform:translateY(100%);
  transition:transform .3s cubic-bezier(.4,0,.2,1);
  max-height:88vh;overflow-y:auto;
  display:flex;flex-direction:column;gap:1.15rem;
}
.bsheet.is-open{transform:translateY(0);}
.bsheet__grabber{
  width:42px;height:4px;border-radius:999px;
  background:#d6d3d1;margin:0 auto .25rem;
  flex-shrink:0;
}
.bsheet__header{
  display:flex;align-items:center;gap:.85rem;
  padding-bottom:1rem;border-bottom:1px solid #f5f5f4;
}
.bsheet__thumb{
  width:64px;height:77px;border-radius:.55rem;overflow:hidden;
  background:#f5f5f4;flex-shrink:0;
}
.bsheet__thumb img{width:100%;height:100%;object-fit:cover;}
.bsheet__head-info{flex:1;min-width:0;}
.bsheet__head-title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.95rem;color:#0c0a09;line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;margin-bottom:.3rem;
}
.bsheet__head-price{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:1.15rem;color:#0c0a09;
}
.bsheet__head-old{
  display:inline-block;margin-left:.4rem;
  font-size:.78rem;color:#a8a29e;text-decoration:line-through;font-weight:500;
}
.bsheet__close{
  background:#f5f5f4;border:none;border-radius:50%;
  width:34px;height:34px;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;cursor:pointer;
}
.bsheet__close .material-icons{font-size:20px;color:#0c0a09;}
.bsheet__group{display:flex;flex-direction:column;gap:.7rem;}
.bsheet__label{
  display:flex;justify-content:space-between;align-items:baseline;
}
.bsheet__label .name{font-size:.85rem;font-weight:600;color:#0c0a09;}
.bsheet__label .value{font-size:.8rem;color:#78716c;}
.bsheet__label .value strong{color:#0c0a09;font-weight:600;}
.bsheet__qty-row{
  display:flex;align-items:center;justify-content:space-between;
  gap:.7rem;margin-top:.25rem;
}
.bsheet__qty-row .qty-selector{flex-shrink:0;}
.bsheet__qty-label{font-size:.85rem;font-weight:600;color:#0c0a09;}
.bsheet__cta{
  width:100%;
  background:#0c0a09;
  color:#fff;border:none;
  border-radius:.7rem;
  padding:1rem;
  font-weight:700;font-size:1rem;letter-spacing:.02em;
  display:flex;align-items:center;justify-content:center;gap:.55rem;
  cursor:pointer;
  transition:background .2s,transform .15s;
}
.bsheet__cta:hover{background:#1c1917;}
.bsheet__cta:active{transform:scale(.965);background:#1c1917;box-shadow:inset 0 0 0 999px rgba(255,255,255,.06);}
.bsheet__cta .material-icons{font-size:22px;transition:transform .25s;}
.bsheet__cta .total{margin-left:auto;font-weight:600;opacity:.85;}
/* Loading state — applied right after click while PrestaShop processes the
   add-to-cart request. Without this, the button stays static and the user
   thinks it didn't react. */
.bsheet__cta.is-loading{pointer-events:none;background:#1c1917;}
.bsheet__cta.is-loading .material-icons,
.bsheet__cta.is-loading span:not(.bsheet__cta-spinner){opacity:.35;}
.bsheet__cta-spinner{
  position:absolute;left:50%;top:50%;
  width:22px;height:22px;margin:-11px 0 0 -11px;
  border:2px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;
  animation:bsheet-cta-spin .7s linear infinite;
  display:none;
}
.bsheet__cta{position:relative;}
.bsheet__cta.is-loading .bsheet__cta-spinner{display:block;}
@keyframes bsheet-cta-spin{to{transform:rotate(360deg);}}
/* Same logic for the small bar CTA — small ripple on tap. */
.mobile-buy-bar__cta:active{transform:scale(.95);box-shadow:inset 0 0 0 999px rgba(255,255,255,.06);}

/* =============================================================================
   LISTADO CATEGORÍA
   ========================================================================== */

/* Category hero (v2 layout) */
.cat-hero{
  background:#fff;
  border-bottom:1px solid #f0efee;
  padding:2.25rem 0 1.5rem;
  margin-bottom:0;
  color:#0c0a09;
}
.cat-hero .crumb{
  font-size:.72rem;color:#78716c;
  letter-spacing:.04em;text-transform:uppercase;
  margin-bottom:.5rem;
}
.cat-hero .crumb a{color:#0c0a09;text-decoration:none;}
.cat-hero .crumb a:hover{color:#dc2626;}
.cat-hero .crumb .sep{opacity:.4;margin:0 .35rem;}
.cat-hero .accent-bar{
  display:inline-block;width:36px;height:3px;background:#dc2626;
  transform:skewX(-20deg);margin-bottom:.7rem;
}
.cat-hero h1{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-size:2.25rem;font-weight:700;letter-spacing:-.02em;
  margin:0 0 .35rem;color:#0c0a09;
}
.cat-hero__meta{
  font-size:.78rem;color:#78716c;
  letter-spacing:.04em;text-transform:uppercase;font-weight:500;
}
.cat-hero__meta strong{color:#0c0a09;font-weight:700;}
.cat-hero__desc{
  margin:.85rem 0 0;font-size:.9rem;color:#44403c;
  max-width:60ch;line-height:1.55;
}
/* Subcategory CTAs — editorial outline blocks (V5 from _demo_subcats.html).
   Each subcategory is a big rectangular outline with a label and a red
   forward arrow that slides on hover; the whole block inverts to black on
   hover. Feels like a call-to-action grid, fits stores with 3-6 subcats. */
.cat-subcats{padding:1.25rem 0 1.5rem;}
.cat-subcats .subcategory{margin:0;padding:0;}
.cat-subcats .subcategory__list{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem;
  list-style:none;margin:0;padding:0;
}
.cat-subcats .subcategory__link{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1rem 1.2rem;
  background:transparent;border:1px solid #0c0a09;border-radius:.85rem;
  text-decoration:none;color:#0c0a09;
  transition:background .15s,color .15s;
  position:relative;
}
.cat-subcats .subcategory__link:hover,
.cat-subcats .subcategory__link:focus{
  background:#0c0a09;color:#fff;
}
.cat-subcats .subcategory__name{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
  font-size:.95rem;letter-spacing:-.01em;color:inherit;line-height:1.15;
  text-transform:none;
}
/* Trailing arrow rendered as a pseudo so we don't depend on the theme
   adding an icon. Red by default, slides right + turns white on hover. */
.cat-subcats .subcategory__link::after{
  content:"arrow_forward";font-family:'Material Icons';font-weight:normal;
  font-size:18px;color:#dc2626;line-height:1;flex-shrink:0;
  transition:transform .2s,color .15s;
}
.cat-subcats .subcategory__link:hover::after,
.cat-subcats .subcategory__link:focus::after{
  transform:translateX(4px);color:#fff;
}
.cat-subcats .subcategory__image,
.cat-subcats .subcategory__img{display:none;}
@media (max-width:767px){
  .cat-subcats{padding:.85rem 0 1.1rem;}
  /* On mobile let the buttons fill the row width: two columns on tablet
     portrait, one column on phones. */
  .cat-subcats .subcategory__list{
    display:grid;grid-template-columns:1fr 1fr;gap:.55rem;
  }
  .cat-subcats .subcategory__link{
    min-width:0;width:100%;padding:.7rem .85rem;
  }
  .cat-subcats .subcategory__name{font-size:.78rem;}
}
@media (max-width:420px){
  .cat-subcats .subcategory__list{grid-template-columns:1fr;}
}

/* Hide the theme's global breadcrumb on category — we emit our own inside
   the cat-hero so users see one breadcrumb, not two. */
body.page-category .breadcrumb__wrapper,
body.page-category > .breadcrumb,
body.page-category .container > .breadcrumb__wrapper{display:none;}

/* Breadcrumb visibility rule of the redesign: only catalog pages keep it
   (product page; category renders its own inside cat-hero). Account, auth,
   checkout, CMS, search, error pages, etc. all hide the trail because they
   already have a clear page title and the breadcrumb adds noise — and on
   mobile it bunched up against the H1. */
body:not(.page-product):not(.page-category) .breadcrumb__wrapper,
body:not(.page-product):not(.page-category) > nav.breadcrumb,
body:not(.page-product):not(.page-category) .container > nav.breadcrumb,
body:not(.page-product):not(.page-category) .container > .breadcrumb__wrapper{
  display:none!important;
}

/* =============================================================================
   Breadcrumb — editorial restyle to match the rest of the redesign.
   Inter + Space Grotesk for the current item, slim red separator, neutral
   chips, hover red. Scoped only to the global breadcrumb (the cart/checkout/
   account hides keep their existing display:none rules elsewhere).
   ========================================================================== */
.breadcrumb__wrapper{
  background:transparent!important;
  border:none!important;
  margin:0!important;padding:0!important;
}
.breadcrumb__wrapper > .container,
.breadcrumb__wrapper{
  border-bottom:1px solid #e7e5e4;
}
ol.breadcrumb{
  display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .55rem;
  list-style:none;
  margin:0!important;padding:.95rem 0!important;
  background:transparent!important;
  font-family:'Inter',sans-serif;
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  font-weight:600;
  color:#78716c;
}
ol.breadcrumb .breadcrumb-item{
  display:inline-flex;align-items:center;gap:.55rem;
  margin:0;padding:0;
  background:transparent;
  font-size:inherit;letter-spacing:inherit;text-transform:inherit;
}
ol.breadcrumb .breadcrumb-item + .breadcrumb-item::before{
  content:"";display:inline-block;
  width:14px;height:1px;
  background:#dc2626;
  flex-shrink:0;
  /* Override Bootstrap's default "/" separator */
  padding:0;margin:0;
}
ol.breadcrumb .breadcrumb-item a,
ol.breadcrumb .breadcrumb-link{
  color:#78716c;
  text-decoration:none;
  transition:color .15s;
  background:transparent;border:none;padding:0;
}
ol.breadcrumb .breadcrumb-item a:hover,
ol.breadcrumb .breadcrumb-link:hover{color:#dc2626;}
/* Last (current) item: black, Space Grotesk, slightly heavier */
ol.breadcrumb .breadcrumb-item:last-child,
ol.breadcrumb .breadcrumb-item.active{
  font-family:'Space Grotesk','Inter',sans-serif;
  color:#0c0a09;
  font-weight:700;
}
ol.breadcrumb .breadcrumb-item:last-child a,
ol.breadcrumb .breadcrumb-item.active a{
  color:#0c0a09;pointer-events:none;
}
@media(max-width:767px){
  ol.breadcrumb{font-size:.68rem;letter-spacing:.12em;gap:.3rem .45rem;}
  ol.breadcrumb .breadcrumb-item + .breadcrumb-item::before{width:10px;}
}

/* En la página de categoría, el wrapper principal del listado debe ir pegado
   al hero (sin padding-top extra arriba). */
body.page-category .columns-container{padding-top:0;}

@media(max-width:767px){
  .cat-hero{padding:1.5rem 0 1.25rem;}
  .cat-hero h1{font-size:1.55rem;}
  .cat-hero__desc{font-size:.82rem;}
}

/* Toolbar en flow normal — sin sticky (decisión de UX: el cliente prefiere
   que la franja del botón filtrar no quede pegada al hacer scroll). */
.cat-toolbar{
  position:static;
  background:transparent;
  backdrop-filter:none;
  border-bottom:1px solid #f0efee;
  padding:.7rem 0;
  margin-bottom:1.25rem;
}
.cat-toolbar__row{
  display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;
}
.cat-toolbar__chips{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;}
.cat-toolbar__chips-label{
  font-size:.78rem;font-weight:600;color:#44403c;letter-spacing:.02em;
}
.cat-toolbar .chip,
.cat-toolbar__chips .chip{
  background:#fff;border:1px solid #e7e5e4;
  padding:.25rem .55rem .25rem .7rem;border-radius:999px;
  font-size:.74rem;font-weight:500;cursor:pointer;color:#0c0a09;
  display:inline-flex;align-items:center;gap:.3rem;
  transition:background .15s,border-color .15s,color .15s;
  white-space:nowrap;text-decoration:none;
}
.cat-toolbar .chip .material-icons,
.cat-toolbar__chips .chip .material-icons{font-size:14px;}
.cat-toolbar .chip:hover,
.cat-toolbar__chips .chip:hover{background:#0c0a09;color:#fff;border-color:#0c0a09;}
.cat-toolbar .chip.active{background:#0c0a09;color:#fff;border-color:#0c0a09;}

.cat-toolbar__right{
  display:flex;align-items:center;gap:.85rem;
}
.cat-toolbar__count{font-size:.78rem;color:#78716c;}
.cat-toolbar__count strong{color:#0c0a09;font-weight:700;}
.cat-toolbar select.cat-toolbar__sort,
select.cat-toolbar__sort.form-select{
  width:auto;min-width:11rem;
  appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;
  background-color:#fff;color:#0c0a09;
  border:1px solid #0c0a09;border-radius:999px;
  padding:.5rem 2.2rem .5rem 1rem;
  font-family:'Inter',sans-serif;font-size:.78rem;font-weight:600;
  letter-spacing:.02em;line-height:1.2;
  cursor:pointer;
  transition:background-color .15s,color .15s,border-color .15s;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%230c0a09' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>")!important;
  background-repeat:no-repeat!important;
  background-position:right .85rem center!important;
  background-size:11px 11px!important;
}
.cat-toolbar select.cat-toolbar__sort:hover,
select.cat-toolbar__sort.form-select:hover{
  background-color:#0c0a09;color:#fff;border-color:#0c0a09;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>")!important;
}
.cat-toolbar__sort:focus,
.cat-toolbar__sort:focus-visible{
  outline:none;
  border-color:#0c0a09;
  box-shadow:0 0 0 3px rgba(12,10,9,.12);
}
.cat-toolbar__sort option{
  background:#fff;color:#0c0a09;
  font-weight:500;
}
.cat-toolbar__btn-filters{
  display:inline-flex;align-items:center;gap:.4rem;
  background:#0c0a09;color:#fff;border:none;
  padding:.45rem .9rem;border-radius:.45rem;
  font-weight:600;font-size:.78rem;
  cursor:pointer;
  transition:background .15s;
}
.cat-toolbar__btn-filters:hover{background:#dc2626;}
.cat-toolbar__btn-filters .material-icons{font-size:16px;}
@media(max-width:575.98px){
  .cat-toolbar__chips-label{display:none;}
  .cat-toolbar__sort{min-width:auto;}
}

/* En categoría, ocultamos la columna lateral fija — los filtros viven en el
   offcanvas que se despliega desde la izquierda con el botón de la toolbar. */
/* Full-bleed listing: hero, toolbar and grid span the whole viewport. The
   theme's .container/row/col chain limits width and adds gutters; we strip
   them here and put the side padding back on each top-level block. */
body.page-category #left-column,
body.page-search #left-column{display:none!important;}
body.page-category .columns-container.container,
body.page-search .columns-container.container{
  max-width:100%!important;
  padding-left:0!important;
  padding-right:0!important;
}
body.page-category .columns-container > .row,
body.page-search .columns-container > .row{
  --bs-gutter-x:0!important;
  margin-left:0!important;margin-right:0!important;
}
body.page-category #center-column,
body.page-search #center-column{
  flex:0 0 100%!important;
  max-width:100%!important;
  width:100%!important;
  padding-left:0!important;
  padding-right:0!important;
}

.cat-hero,
.cat-toolbar,
#js-product-list,
.cat-pagination,
.cat-subcats{
  padding-left:1.5rem;
  padding-right:1.5rem;
}
@media (max-width:767px){
  .cat-hero,
  .cat-toolbar,
  #js-product-list,
  .cat-pagination,
  .cat-subcats{
    padding-left:1rem;
    padding-right:1rem;
  }
}

/* Filters offcanvas — keep Bootstrap's position/transform/visibility but
   override the theme's `.offcanvas .offcanvas-body { flex-grow:0; padding:0 }`
   that would collapse our content. */
#offcanvas-faceted{
  --bs-offcanvas-width:min(380px, 90vw);
  background:#fff;
  box-shadow:8px 0 24px rgba(0,0,0,.12);
}
#offcanvas-faceted .offcanvas-header{
  display:flex!important;
  align-items:center;justify-content:space-between;
  padding:1.1rem 1.25rem;
  border-bottom:1px solid #f0efee;
  flex:0 0 auto!important;
}
#offcanvas-faceted .offcanvas-body{
  display:block!important;
  flex:1 1 auto!important;
  flex-grow:1!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:1.25rem!important;
}
#offcanvas-faceted .btn-close{
  background:transparent;border:none;
  font-size:1.5rem;line-height:1;cursor:pointer;
  width:2rem;height:2rem;
  display:flex;align-items:center;justify-content:center;
  color:#0c0a09;opacity:.6;
}
#offcanvas-faceted .btn-close::before{content:"×";}
#offcanvas-faceted .btn-close:hover{opacity:1;}
.offcanvas-backdrop{
  position:fixed;top:0;left:0;
  width:100vw;height:100vh;
  background:#000;
  opacity:0;transition:opacity .3s ease-in-out;
  z-index:1040;
}
.offcanvas-backdrop.show{opacity:.5;}
body.offcanvas-open{overflow:hidden;}
#offcanvas-faceted .offcanvas-title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-size:.92rem;font-weight:700;color:#0c0a09;
  letter-spacing:.18em;text-transform:uppercase;margin:0;
  display:inline-flex;align-items:center;gap:.6rem;
}
#offcanvas-faceted .offcanvas-title::before{
  content:"";display:inline-block;width:24px;height:3px;
  background:#dc2626;transform:skewX(-20deg);
}
#offcanvas-faceted .cat-sidebar{padding:0;border:none;background:transparent;}

/* Filter group block */
.cat-sidebar .filter-group{
  padding:1.1rem 0;
  border-bottom:1px solid #f5f5f4;
}
.cat-sidebar .filter-group:first-child{padding-top:0;}
.cat-sidebar .filter-group:last-of-type{border-bottom:none;}
.cat-sidebar .filter-group h3{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.72rem;
  letter-spacing:.18em;text-transform:uppercase;
  margin:0 0 .85rem;
  display:flex;justify-content:space-between;align-items:center;
  color:#0c0a09;
}
.cat-sidebar .filter-group h3 .filter-group__toggle{
  border:none;background:none;color:#a8a29e;
  font-size:1rem;line-height:1;cursor:pointer;
  width:1.5rem;height:1.5rem;border-radius:.3rem;
  display:flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s;
}
.cat-sidebar .filter-group h3 .filter-group__toggle:hover{
  background:#f5f5f4;color:#0c0a09;
}

/* Category tree */
.cat-sidebar .cat-tree{list-style:none;padding:0;margin:0;font-size:.85rem;}
.cat-sidebar .cat-tree li{margin-bottom:.15rem;}
.cat-sidebar .cat-tree a{
  color:#44403c;text-decoration:none;
  display:flex;justify-content:space-between;align-items:center;
  padding:.4rem .55rem;border-radius:.35rem;
  transition:background .15s,color .15s;
}
.cat-sidebar .cat-tree a:hover{background:#fafaf9;color:#0c0a09;}
.cat-sidebar .cat-tree a.active{background:#0c0a09;color:#fff;font-weight:600;}
.cat-sidebar .cat-tree a.active .cat-count{color:rgba(255,255,255,.7);}
.cat-sidebar .cat-tree .cat-children{padding-left:.7rem;margin-top:.2rem;}
.cat-sidebar .cat-tree .cat-children a{font-size:.78rem;color:#78716c;}
.cat-sidebar .cat-count{
  color:#a8a29e;font-size:.72rem;font-weight:500;
  background:#f5f5f4;padding:.05rem .45rem;border-radius:999px;
  min-width:1.5rem;text-align:center;
}

/* Checkbox-style filters. Each row is a single <a class="js-search-link"> so
   any click anywhere fires the AJAX handler. The checkbox/radio look is faked
   with .filter-check__box. data-multiple="0" → render as radio. */
.cat-sidebar .filter-checks{display:flex;flex-direction:column;gap:.15rem;font-size:.85rem;}
.cat-sidebar .filter-checks .filter-checks__link{
  display:flex;align-items:center;gap:.65rem;
  padding:.45rem .55rem;border-radius:.35rem;
  color:#44403c;text-decoration:none;line-height:1.3;
  transition:background .15s,color .15s;
}
.cat-sidebar .filter-checks .filter-checks__link:hover{
  background:#fafaf9;color:#0c0a09;
}
.cat-sidebar .filter-check__box{
  width:18px;height:18px;flex-shrink:0;
  border:1.5px solid #d6d3d1;border-radius:.25rem;
  background:#fff;position:relative;
  transition:background .15s,border-color .15s;
}
.cat-sidebar .filter-checks[data-multiple="0"] .filter-check__box{
  border-radius:50%;
}
.cat-sidebar .filter-check__label{flex:1;}
.cat-sidebar .filter-check__count{
  margin-left:auto;color:#a8a29e;font-size:.72rem;font-weight:500;
  background:#f5f5f4;padding:.1rem .5rem;border-radius:999px;
  min-width:1.6rem;text-align:center;
}
.cat-sidebar .filter-checks__link.is-active{
  background:#fafaf9;color:#0c0a09;font-weight:600;
}
.cat-sidebar .filter-checks__link.is-active .filter-check__box{
  background:#0c0a09;border-color:#0c0a09;
}
.cat-sidebar .filter-checks .filter-checks__link.is-active .filter-check__box::after{
  content:"";position:absolute;left:5px;top:1px;
  width:5px;height:10px;border:solid #fff;border-width:0 2px 2px 0;
  transform:rotate(45deg);
}
.cat-sidebar .filter-checks[data-multiple="0"] .filter-checks__link.is-active .filter-check__box::after{
  content:"";position:absolute;inset:3px;left:auto;top:auto;
  background:#fff;border-radius:50%;border:none;transform:none;
  width:auto;height:auto;
}
.cat-sidebar .filter-checks__link.is-active .filter-check__count{
  background:#0c0a09;color:#fff;
}

/* Color swatches */
.cat-sidebar .swatch-grid{display:flex;flex-wrap:wrap;gap:.55rem;padding-top:.15rem;}
.cat-sidebar .color-swatch{
  width:30px;height:30px;border-radius:50%;
  border:2px solid #fff;box-shadow:0 0 0 1.5px #d6d3d1, 0 1px 3px rgba(0,0,0,.06);
  cursor:pointer;padding:0;position:relative;
  transition:transform .15s,box-shadow .15s;
  background-size:cover;background-position:center;
}
.cat-sidebar .color-swatch:hover{transform:scale(1.12);box-shadow:0 0 0 1.5px #0c0a09, 0 2px 6px rgba(0,0,0,.12);}
.cat-sidebar .color-swatch.active{box-shadow:0 0 0 2.5px #0c0a09, 0 2px 6px rgba(0,0,0,.12);}
.cat-sidebar .color-swatch.active::after{
  content:"";position:absolute;left:50%;top:50%;
  width:8px;height:14px;
  border:solid #fff;border-width:0 2.5px 2.5px 0;
  transform:translate(-50%,-60%) rotate(45deg);
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.4));
}

/* Sizes */
.cat-sidebar .size-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem;}
.cat-sidebar .size-btn{
  border:1px solid #e7e5e4;background:#fff;
  padding:.55rem .35rem;
  border-radius:.4rem;font-size:.78rem;font-weight:600;
  color:#44403c;cursor:pointer;
  text-align:center;text-decoration:none;
  display:flex;align-items:center;justify-content:center;
  min-width:0;min-height:2.4rem;
  word-break:break-word;overflow-wrap:anywhere;
  line-height:1.15;
  transition:all .15s;
}
.cat-sidebar .size-btn:hover{border-color:#0c0a09;color:#0c0a09;background:#fafaf9;}
.cat-sidebar .size-btn.active{
  background:#0c0a09;color:#fff;border-color:#0c0a09;
  box-shadow:0 2px 4px rgba(12,10,9,.15);
}
.cat-sidebar .size-btn.disabled{
  opacity:.35;cursor:not-allowed;text-decoration:line-through;
  pointer-events:none;
}

/* Clear all */
.cat-sidebar .clear-all{
  width:100%;background:#fff;border:1px solid #0c0a09;
  padding:.7rem;border-radius:.4rem;
  font-size:.78rem;font-weight:600;color:#0c0a09;
  text-transform:uppercase;letter-spacing:.05em;
  cursor:pointer;margin-top:1.25rem;
  transition:all .15s;
}
.cat-sidebar .clear-all:hover{background:#0c0a09;color:#fff;}

/* Apply button — sticky footer that confirms queued filter changes. */
#offcanvas-faceted .cat-sidebar-footer{
  flex:0 0 auto;
  padding:1rem 1.25rem;
  border-top:1px solid #f0efee;
  background:#fff;
}
.cat-sidebar-apply{
  width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.95rem 1rem;
  background:#0c0a09;color:#fff;border:none;border-radius:.5rem;
  font-family:'Space Grotesk','Inter',sans-serif;
  font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  cursor:pointer;transition:background .15s,transform .15s,opacity .15s;
}
.cat-sidebar-apply:not(:disabled):hover{background:#dc2626;}
.cat-sidebar-apply:not(:disabled):active{transform:scale(.98);}
.cat-sidebar-apply:disabled{opacity:.4;cursor:not-allowed;}
.cat-sidebar-apply .count{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:1.4rem;height:1.4rem;padding:0 .35rem;
  background:#dc2626;color:#fff;border-radius:999px;
  font-size:.7rem;font-weight:700;letter-spacing:0;
}
.cat-sidebar-apply:not(.is-active) .count{display:none;}
.cat-sidebar-apply.is-loading{
  pointer-events:none;
  background:#44403c;
}
.cat-sidebar-apply.is-loading::after{
  content:"";display:inline-block;width:14px;height:14px;
  border:2px solid rgba(255,255,255,.4);border-top-color:#fff;
  border-radius:50%;animation:cat-apply-spin .7s linear infinite;
  margin-left:.4rem;
}
@keyframes cat-apply-spin{to{transform:rotate(360deg);}}

/* Price slider del facetedsearch (noUiSlider) — adaptación visual */
.cat-sidebar .price-slider-container{padding:.4rem 0 .25rem;}
.cat-sidebar .price-slider.noUi-target,
.cat-sidebar .price-slider .noUi-target{
  background:#e7e5e4;border:none;box-shadow:none;height:4px;border-radius:999px;
}
.cat-sidebar .price-slider .noUi-connect{background:#0c0a09;}
.cat-sidebar .price-slider .noUi-handle{
  width:18px;height:18px;border-radius:50%;
  background:#fff;border:2px solid #0c0a09;
  box-shadow:0 1px 3px rgba(0,0,0,.15);
  top:-7px;right:-9px;cursor:pointer;
}
.cat-sidebar .price-slider .noUi-handle::before,
.cat-sidebar .price-slider .noUi-handle::after{display:none;}
.cat-sidebar .price-slider__values{
  margin-top:.65rem;font-size:.78rem;font-weight:600;color:#0c0a09;
  display:flex;justify-content:space-between;
}

/* Sidebar dropdown */
.cat-sidebar .filter-dropdown{
  font-size:.82rem;border-color:#e7e5e4;
}
.cat-sidebar .filter-dropdown:focus{
  border-color:#0c0a09;box-shadow:0 0 0 2px rgba(12,10,9,.08);
}

/* Filter-checks: que el <a> dentro del label sea texto plano sin estilo de link */
.cat-sidebar .filter-checks .filter-checks__link{
  color:#44403c;text-decoration:none;flex:1;
}
.cat-sidebar .filter-checks .filter-checks__link:hover{color:#dc2626;}

/* Toggle del header del filter-group */
.cat-sidebar .filter-group h3{cursor:default;}
.cat-sidebar .filter-group h3 .filter-group__toggle{
  font-size:1.1rem;line-height:1;width:1.4rem;height:1.4rem;
  display:flex;align-items:center;justify-content:center;
}
.cat-sidebar .filter-group h3 button[aria-expanded="false"]::before{content:"+";}
.cat-sidebar .filter-group h3 button[aria-expanded="false"]{font-size:0;}
.cat-sidebar .filter-group h3 button[aria-expanded="false"]::before{font-size:1.1rem;}

/* Sidebar móvil = drawer */
@media (max-width:991.98px){
  .cat-sidebar-col{
    position:fixed;top:0;left:0;bottom:0;width:85%;max-width:340px;
    background:#fff;z-index:1070;
    transform:translateX(-100%);
    transition:transform .3s cubic-bezier(.4,0,.2,1);
    overflow-y:auto;
    padding:1rem 1.25rem 5rem;
    box-shadow:8px 0 30px rgba(0,0,0,.15);
  }
  .cat-sidebar-col.is-open{transform:translateX(0);}
  .cat-sidebar{position:static;}
  .cat-sidebar-backdrop{
    position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:1065;
    opacity:0;pointer-events:none;transition:opacity .25s;
  }
  .cat-sidebar-backdrop.is-open{opacity:1;pointer-events:auto;}
  .cat-sidebar-close{
    position:absolute;top:.65rem;right:.65rem;
    background:#f5f5f4;border:none;border-radius:50%;
    width:34px;height:34px;display:flex;align-items:center;justify-content:center;
    cursor:pointer;
  }
  .cat-sidebar-close .material-icons{font-size:20px;color:#0c0a09;}
}
@media (min-width:992px){
  .cat-sidebar-close,.cat-sidebar-backdrop{display:none;}
}

/* Tarjeta producto */
.product-card{
  background:#fff;
  border-radius:.75rem;
  overflow:hidden;
  border:1px solid var(--bs-border-color);
  transition:box-shadow .25s, transform .25s;
  height:100%;
  display:flex;
  flex-direction:column;
  position:relative;
}
/* No hover effects on the product card — keeps mobile tap-to-enter snappy. */
.product-card__image-link{display:block;text-decoration:none;color:inherit;}
.product-card__image{
  position:relative;
  aspect-ratio:5/6;
  overflow:hidden;
  background:#f5f5f4;
}
.product-card__image img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .5s ease;
}
.product-card__flags{
  position:absolute;top:.75rem;left:.75rem;
  display:flex;flex-direction:column;gap:.3rem;z-index:2;
}
.product-card__flags .flag{
  font-size:.65rem;font-weight:700;
  padding:.2rem .55rem;border-radius:.25rem;
  color:#fff;background:#0c0a09;
  text-transform:uppercase;letter-spacing:.05em;
}
.product-card__flags .flag.discount,
.product-card__flags .flag.on-sale{background:linear-gradient(135deg,#dc2626,#991b1b);}
.product-card__flags .flag.new{background:#16a34a;}
.product-card__flags .flag.out-of-stock{background:#57534e;}
.product-card__flags .flag.online-only{background:#1d4ed8;}
.product-card__flags .flag.pack{background:#7c3aed;}
.product-card__wish{
  position:absolute;top:.75rem;right:.75rem;
  width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.92);backdrop-filter:blur(6px);
  border:none;display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.08);cursor:pointer;
  transition:background .2s;z-index:2;
}
/* No hover effects on product cards (per UX decision — was causing
   double-tap on mobile). */
.product-card__wish .material-icons{font-size:18px;color:#0c0a09;}
.product-card__body{padding:1rem;display:flex;flex-direction:column;flex:1;gap:.45rem;}
.product-card__brand{
  font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;
  color:#dc2626;font-weight:700;
}
.product-card__title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:600;font-size:.95rem;line-height:1.25;
  color:#0c0a09;text-decoration:none;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  min-height:2.4em;
}
.product-card__swatches{display:flex;gap:.35rem;align-items:center;flex-wrap:wrap;}
.product-card__swatches .swatch{
  width:22px;height:22px;border-radius:50%;
  border:2px solid #fff;box-shadow:0 0 0 1px #d6d3d1;
  cursor:pointer;padding:0;
  background-size:cover;background-position:center;
}
.product-card__swatches .swatch.active{box-shadow:0 0 0 2px #0c0a09;}
.product-card__swatches .swatch-more{
  width:22px;height:22px;border-radius:50%;
  background:#f5f5f4;font-size:.65rem;font-weight:600;color:#44403c;
  display:flex;align-items:center;justify-content:center;
  border:none;
}
.product-card__bottom{
  margin-top:auto;display:flex;align-items:center;gap:.6rem;
  justify-content:space-between;padding-top:.4rem;
}
.product-card__price{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-size:1.2rem;font-weight:700;color:#0c0a09;
  display:flex;align-items:baseline;gap:.4rem;flex-wrap:wrap;
}
.product-card__price .old{
  color:#a8a29e;font-weight:400;text-decoration:line-through;
  font-size:.8rem;
}
.product-card__add{
  background:#0c0a09;color:#fff!important;border:none;
  width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  transition:background .2s,transform .2s,color .2s;
  cursor:pointer;flex-shrink:0;text-decoration:none!important;
}
/* Keep icon white on hover — the CE kit ships `a:hover { color:#000 }`
   which would otherwise paint the icon black on a black background and
   make it disappear. Red bg gives clear feedback without dropping the icon. */
.product-card__add:hover,
.product-card__add:focus,
.product-card__add:active{
  background:#dc2626;color:#fff!important;
}
.product-card__add .material-icons{font-size:18px;color:inherit;}
.product-card__add--details{text-decoration:none;}

/* Quick view dentro de la imagen (botón secundario) */
.product-card__quickview{
  position:absolute;top:.75rem;right:.75rem;
  width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.92);backdrop-filter:blur(6px);
  border:none;display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.08);cursor:pointer;
  transition:background .2s,opacity .2s;
  opacity:0;z-index:2;
}
/* Quickview hidden everywhere — relying on it for hover-only reveal made the
   card require two taps on touch devices. */
.product-card__quickview{display:none;}
.product-card__quickview .material-icons{font-size:18px;color:#0c0a09;}

/* Reset form: no aporta layout */
.product-card__form{margin:0;padding:0;display:contents;}

/* Listing grid: 2 → 6 columns. Specificity must match `body.page-category
   #js-product-list .products` rule from custom.css (saved from the BO),
   otherwise that rule wins. */
body.page-category #js-product-list .products,
body.page-search #js-product-list .products,
.products{
  display:grid!important;
  grid-template-columns:repeat(2, minmax(0, 1fr))!important;
  gap:.7rem!important;
}
@media (min-width:768px){
  body.page-category #js-product-list .products,
  body.page-search #js-product-list .products,
  .products{grid-template-columns:repeat(3, minmax(0, 1fr))!important;gap:1rem!important;}
}
@media (min-width:992px){
  body.page-category #js-product-list .products,
  body.page-search #js-product-list .products,
  .products{grid-template-columns:repeat(4, minmax(0, 1fr))!important;}
}
@media (min-width:1200px){
  body.page-category #js-product-list .products,
  body.page-search #js-product-list .products,
  .products{grid-template-columns:repeat(5, minmax(0, 1fr))!important;}
}
@media (min-width:1500px){
  /* Category / search listings keep 6 cols (high-density browsing). */
  body.page-category #js-product-list .products,
  body.page-search #js-product-list .products{grid-template-columns:repeat(6, minmax(0, 1fr))!important;}
  /* Product page rails (related, featured, etc.) cap at 4 cols so the cards
     stay legible inside the narrower content column. */
  body.page-product .products{grid-template-columns:repeat(4, minmax(0, 1fr))!important;}
}

/* Paginación */
.cat-pagination{
  margin:2.5rem 0 1rem;
  display:flex;flex-direction:column;align-items:center;gap:.85rem;
}
/* Ocultamos el "Mostrando 1-24 de 506" inferior — ya está en el toolbar superior */
body.page-category .cat-pagination .pagination__number,
body.page-search .cat-pagination .pagination__number{display:none;}
.cat-pagination .pagination__nav{width:auto;}
.cat-pagination .pagination{
  display:flex;gap:.3rem;list-style:none;padding:0;margin:0;
}
.cat-pagination .page-item{margin:0;}
.cat-pagination .page-link{
  border:1px solid #e7e5e4;color:#44403c;
  font-weight:500;font-size:.85rem;
  background:#fff;
  min-width:2.4rem;height:2.4rem;
  display:inline-flex;align-items:center;justify-content:center;
  padding:0 .75rem;border-radius:.4rem;
  transition:background .15s,color .15s,border-color .15s;
}
.cat-pagination .page-link:hover{background:#f5f5f4;color:#0c0a09;border-color:#d6d3d1;}
.cat-pagination .page-item.active .page-link,
.cat-pagination .page-item .page-link[aria-current="page"]{
  background:#0c0a09;border-color:#0c0a09;color:#fff;
}
.cat-pagination .page-item.disabled .page-link,
.cat-pagination .page-link[disabled]{
  opacity:.4;cursor:not-allowed;background:#fff;
}
.cat-pagination .page-link .material-icons{font-size:18px;}

/* =============================================================================
   AVISO STOCK (módulo idnovate stockalert)
   El módulo aplica su propio CSS con sombra/card y choca con el resto de la
   ficha. Aquí lo neutralizamos y lo integramos con el bloque de info.
   ========================================================================== */
.stockalert-add-container{margin-top:1rem;}
.stockalert-add{
  box-shadow:none!important;
  background:#fafaf9!important;
  border:1px solid #f5f5f4;
  border-left:3px solid #0c0a09;
  border-radius:.55rem;
  padding:.95rem 1.1rem!important;
  margin:0!important;
  line-height:1.4;
  clear:none;
}
.stockalert-add strong{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-size:.92rem;font-weight:600;color:#0c0a09;
  display:block;margin-bottom:.6rem;
}
.stockalert-add input[type="email"]{
  border:1px solid var(--bs-border-color);
  border-radius:.45rem;
  font-size:.85rem;
  padding:.5rem .75rem;
  margin-bottom:.6rem;
  background:#fff;
}
.stockalert-add input[type="email"]:focus{
  border-color:#0c0a09;
  box-shadow:0 0 0 2px rgba(12,10,9,.08);
  outline:none;
}
.stockalert_button_container{margin-top:.25rem;text-align:left!important;}
.stockalert-add button[type="submit"]{
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:.78rem;font-weight:600;
  background:#0c0a09!important;
  color:#fff!important;
  border:none!important;
  padding:.55rem 1.1rem!important;
  border-radius:.45rem;
  margin:0!important;
  transition:background .15s;
}
.stockalert-add button[type="submit"]:hover{background:#dc2626!important;}
.stockalert-add button[type="submit"]:disabled{
  background:#a8a29e!important;cursor:not-allowed;opacity:.7;
}
.stockalert-add .stockalert-disclaimer{
  font-size:.72rem;color:#78716c;font-style:normal;
  margin-top:.6rem;line-height:1.35;
}
.stockalert-add .stockalert-result:not(:empty){
  margin:.5rem 0;padding:.5rem .75rem;
  border-radius:.4rem;font-size:.82rem;
}

/* Subscribed state — show the same editorial card vocabulary */
.stockalert-remove{
  margin-top:1rem;
  background:#fafaf9;
  border:1px solid #f5f5f4;
  border-left:3px solid #16a34a;
  border-radius:.55rem;
  padding:1rem 1.1rem;
  line-height:1.4;
  display:flex;flex-direction:column;gap:.7rem;
}
.stockalert-remove .disclaimer,
.stockalert-remove [class*="stockalert_disclaimer"]{
  order:1;
  display:flex;align-items:flex-start;gap:.55rem;
  font-family:'Inter',sans-serif;
  font-size:.85rem;color:#0c0a09;font-style:normal;
  margin:0;
}
.stockalert-remove .disclaimer::before,
.stockalert-remove [class*="stockalert_disclaimer"]::before{
  content:"check_circle";font-family:'Material Icons';
  color:#16a34a;font-size:18px;line-height:1.3;flex-shrink:0;
}
.stockalert-remove .stockalert_button_container,
.stockalert-remove [class*="stockalert_button_container"]{
  order:2;
  margin:0!important;text-align:left!important;
}
.stockalert-remove button[type="submit"],
.stockalert-remove .btn{
  font-family:'Space Grotesk','Inter',sans-serif;
  text-transform:uppercase;letter-spacing:.08em;
  font-size:.72rem;font-weight:700;
  background:transparent!important;
  color:#0c0a09!important;
  border:1px solid #0c0a09!important;
  padding:.5rem .9rem!important;
  border-radius:.45rem;
  margin:0!important;
  transition:background .15s,color .15s;
  display:inline-flex;align-items:center;gap:.4rem;
}
.stockalert-remove button[type="submit"]::before,
.stockalert-remove .btn::before{
  content:"close";
  font-family:'Material Icons','Material Icons Outlined',sans-serif;
  font-size:16px;font-weight:normal;letter-spacing:0;
  text-transform:none;
  font-feature-settings:'liga';
  -webkit-font-feature-settings:'liga';
  -webkit-font-smoothing:antialiased;
  line-height:1;
  display:inline-flex;align-items:center;
}
.stockalert-remove button[type="submit"]:hover,
.stockalert-remove .btn:hover{
  background:#dc2626!important;color:#fff!important;border-color:#dc2626!important;
}
.stockalert-remove [class*="stockalert_result"]:not(:empty){
  order:3;
  margin:0;padding:.5rem .75rem;
  border-radius:.4rem;font-size:.82rem;
}

/* =============================================================================
   QTY INPUT — Ocultar spinners nativos del navegador
   El selector +/- ya está dibujado en el rediseño; los spinners por defecto
   del input[type=number] aparecían encima al pasar el ratón.
   ========================================================================== */
.qty-selector input[type="number"],
input#quantity_wanted{
  -moz-appearance:textfield;
  appearance:textfield;
}
.qty-selector input[type="number"]::-webkit-inner-spin-button,
.qty-selector input[type="number"]::-webkit-outer-spin-button,
input#quantity_wanted::-webkit-inner-spin-button,
input#quantity_wanted::-webkit-outer-spin-button{
  -webkit-appearance:none;
  appearance:none;
  margin:0;
}

/* =============================================================================
   HEADER REDESIGN (V1 Classic Pro) + MOBILE MENU V2 LIGHT
   The redesigned markup is rendered directly inside the theme's <header
   id="header"> by _partials/header.tpl. We use :has() to apply sticky +
   reset background only when the redesigned content is present, so the
   legacy header (checkout / account) is left untouched.
   ========================================================================== */

#header:has(.hpv1__top){
  position:sticky;top:0;z-index:1000;
  background:#fff;border-bottom:1px solid #f5f5f4;
  font-family:'Inter',sans-serif;color:#0c0a09;
  /* Default: subtle shadow so the sticky header always reads against white
     content below. Home overrides this at the top of the page. */
  box-shadow:0 6px 20px -10px rgba(12,10,9,.18);
  transition:box-shadow .2s ease,border-color .2s ease,background .2s ease;
}

/* Home header used to be transparent over the hero banner — now it always
   keeps the same white surface as the rest of the site (decision: too much
   contrast variance between top and scrolled state). */
/* Strip any padding/box that the theme may apply to the <header> shell so
   the redesigned bar sits flush. */
#header:has(.hpv1__top).header{padding:0;margin:0;border:0;}
.hpv1__top{background:#0c0a09;color:#fff;font-size:.78rem;letter-spacing:.05em;}
.hpv1__top-inner{
  padding:.55rem 2rem;
  display:flex;justify-content:space-between;align-items:center;gap:1rem;
}
.hpv1__top-left{display:inline-flex;align-items:center;gap:.6rem;flex-wrap:wrap;}
.hpv1__top-item{
  display:inline-flex;align-items:center;gap:.35rem;
  color:#fff;text-decoration:none;opacity:.85;
  transition:opacity .15s,color .15s;
}
.hpv1__top-item:hover{opacity:1;color:#fff;}
.hpv1__top-item .material-icons{font-size:14px;}
.hpv1__top-sep{opacity:.4;margin:0 .25rem;}

.hpv1__top-right{display:flex;align-items:center;gap:1rem;}
/* Native <select> from ps_languageselector — make it sit cleanly on the dark bar */
.hpv1__top-right .ps-languageselector{margin:0;padding:0;background:transparent;}
.hpv1__top-right .js-language-selector{
  background:transparent;color:#fff;border:1px solid rgba(255,255,255,.25);
  padding:.2rem 1.6rem .2rem .6rem;font-size:.74rem;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  border-radius:.3rem;cursor:pointer;
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path fill='%23ffffff' d='M0 0l5 6 5-6z'/></svg>");
  background-repeat:no-repeat;background-position:right .5rem center;
  transition:border-color .15s,color .15s;
}
.hpv1__top-right .js-language-selector:hover{border-color:#fff;color:#fff;}
.hpv1__top-right .js-language-selector option{
  color:#0c0a09;background:#fff;
}

.hpv1__main{
  padding:.95rem 2rem;
  display:flex;align-items:center;gap:2rem;
}
.hpv1__brand{display:inline-flex;align-items:center;text-decoration:none;flex-shrink:0;}
.hpv1__logo{max-height:56px;width:auto;display:block;}

.hpv1__nav{
  flex:1;display:flex;align-items:center;min-width:0;
}

/* --- Layout-only adjustments to the injected ets_megamenu ------------------- */
/* The megamenu brings its own .container that re-centers and limits width;
   strip it so the menu spans the available space inside the header. */
.hpv1__nav .ets_mm_megamenu{background:transparent;width:100%;}
.hpv1__nav .ets_mm_megamenu .container{
  max-width:none;width:100%;padding:0;
}
.hpv1__nav .ets_mm_megamenu_content,
.hpv1__nav .ets_mm_megamenu_content_content{background:transparent;padding:0;}
/* Hide bits we don't need in desktop preview (mobile toggle and back arrow) */
.hpv1__nav .ybc-menu-toggle,
.hpv1__nav .close_menu{display:none;}
/* Top-level menu items: solid black text + Space Grotesk to match the
   dropdown titles (.ikmm-disc__eyebrow / .ikmm-prod__title). The megamenu
   inherits Inter from the theme; this aligns the visual language between
   top items and the panel they open. */
.hpv1__nav .mm_menus_li > a.ets_mm_url,
.hpv1__nav .mm_menus_li > a.ets_mm_url .mm_menu_content_title{
  color:#0c0a09;
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;
  letter-spacing:.02em;
}

.hpv1__actions{display:flex;align-items:center;gap:1.15rem;flex-shrink:0;margin-left:auto;}

/* Search slot — render the real ps_searchbar widget for doofinder hooks but
   collapse it visually to look like just a circular magnifier button matching
   the rest of .hpv1__icon (cart, menu toggle, signin). */
.hpv1__search-slot{display:inline-flex;align-items:center;}
.hpv1__search-slot #_desktop_ps_searchbar{
  padding:0!important;margin:0!important;display:inline-flex;align-items:center;
  /* Reset bootstrap col/order/ms-auto utilities the widget tpl applies. */
  flex:0 0 auto!important;width:auto!important;
}
.hpv1__search-slot .ps-searchbar{
  position:relative;background:transparent;border:none;padding:0;
  display:inline-flex;align-items:center;
  /* Theme base sets min-width:19rem on .ps-searchbar — collapse it. */
  min-width:0!important;width:auto!important;margin:0!important;
}
/* Mobile-only widget block must stay hidden on desktop and not push siblings. */
.hpv1__search-slot .ps-searchbar--mobile{display:none!important;}
.hpv1__search-slot .ps-searchbar__form{
  display:inline-flex;align-items:center;background:transparent;
  border:none;padding:0;margin:0;position:relative;
}
/* The magnifier icon styled to match the rest of .hpv1__icon (transparent
   bg, color-only hover). */
.hpv1__search-slot .ps-searchbar__magnifier{
  position:static;transform:none;left:auto;
  width:42px;height:42px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:transparent;color:#0c0a09;cursor:pointer;
  transition:color .15s;
}
.hpv1__search-slot .ps-searchbar__magnifier:hover{color:#dc2626;}
.hpv1__search-slot .ps-searchbar__magnifier::before{display:none;}
/* Input hidden visually but kept in the DOM so doofinder & friends can hook
   `input[name="s"]`. width:0 + opacity:0 keeps it interactable enough for
   external scripts that listen on focus/click. */
.hpv1__search-slot .ps-searchbar__input{
  width:0;padding:0;border:none;opacity:0;
  position:absolute;left:0;top:0;height:100%;pointer-events:none;
}
.hpv1__search-slot .ps-searchbar__clear,
.hpv1__search-slot .ps-searchbar__dropdown{display:none!important;}

/* --- ps_customersignin widget styled as a circular icon ------------------- */
/* The widget brings .header-block / .header-block__action-btn / .dropdown-menu
   markup. We flatten the wrappers and force the trigger to a 42px circle so it
   matches .hpv1__icon next to it. The dropdown menu keeps the theme's native
   look (only the trigger is restyled). */
.hpv1__signin{display:inline-flex;align-items:center;flex-shrink:0;}
.hpv1__signin .ps-customersignin,
.hpv1__signin .header-block{
  margin:0!important;padding:0!important;background:transparent!important;
  display:inline-block!important;position:relative;
}
.hpv1__signin .header-block__action-btn{
  width:42px!important;height:42px!important;
  border-radius:50%!important;background:transparent!important;
  border:none!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  cursor:pointer;color:#0c0a09!important;text-decoration:none!important;
  padding:0!important;margin:0!important;gap:0!important;
  position:relative!important;font:inherit;
}
/* Hover only re-tints the icon — never the whole button color, otherwise
   the dropdown menu items inherit white text and become unreadable. */
.hpv1__signin .header-block__action-btn:hover .header-block__icon{
  color:#dc2626!important;
}
.hpv1__signin .header-block__icon{
  font-size:20px!important;line-height:1!important;color:#0c0a09!important;
  margin:0!important;
  transition:color .15s;
}
/* Hide the widget's text label next to the icon — both logged-out
   ("Iniciar sesión") and logged-in ("Claude" / customer name). The widget
   ships `d-none d-md-inline` Bootstrap classes that re-show it from md+,
   so we override every variant. */
.hpv1__signin .header-block__title,
.hpv1__signin .ps-customersignin .header-block__title,
.hpv1__signin .header-block .header-block__action-btn .header-block__title,
.hpv1__signin span.d-none.d-md-inline.header-block__title{
  display:none!important;width:0!important;height:0!important;
  font-size:0!important;visibility:hidden!important;overflow:hidden!important;
  position:absolute!important;left:-9999px!important;
}
.hpv1__signin .dropdown-toggle::after{display:none!important;}

/* --- ps_customersignin dropdown menu (logged in) -------------------------- */
/* Editorial light: rounded panel, eyebrow with red skewed bar at the top,
   flat list of items (Inter, black) with a hover that nudges right and turns
   red. The "Cerrar sesión" link gets a top divider + red treatment. */
.hpv1__signin .dropdown-menu{
  border:1px solid #e7e5e4!important;
  border-radius:1rem!important;
  background:#fff!important;
  box-shadow:0 24px 60px -20px rgba(12,10,9,.18)!important;
  min-width:260px!important;
  padding:2.4rem 0 .25rem!important;
  margin-top:.65rem!important;
  font-family:'Inter',sans-serif!important;
  position:relative;
}
/* Eyebrow header — split into two absolute pseudos so the skewed bar and the
   "Mi cuenta" label don't overlap. The wrapper reserves 2.4rem padding-top
   for them, plus the first item carries a top border. */
.hpv1__signin .dropdown-menu::before{
  content:"";position:absolute;left:1.1rem;top:1rem;
  width:24px;height:3px;background:#dc2626;transform:skewX(-20deg);
}
.hpv1__signin .dropdown-menu::after{
  content:"Mi cuenta";
  position:absolute;left:calc(1.1rem + 24px + .55rem);top:.7rem;
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
  font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:#0c0a09;
  line-height:1.3;
}
.hpv1__signin .dropdown-menu > a.dropdown-item:first-of-type,
.hpv1__signin .dropdown-menu > .dropdown-item:first-of-type{
  border-top:1px solid #e7e5e4;
  padding-top:.85rem!important;
  margin-top:.4rem;
}
.hpv1__signin .dropdown-menu .dropdown-divider{
  display:none;
}
.hpv1__signin .dropdown-menu .dropdown-item{
  display:flex;align-items:center;gap:.65rem;
  padding:.6rem 1.1rem!important;
  font-size:.88rem!important;font-weight:500!important;
  color:#0c0a09!important;background:transparent!important;
  text-decoration:none!important;letter-spacing:0!important;
  text-transform:none!important;
  transition:color .15s,background .15s,padding-left .2s;
  border:none!important;
}
.hpv1__signin .dropdown-menu .dropdown-item .material-icons{
  font-size:18px;color:#78716c;flex-shrink:0;margin:0!important;
  transition:color .15s;
}
.hpv1__signin .dropdown-menu .dropdown-item:hover,
.hpv1__signin .dropdown-menu .dropdown-item:focus{
  background:#fafaf9!important;color:#dc2626!important;
  padding-left:1.4rem!important;
}
.hpv1__signin .dropdown-menu .dropdown-item:hover .material-icons,
.hpv1__signin .dropdown-menu .dropdown-item:focus .material-icons{
  color:#dc2626;
}
/* Logout — last item, separated, red */
.hpv1__signin .dropdown-menu .dropdown-item[href*="logout"]{
  color:#dc2626!important;font-weight:600!important;
  margin-top:.4rem;padding-top:.85rem!important;
  border-top:1px solid #e7e5e4!important;
}
.hpv1__signin .dropdown-menu .dropdown-item[href*="logout"] .material-icons{
  color:#dc2626;
}
.hpv1__signin .dropdown-menu .dropdown-item[href*="logout"]:hover{
  background:#fef2f2!important;
}
.hpv1__icon{
  width:42px;height:42px;border-radius:50%;background:transparent;
  border:none;display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;color:#0c0a09;text-decoration:none;position:relative;
  transition:color .15s;
}
.hpv1__icon:hover{color:#dc2626;}
.hpv1__badge{
  position:absolute;top:-4px;right:-4px;background:#dc2626;color:#fff;
  font-size:.62rem;font-weight:700;width:18px;height:18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
.hpv1__menu-toggle{display:none;}

/* The megamenu's own mobile toggle (ybc-menu-toggle) lives inside both our
   .hpv1__nav and .mmpv2 wrappers — but the module also tries to materialise
   it on its own at small viewports. Hide it globally; we drive the mobile
   menu from .hpv1__menu-toggle + .mmpv2 instead. */
.ybc-menu-toggle, .ybc-menu-vertical-button, .close_menu{display:none!important;}

/* Tablet + mobile share the same mode: hide the horizontal nav, show the
   hamburger toggle that opens the .mmpv2 drawer. Threshold 1199 covers up to
   landscape tablets (Bootstrap xl-). */
@media (max-width:1199px){
  .hpv1__top-right{display:none;}
  .hpv1__nav{display:none;}
  .hpv1__menu-toggle{
    display:inline-flex;align-items:center;justify-content:center;
    width:42px;height:42px;border-radius:50%;background:transparent;
    border:none;cursor:pointer;color:#0c0a09;
    transition:color .15s;
  }
  .hpv1__menu-toggle:hover{color:#dc2626;}
  .hpv1__main{padding:.7rem 1rem;gap:1rem;}
  .hpv1__logo{max-height:42px;}
  .hpv1__top-inner{padding:.45rem 1rem;justify-content:center;text-align:center;}
}

/* Header is fully sticky on mobile too — the dark topbar and the white nav
   strip both ride the scroll together. The previous collapse-on-scroll rule
   caused glitches on some viewports (and the user prefers the full chrome
   always visible), so we keep #header.is-scrolled as a hook for shadows only. */

/* --- Scroll-to-top floating button ----------------------------------------- */
.ikara-back-to-top{
  position:fixed;right:1rem;bottom:1rem;z-index:1030;
  width:42px;height:42px;border-radius:50%;
  background:rgba(12,10,9,.78);color:#fff;border:none;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 12px 28px -10px rgba(0,0,0,.4);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  opacity:0;transform:translateY(12px);pointer-events:none;
  transition:opacity .2s ease,transform .25s ease,background .15s;
}
.ikara-back-to-top.is-visible{opacity:1;transform:translateY(0);pointer-events:auto;}
.ikara-back-to-top:hover{background:#0c0a09;}
.ikara-back-to-top .material-icons{font-size:22px;}
/* Lift above the mobile buy bar on product pages so it doesn't overlap the
   sticky CTA. The bar is ~70px tall plus safe-area. */
/* Lifted above the pill buy-bar (bottom:.75rem + ~120px tall) so the two
   controls don't visually collide on product pages. */
body.page-product .ikara-back-to-top{bottom:calc(140px + env(safe-area-inset-bottom));}
@media(min-width:992px){
  .ikara-back-to-top{right:1.5rem;bottom:1.5rem;width:46px;height:46px;}
  .ikara-back-to-top .material-icons{font-size:24px;}
}

/* --- Mobile menu V2 — full-screen overlay big-typography (light) ------------ */
.mmpv2{
  position:fixed;inset:0;z-index:1090;
  height:100vh;height:100dvh;
  background:#fff;color:#0c0a09;
  /* Scroll the whole panel and pin head/foot with sticky. More reliable than
     scrolling a flex/grid child: the megamenu injects nested wrappers that
     break overflow-y on a constrained child container. */
  overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  /* New stacking context so head/foot z-indexes win against any z-index the
     megamenu's nested elements (.mm_menus_li hover bg z:100, etc.) bring. */
  isolation:isolate;
  font-family:'Inter',sans-serif;
}
.mmpv2[hidden]{display:none;}
.mmpv2__head{
  position:sticky;top:0;z-index:9999;background:#fff;
  display:flex;justify-content:space-between;align-items:center;
  padding:1.1rem 1.25rem .25rem;
}
.mmpv2__brand img{max-height:36px;width:auto;display:block;}
.mmpv2__head-actions{
  display:flex;align-items:center;gap:.5rem;
}
.mmpv2__action,
.mmpv2__close{
  background:transparent;border:1px solid #e7e5e4;color:#0c0a09;
  width:38px;height:38px;border-radius:50%;
  line-height:1;cursor:pointer;padding:0;
  display:inline-flex;align-items:center;justify-content:center;
  text-decoration:none;
  transition:background .15s,color .15s,border-color .15s;
  position:relative;
}
.mmpv2__action .material-icons,
.mmpv2__close .material-icons{font-size:20px;}
.mmpv2__action:hover,
.mmpv2__action:active,
.mmpv2__close:hover,
.mmpv2__close:active{background:#0c0a09;color:#fff;border-color:#0c0a09;}
.mmpv2__action--lang.is-active{background:#0c0a09;color:#fff;border-color:#0c0a09;}
.mmpv2__action-badge{
  position:absolute;top:-4px;right:-4px;
  background:#dc2626;color:#fff;font-size:.6rem;font-weight:700;
  min-width:16px;height:16px;padding:0 4px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;line-height:1;
  font-family:'Inter',sans-serif;
}

/* Language popover — anchored under the head, slides down with a tiny fade.
   Sits above .mmpv2__list (z-index higher) so the list isn't clickable while
   the popover is open. Outside-click handler closes it. */
.mmpv2__lang-popover{
  position:absolute;top:calc(100% - .25rem);right:1.25rem;z-index:10000;
  background:#fff;border:1px solid #e7e5e4;border-radius:1rem;
  box-shadow:0 18px 40px -20px rgba(12,10,9,.25);
  min-width:220px;max-width:calc(100% - 2.5rem);
  padding:.85rem;
  animation:mmpv2-lang-in .18s ease both;
}
.mmpv2__lang-popover[hidden]{display:none;}
@keyframes mmpv2-lang-in{
  from{opacity:0;transform:translateY(-6px);}
  to{opacity:1;transform:translateY(0);}
}
.mmpv2__lang-popover-title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;
  color:#78716c;
  padding:.1rem .35rem .6rem;
}
.mmpv2__lang-popover-list{
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;gap:.15rem;
}
.mmpv2__lang-link{
  display:flex;align-items:center;gap:.7rem;
  padding:.6rem .65rem;border-radius:.55rem;
  text-decoration:none;color:#0c0a09;
  transition:background .15s,color .15s;
}
.mmpv2__lang-link:hover{background:#fafaf9;color:#0c0a09;}
.mmpv2__lang-link.is-current{background:#0c0a09;color:#fff;}
.mmpv2__lang-iso{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.7rem;letter-spacing:.12em;
  min-width:2.2rem;
  padding:.18rem .45rem;border-radius:.35rem;
  background:#fafaf9;color:#0c0a09;
  text-align:center;line-height:1;
}
.mmpv2__lang-link.is-current .mmpv2__lang-iso{background:rgba(255,255,255,.18);color:#fff;}
.mmpv2__lang-name{
  font-family:'Inter',sans-serif;font-weight:500;font-size:.95rem;flex:1;
}
.mmpv2__lang-check{font-size:18px!important;color:#fff;}
/* Flag emoji rendered inside the toggle button. Sized to fill the 38px
   circle nicely (emoji glyphs have generous internal padding). */
.mmpv2__lang-current-flag{
  font-size:18px;line-height:1;
  font-family:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji','Twemoji Mozilla',sans-serif;
}
/* Flag emoji prepended to each language row in the popover. */
.mmpv2__lang-flag{
  font-size:18px;line-height:1;flex-shrink:0;
  font-family:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji','Twemoji Mozilla',sans-serif;
}
.mmpv2__list{
  padding:1.5rem 1.25rem .5rem;
  position:relative;
}
/* Tiny editorial eyebrow above the menu list — red skewed bar plus label,
   for visual continuity with the rest of the redesign. The bar lives as a
   linear-gradient background since CSS can't nest pseudos. */
.mmpv2__list::before{
  content:"Navegación";
  display:block;
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:#78716c;
  margin-bottom:1.1rem;
  padding-left:32px;line-height:1.3;position:relative;
}
.mmpv2__list::after{
  content:"";position:absolute;left:1.25rem;top:calc(1.5rem + .15rem);
  width:24px;height:3px;background:#dc2626;transform:skewX(-20deg);
}
.mmpv2__list ul{list-style:none;margin:0;padding:0;}

/* The megamenu (ets_megamenu) drops its desktop markup in here. Flatten its
   wrappers and turn each top-level item into a big typographic row with a
   trailing arrow. */
.mmpv2 .ets_mm_megamenu,
.mmpv2 .ets_mm_megamenu_content,
.mmpv2 .ets_mm_megamenu_content_content,
.mmpv2 .container{
  background:transparent;width:100%;max-width:none;padding:0;margin:0;
  display:block;position:static;
}
.mmpv2 .ybc-menu-toggle,
.mmpv2 .close_menu,
.mmpv2 .mm_arrow,
.mmpv2 .arrow{display:none!important;}
.mmpv2 .mm_menus_ul{
  display:block!important;list-style:none;margin:0;padding:0;
  position:static!important;visibility:visible!important;opacity:1!important;
  background:transparent;border:none;box-shadow:none;
  max-height:none!important;
  /* Force the menu list to behave as a vertical stack regardless of how the
     megamenu lays out floated children. overflow:hidden alone won't clip in
     a sticky drawer context — we also clear floats with an inline ::after. */
  width:100%!important;
}
.mmpv2 .mm_menus_ul::after{
  content:"";display:block;clear:both;
}
.mmpv2 .mm_menus_li{
  display:block!important;margin:0!important;padding:0!important;background:transparent;
  border-bottom:1px solid #e7e5e4;
  /* When a section is open, drop both its own and the previous sibling's
     border-bottom so the expanded sublist doesn't read as a framed box. */
  /* The megamenu's own CSS sets float:left on top-level <li> (so they sit
     horizontally in the desktop nav). At ≥768px viewports the float wins
     against our `display:block` and the drawer collapses into 2-3 columns
     after the layout reflows on the second open. Strip all positioning. */
  float:none!important;clear:both!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  position:static!important;
}
.mmpv2 .mm_menus_li.is-open,
.mmpv2 .mm_menus_li:has(+ .mm_menus_li.is-open){
  border-bottom-color:transparent!important;
}
.mmpv2 .mm_menus_li > a.ets_mm_url{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:1.9rem!important;
  color:#0c0a09!important;text-decoration:none!important;
  padding:.6rem 0!important;
  display:flex!important;align-items:center;justify-content:space-between;
  border:none!important;
  letter-spacing:-.02em!important;line-height:1.15!important;
  background:transparent!important;border-radius:0!important;
  text-transform:none!important;
  /* Same float reset on the inner <a> — the megamenu's `.mm_menus_li > a`
     rule is float:left and a flex display alone doesn't override it. */
  float:none!important;width:100%!important;min-height:0!important;
  transition:color .15s,padding-left .25s;
}
.mmpv2 .mm_menus_li > a.ets_mm_url::after{
  content:"arrow_forward";
  font-family:'Material Icons';
  font-weight:normal;font-size:28px;letter-spacing:0;opacity:.4;
  margin-left:1rem;flex-shrink:0;
  transition:transform .25s,opacity .15s,color .15s;
}
.mmpv2 .mm_menus_li.mm_has_sub > a.ets_mm_url::after{content:"expand_more";}
.mmpv2 .mm_menus_li.is-open > a.ets_mm_url::after{transform:rotate(180deg);opacity:1;color:#dc2626;}
.mmpv2 .mm_menus_li > a.ets_mm_url:hover{color:#dc2626!important;padding-left:.5rem!important;}
.mmpv2 .mm_menus_li > a.ets_mm_url:hover::after{opacity:1;color:#dc2626;}
.mmpv2 .mm_menus_li > a.ets_mm_url .mm_menu_content_title{
  font:inherit!important;color:inherit!important;
  display:inline;
}

/* Submenu (mm_columns_ul) — collapsed by default, shown when the parent <li>
   gets .is-open via the accordion JS. We override every common visibility
   property the megamenu CSS may apply, since it ships rules for hover/desktop
   modes that can leave the submenu hidden even when display:block. */
.mmpv2 .mm_columns_ul{
  display:none!important;
  list-style:none;margin:0!important;padding:.5rem 0 .8rem!important;
  width:auto!important;max-width:none!important;min-width:0!important;
  position:static!important;top:auto!important;left:auto!important;right:auto!important;
  background:transparent!important;box-shadow:none!important;border:none!important;
  font-size:1rem!important;
  visibility:visible!important;opacity:1!important;
  max-height:none!important;height:auto!important;overflow:visible!important;
  transform:none!important;clip:auto!important;
}
.mmpv2 .mm_menus_li.is-open > .mm_columns_ul{display:block!important;}
.mmpv2 .mm_columns_li,
.mmpv2 .mm_blocks_ul,
.mmpv2 .mm_blocks_li{
  display:block!important;margin:0!important;padding:0!important;
  width:auto!important;float:none!important;list-style:none;
  border:none!important;background:transparent!important;
  min-height:0!important;
}
/* Drop blocks that don't fit a narrow drawer entirely (image previews and
   raw HTML/markdown decoration). Their parent <li.mm_blocks_li> is also
   collapsed so they don't leave a vertical gap. */
.mmpv2 .mm_block_type_image,
.mmpv2 .mm_block_type_html{display:none!important;}
.mmpv2 .mm_blocks_li:has(> .mm_block_type_image),
.mmpv2 .mm_blocks_li:has(> .mm_block_type_html){display:none!important;}
/* Generic .ets_mm_block reset — kill any padding/border the megamenu adds */
.mmpv2 .ets_mm_block,
.mmpv2 .ets_mm_block_content{
  padding:0!important;margin:0!important;border:none!important;
  background:transparent!important;
}
.mmpv2 .clearfix{display:none!important;}
/* Block titles act as group labels when present */
.mmpv2 .ets_mm_block h4{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.72rem!important;
  letter-spacing:.18em;text-transform:uppercase;
  color:#78716c!important;
  margin:.6rem 0 .2rem!important;padding:0!important;
}
/* Category links inside submenu */
.mmpv2 .ets_mm_categories{
  list-style:none;margin:0!important;padding:0!important;
  /* Kill the box-shadow the megamenu adds on .has-sub > .ets_mm_categories
     and any border the layouts may stack. We want a flat list inside the
     drawer, no outer frame. */
  box-shadow:none!important;border:none!important;background:transparent!important;
  display:block!important;
  /* Reset any column rules the megamenu CSS may apply at certain breakpoints
     so the list always renders as a single vertical stack. */
  columns:auto!important;column-count:1!important;column-gap:0!important;
}
.mmpv2 .ets_mm_categories li,
.mmpv2 .ets_mm_block_content ul li,
.mmpv2 .ets_mm_block_content ul li:not(.item_has_img){
  /* Megamenu's own CSS sets float:left + clear:both on these li, which
     mostly stacks them — but jQuery's slideDown leaves inline styles on the
     parent that, on tablet, leak through and let the floats wrap into 2/3
     columns on reopen. Force a vertical stack unconditionally. */
  display:block!important;float:none!important;clear:none!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  margin:0!important;padding:0!important;
  position:static!important;
}
.mmpv2 .ets_mm_categories a{
  display:block!important;
  padding:.4rem 0!important;
  font-family:'Inter',sans-serif!important;
  font-size:1rem!important;font-weight:500!important;
  color:#57534e!important;text-decoration:none!important;
  letter-spacing:0!important;
  transition:color .15s,padding-left .2s;
}
.mmpv2 .ets_mm_categories a:hover{color:#0c0a09!important;padding-left:.4rem!important;}

/* Static fallback links rendered when the megamenu is unavailable */
.mmpv2__list > a{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:1.9rem;color:#fff;text-decoration:none;
  padding:.6rem 0;
  display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid #292524;
  letter-spacing:-.02em;
  transition:color .15s,padding-left .25s;
}
.mmpv2__list > a:hover{color:#dc2626;padding-left:.5rem;}

/* =============================================================================
   FOOTER V3 — RACING / BIG TYPO
   Applied through _partials/footer.tpl. The <footer id="footer" class="footer">
   wrapper from the layout stays, we only style its inner content.
   ========================================================================== */
.f3{
  background:#0c0a09;color:#fff;position:relative;overflow:hidden;
  font-family:'Inter',sans-serif;
}
.f3::before{
  content:"IKARASPORT";
  position:absolute;bottom:-3rem;left:-1rem;
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:800;
  font-size:18rem;color:#fff;opacity:.04;letter-spacing:-.05em;line-height:1;
  white-space:nowrap;pointer-events:none;
}
.f3__main{padding:5rem 2rem 3rem;position:relative;z-index:1;}
.f3__main-inner{
  max-width:1400px;margin:0 auto;
  display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:3rem;
}
.f3__hero h2{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:800;
  font-size:2.8rem;letter-spacing:-.04em;line-height:1.05;
  margin:0 0 1rem;color:#fff!important;
}
.f3__hero h2 em{font-style:normal;color:inherit;}
.f3__hero p{
  color:#a8a29e;font-size:.95rem;max-width:340px;margin:0 0 1.6rem;
}
/* Social row — wraps the ps_socialfollow widget. The module renders an <ul>
   of <li><a><i class="icon-..."></i></a></li>; we flatten to a flex row of
   round buttons. */
.f3__social .block-social,
.f3__social ul{
  display:flex;gap:.5rem;list-style:none;margin:0;padding:0;
}
.f3__social li{margin:0;padding:0;list-style:none;}
.f3__social a{
  width:42px;height:42px;border-radius:50%;
  background:#1c1917;color:#fff;
  display:flex;align-items:center;justify-content:center;
  text-decoration:none;border:1px solid #292524;
  transition:background .2s,border-color .2s,transform .2s;
}
.f3__social a:hover{background:#dc2626;border-color:#dc2626;transform:translateY(-2px);}
.f3__social a span,
.f3__social a i{color:#fff;font-size:1rem;}

.f3__col h4{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
  color:#fff!important;font-size:.78rem;letter-spacing:.18em;
  text-transform:uppercase;margin:0 0 1.2rem;
  display:flex;align-items:center;gap:.5rem;
}
.f3__col h4::before{
  content:"";width:24px;height:3px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;
}
.f3__col ul{list-style:none;margin:0;padding:0;}
.f3__col li{margin:0 0 .65rem;}
.f3__col a{
  color:#d6d3d1;text-decoration:none;font-size:.88rem;display:block;
  transition:color .15s,padding-left .2s;
}
.f3__col a:hover{color:#fff;padding-left:.4rem;}

.f3__after{padding:1rem 2rem;position:relative;z-index:1;}

.f3__bottom{
  padding:1.5rem 2rem;border-top:1px solid #292524;
  background:rgba(0,0,0,.4);position:relative;z-index:1;
}
.f3__bottom-inner{
  max-width:1400px;margin:0 auto;
  display:flex;justify-content:space-between;align-items:center;
  color:#fff;font-size:.76rem;flex-wrap:wrap;gap:1rem;
}
.f3__copy a{color:#d6d3d1;text-decoration:none;margin-left:.85rem;}
.f3__copy a:hover{color:#fff;}
.f3__pay{display:flex;gap:.45rem;}
.f3__pay span{
  background:#1c1917;color:#d6d3d1;
  padding:.3rem .55rem;border-radius:.25rem;
  font-size:.7rem;font-weight:600;border:1px solid #292524;
  letter-spacing:.05em;
}

/* The legacy <footer id="footer" class="footer"> shell may have its own
   padding/background from the theme — neutralise it so f3 owns the chrome. */
#footer.footer:has(.f3){padding:0;background:transparent;}

@media (max-width:991px){
  .f3__main-inner{grid-template-columns:1fr 1fr;gap:2.5rem;}
  .f3__hero{grid-column:1 / -1;}
  .f3__hero h2{font-size:2.2rem;}
}
@media (max-width:600px){
  .f3__main{padding:3.5rem 1.25rem 2rem;}
  /* 2 columns instead of 1 — the previous full-stack made the footer way
     too long on iPhone-class screens. The 3 link blocks flow row 1: cols
     1+2, row 2: col 3 (alone, left-aligned). Hero stays full-width. */
  .f3__main-inner{grid-template-columns:1fr 1fr;gap:1.75rem 1.25rem;}
  .f3__hero{grid-column:1 / -1;}
  .f3__hero h2{font-size:1.85rem;}
  .f3__col h4{font-size:.72rem;letter-spacing:.16em;margin-bottom:.9rem;}
  .f3__col a{font-size:.82rem;}
  .f3__col li{margin-bottom:.5rem;}
  .f3::before{font-size:10rem;bottom:-1.5rem;}
  .f3__bottom{padding:1.2rem 1.25rem;}
  .f3__bottom-inner{flex-direction:column;align-items:flex-start;}
}

/* --- Newsletter (ps_emailsubscription) inside footer V3 ---------------------
   Editorial light: flat dark background continuous with the footer, eyebrow
   with red skewed bar, big title on the left and the input + submit on the
   right (single row on desktop, stacked on mobile). No white panel, no
   contrast break — the form sits inline on the footer. */
.f3__newsletter{
  padding:0 2rem 3.5rem;
  position:relative;z-index:1;
}
.f3__newsletter-inner{
  max-width:1400px;margin:0 auto;
  border-top:1px solid #292524;
  padding-top:3rem;
  display:grid;grid-template-columns:1fr minmax(340px,520px);
  gap:3rem;align-items:start;
}
.f3__newsletter-copy{display:flex;flex-direction:column;gap:.85rem;}
/* Eyebrow */
.f3__newsletter h4{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
  color:#fff!important;font-size:.78rem;letter-spacing:.18em;
  text-transform:uppercase;margin:0;
  display:flex;align-items:center;gap:.55rem;
}
.f3__newsletter h4::before{
  content:"";width:24px;height:3px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;display:inline-block;
}
.f3__newsletter h3{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:800;
  font-size:1.85rem;color:#fff!important;letter-spacing:-.025em;
  line-height:1.1;margin:0;max-width:560px;
  text-transform:none;
}
.f3__newsletter-form{align-self:end;}
/* Strip the PS module's wrappers — we render its <form> as a flat row. */
.f3 .f3__newsletter-form .ps-emailsubscription,
.f3 .f3__newsletter-form .ps-emailsubscription.bg-body-tertiary,
.f3 .f3__newsletter-form section.ps-emailsubscription{
  /* Force the footer's own dark color — Bootstrap's .bg-body-tertiary
     cascades through some layer/CSS-var setup that makes a plain `transparent`
     not stick, so we paint it explicitly with the footer background. */
  background:#0c0a09!important;background-color:#0c0a09!important;
  --bs-bg-opacity:0!important;
  border:none!important;border-radius:0!important;
  padding:0!important;margin:0!important;box-shadow:none!important;
}
.f3 .f3__newsletter-form .ps-emailsubscription .container,
.f3 .f3__newsletter-form .ps-emailsubscription .row{
  max-width:none!important;width:auto!important;margin:0!important;padding:0!important;
  display:block!important;
}
/* Hide the module's stock copy — our copy lives on the left column. */
.f3 .f3__newsletter-form .ps-emailsubscription .h3,
.f3 .f3__newsletter-form .ps-emailsubscription h3,
.f3 .f3__newsletter-form .block_newsletter h4,
.f3 .f3__newsletter-form .email_subscription h4{display:none!important;}
.f3 .f3__newsletter-form form{
  display:block!important;width:100%!important;margin:0!important;padding:0!important;
}
/* Form row: positioning context for the absolute submit. */
.f3 .f3__newsletter-form form > div,
.f3 .f3__newsletter-form form > div.d-flex{
  display:block!important;position:relative!important;
  background:transparent!important;border:none!important;
  margin:0!important;padding:0!important;gap:0!important;
}
/* Input — pill, transparent dark with white border (continuous with footer) */
.f3 .f3__newsletter-form input[type="email"],
.f3 .f3__newsletter-form .form-control{
  width:100%!important;display:block!important;
  background:transparent!important;background-color:transparent!important;
  color:#fff!important;
  border:1px solid #fff!important;border-radius:999px!important;
  padding:1rem 10rem 1rem 1.5rem!important;margin:0!important;
  font-family:'Inter',sans-serif!important;font-size:.95rem!important;
  outline:none!important;box-shadow:none!important;
  height:auto!important;line-height:1.4!important;
  transition:border-color .15s,box-shadow .15s;
}
.f3 .f3__newsletter-form input[type="email"]::placeholder,
.f3 .f3__newsletter-form .form-control::placeholder{color:#fff!important;opacity:1;}
.f3 .f3__newsletter-form input[type="email"]:focus,
.f3 .f3__newsletter-form .form-control:focus{
  background:transparent!important;color:#fff!important;
  border-color:#dc2626!important;
  box-shadow:0 0 0 3px rgba(220,38,38,.18)!important;
}
/* Submit — red pill inside the input on the right. */
.f3 .f3__newsletter-form input[type="submit"],
.f3 .f3__newsletter-form .btn,
.f3 .f3__newsletter-form .btn-primary{
  position:absolute!important;top:50%!important;right:.35rem!important;
  transform:translateY(-50%)!important;
  background:#dc2626!important;background-color:#dc2626!important;
  color:#fff!important;border:none!important;
  border-radius:999px!important;
  padding:.7rem 1.4rem!important;margin:0!important;
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:.72rem!important;
  letter-spacing:.15em!important;text-transform:uppercase!important;
  cursor:pointer;line-height:1.4!important;white-space:nowrap;
  height:auto!important;min-height:0!important;
  box-shadow:none!important;
  transition:background .2s,color .2s;
}
.f3 .f3__newsletter-form input[type="submit"]:hover,
.f3 .f3__newsletter-form .btn-primary:hover{
  background:#fff!important;color:#0c0a09!important;
}
/* Disclaimer — white. Bootstrap renders `.text-body-secondary` as
   `color: var(--bs-secondary-color) !important`, so plain rule overrides
   lose to it under some cascade ordering. We override the CSS variable on
   the newsletter wrapper instead — the !important rule resolves the var to
   white and our color sticks. */
.f3 .f3__newsletter-form{
  --bs-secondary-color:#fff;
  --bs-body-secondary-color-rgb:255,255,255;
}
.f3 .f3__newsletter-form .ps-emailsubscription p,
.f3 .f3__newsletter-form .text-body-secondary,
.f3 .f3__newsletter-form .gdpr_consent{
  color:#fff!important;
}
.f3 .f3__newsletter-form .ps-emailsubscription p{
  font-size:.72rem!important;
  margin:.85rem 0 0!important;line-height:1.55;padding:0!important;
}
.f3 .f3__newsletter-form .ps-emailsubscription a{
  color:#fff!important;text-decoration:underline;
}
.f3__newsletter-form .notification,
.f3__newsletter-form .alert{
  margin:.65rem 0 0!important;padding:.65rem 1rem!important;
  font-size:.82rem!important;border-radius:.6rem!important;display:block;border:none!important;
}
.f3__newsletter-form .notification-success,
.f3__newsletter-form .alert-success{background:rgba(34,197,94,.12)!important;color:#86efac!important;}
.f3__newsletter-form .notification-error,
.f3__newsletter-form .alert-danger{background:rgba(220,38,38,.12)!important;color:#fca5a5!important;}

/* Tablet & mobile: stack copy/form, and break the submit pill onto its own
   row below the input. The PS9 widget wraps input+submit in a `.d-flex`
   row — we flip the direction to column so the submit drops below instead
   of squeezing next to the input. */
@media (max-width:991px){
  .f3__newsletter-inner{grid-template-columns:1fr;gap:1.5rem;}
  .f3__newsletter-form{align-self:auto;}
  .f3__newsletter h3{font-size:1.45rem;}
  .f3 .f3__newsletter .f3__newsletter-form form > div,
  .f3 .f3__newsletter .f3__newsletter-form form > div.d-flex{
    display:flex!important;flex-direction:column!important;
    align-items:stretch!important;gap:.6rem!important;
  }
  .f3 .f3__newsletter-form input[type="email"],
  .f3 .f3__newsletter-form .form-control{
    width:100%!important;padding:.95rem 1.25rem!important;
  }
  .f3 .f3__newsletter-form input[type="submit"],
  .f3 .f3__newsletter-form .btn,
  .f3 .f3__newsletter-form .btn-primary{
    position:static!important;transform:none!important;
    width:100%!important;margin:0!important;
    padding:.95rem 1rem!important;font-size:.78rem!important;
  }
}
@media (max-width:600px){
  .f3__newsletter{padding:0 1.25rem 2.5rem;}
  .f3__newsletter-inner{padding-top:2.25rem;}
  .f3__newsletter h3{font-size:1.25rem;line-height:1.15;}
}

/* =============================================================================
   ets_megamenu — DISCIPLINAS dropdown (V1 Editorial cards)
   Activated when the BO menu has custom_class="ikara-disciplinas" or its title
   contains "DISCIPLIN". The override template emits BOTH the V1 card AND the
   module's default mobile markup; CSS shows one or the other by viewport.
   Everything is scoped under `.mm_menus_li.ikara-disciplinas` so it doesn't
   leak into other menus.
   ========================================================================== */
/* Mobile: hide V1 card, default markup stays */
.mm_menus_li.ikara-disciplinas .ikmm-disc__card{display:none;}
.mm_menus_li.ikara-disciplinas .ikmm-disc__mobile{display:block;}

@media (min-width:992px){
  /* Desktop: show V1 card, hide the default-render fallback */
  .mm_menus_li.ikara-disciplinas .ikmm-disc__card{display:flex;}
  .mm_menus_li.ikara-disciplinas .ikmm-disc__mobile{display:none!important;}
  /* Grid container layout — `display:grid` is applied only by the :hover/.open
     rule below, so the panel stays hidden (display:none from the module) when
     the trigger isn't hovered. */
  .mm_menus_li.ikara-disciplinas .mm_columns_ul.ikmm-disc{
    grid-template-columns:repeat(4,1fr)!important;
    gap:2.4rem!important;
    width:100%!important;max-width:1400px;margin:0 auto;
    padding:2.4rem!important;
    background:#fff!important;
    border:none!important;list-style:none;
    box-shadow:0 30px 60px -20px rgba(0,0,0,.25);
  }
  /* Reset the column li (the module's CSS adds flex/border/padding) */
  .mm_menus_li.ikara-disciplinas .mm_columns_ul.ikmm-disc > .mm_columns_li.ikmm-disc__cell{
    width:auto!important;flex:none!important;
    padding:0!important;margin:0!important;border:none!important;
    background:transparent!important;list-style:none;
  }
  /* The card — editorial light layout aligned with PRODUCTOS:
     image on top, eyebrow + title + subcategory list stacked below on white */
  .mm_menus_li.ikara-disciplinas .ikmm-disc__card{
    display:flex;flex-direction:column;
    background:transparent;
    color:#0c0a09;
    padding:0;
  }

  /* Thumbnail — keeps the image but presented as a discrete tile, not a card-fill */
  .mm_menus_li.ikara-disciplinas .ikmm-disc__thumb{
    display:block;
    aspect-ratio:4/3;
    background-color:#1c1917;
    background-size:cover;background-position:center;
    margin-bottom:1rem;
    position:relative;overflow:hidden;
    transition:transform .25s;
  }
  .mm_menus_li.ikara-disciplinas .ikmm-disc__thumb::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(220,38,38,0) 60%,rgba(220,38,38,.18));
    opacity:0;transition:opacity .25s;
  }
  .mm_menus_li.ikara-disciplinas .ikmm-disc__card:hover .ikmm-disc__thumb::after{opacity:1;}
  .mm_menus_li.ikara-disciplinas .ikmm-disc__card:hover .ikmm-disc__thumb{transform:scale(1.02);}

  /* Eyebrow — same red skewed bar pattern used by .ikmm-prod__title */
  .mm_menus_li.ikara-disciplinas .ikmm-disc__eyebrow{
    font-family:'Space Grotesk','Inter',sans-serif!important;font-weight:700!important;
    font-size:.78rem!important;letter-spacing:.18em!important;
    text-transform:uppercase!important;color:#0c0a09!important;
    margin:0 0 .65rem!important;padding:0!important;
    display:flex;align-items:center;gap:.5rem;line-height:1.3;
    background:transparent!important;border:none!important;
  }
  .mm_menus_li.ikara-disciplinas .ikmm-disc__eyebrow::before{
    content:"";width:24px;height:3px;background:#dc2626;
    transform:skewX(-20deg);flex-shrink:0;display:inline-block;
  }

  /* Title — black, bold, Space Grotesk */
  .mm_menus_li.ikara-disciplinas .ikmm-disc__title{
    font-family:'Space Grotesk','Inter',sans-serif!important;font-weight:800!important;
    font-size:1.25rem!important;letter-spacing:-.02em!important;line-height:1.1!important;
    margin:0 0 .85rem!important;color:#0c0a09!important;
    text-transform:none!important;
  }
  .mm_menus_li.ikara-disciplinas .ikmm-disc__title a{
    color:#0c0a09!important;text-decoration:none!important;
    background:transparent!important;padding:0!important;
    transition:color .15s;
  }
  .mm_menus_li.ikara-disciplinas .ikmm-disc__title a:hover{color:#dc2626!important;}
  .mm_menus_li.ikara-disciplinas .ikmm-disc__card:hover .ikmm-disc__title a{color:#dc2626!important;}

  /* Subcategory list — same look as .ikmm-prod__list */
  .mm_menus_li.ikara-disciplinas .ikmm-disc__list{display:block;}
  .mm_menus_li.ikara-disciplinas .ikmm-disc__list .ets_mm_categories{
    list-style:none;margin:0;padding:0;
  }
  .mm_menus_li.ikara-disciplinas .ikmm-disc__list .ets_mm_categories > li{
    margin:0 0 .5rem;padding:0;list-style:none;background:transparent!important;
  }
  .mm_menus_li.ikara-disciplinas .ikmm-disc__list .ets_mm_categories a,
  .mm_menus_li.ikara-disciplinas .ikmm-disc__list .ets_mm_categories a.ets_mm_url{
    display:inline-flex!important;align-items:center;gap:.4rem;
    font-size:.85rem!important;color:#44403c!important;font-weight:500!important;
    text-decoration:none!important;letter-spacing:0!important;
    padding:0!important;margin:0!important;background:transparent!important;
    border:none!important;text-transform:none!important;
    transition:color .15s,gap .2s;
  }
  .mm_menus_li.ikara-disciplinas .ikmm-disc__list .ets_mm_categories a::after{
    content:"arrow_forward";font-family:'Material Icons';font-weight:normal;
    font-size:16px;line-height:1;color:#dc2626;
    opacity:0;transform:translateX(-6px);
    transition:opacity .18s,transform .18s;
  }
  .mm_menus_li.ikara-disciplinas .ikmm-disc__list .ets_mm_categories a:hover{
    color:#dc2626!important;gap:.65rem;
  }
  .mm_menus_li.ikara-disciplinas .ikmm-disc__list .ets_mm_categories a:hover::after{
    opacity:1;transform:translateX(0);
  }
  /* Hide nested category arrows/sublists if present (keep the list flat) */
  .mm_menus_li.ikara-disciplinas .ikmm-disc__list .arrow,
  .mm_menus_li.ikara-disciplinas .ikmm-disc__list .ets_mm_categories ul{display:none!important;}

  /* Module's outer hover panel: keep a clean page-wide white background. */
  .mm_menus_li.ikara-disciplinas:hover > .mm_columns_ul.ikmm-disc,
  .mm_menus_li.ikara-disciplinas.open > .mm_columns_ul.ikmm-disc{display:grid!important;}
}

/* =============================================================================
   ets_megamenu — full-viewport-width dropdown panels (desktop only)
   The module positions .mm_columns_ul absolutely. We want the panel anchored
   against the full-width #header so it spans the viewport.
   Two pieces are needed:
   1. #header must establish a containing block — position:sticky alone does
      not, so we add `contain: layout` (creates a CB without altering sticky).
   2. The intermediate wrapper `.ets_mm_megamenu_content_content` carries
      position:relative from the module/theme, which would capture our absolute
      panel. We override it to static on desktop so the panel reaches #header.
   We also strip the default 10px gap and add a hover bridge so the cursor can
   cross from the trigger to the panel without losing :hover.
   Show-on-hover is enforced here because the module's only "open" trigger is
   `.mm_menus_li.hover:hover .mm_columns_ul { display:block }`, and we need
   `display:grid` to keep the V1/V2 layouts working.
   ========================================================================== */
@media (min-width:992px){
  /* Establish containing block on #header for the absolute panel */
  #header{contain:layout;}
  /* Neutralize the module's intermediate `position:relative` and the wrapper's
     `position:sticky` (it would otherwise capture our absolute panel and limit
     its width to the wrapper, ~1065px instead of full viewport). */
  .hpv1__nav .ets_mm_megamenu{position:static!important;}
  .hpv1__nav .ets_mm_megamenu_content_content{position:static!important;}

  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-disciplinas,
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-productos{
    position:static!important;
  }
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-disciplinas > .mm_columns_ul.ikmm-disc,
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-productos > .mm_columns_ul.ikmm-prod{
    position:absolute!important;
    left:0!important;right:0!important;top:100%!important;
    width:auto!important;max-width:none!important;
    margin:0!important;padding-top:0!important;
    border:none!important;
    border-top:1px solid #e7e5e4!important;
  }
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-disciplinas > .mm_columns_ul.ikmm-disc{
    padding:2rem max(2rem, calc((100% - 1400px) / 2))!important;
  }
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-productos > .mm_columns_ul.ikmm-prod{
    padding:2.4rem max(2rem, calc((100% - 1400px) / 2))!important;
  }
  /* Show on hover/.open — overrides the module's display:block with grid so
     the V1/V2 layouts apply, and beats the base display:none. */
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-disciplinas:hover > .mm_columns_ul.ikmm-disc,
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-disciplinas.open > .mm_columns_ul.ikmm-disc,
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-productos:hover > .mm_columns_ul.ikmm-prod,
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-productos.open > .mm_columns_ul.ikmm-prod{
    display:grid!important;visibility:visible!important;opacity:1!important;
    pointer-events:auto!important;
  }
  /* Hover bridge: a transparent strip just above the panel that captures the
     mouse while it crosses from the link to the dropdown. Sits inside the
     panel so it inherits its hover/visibility state. */
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-disciplinas > .mm_columns_ul.ikmm-disc::before,
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.ikara-productos > .mm_columns_ul.ikmm-prod::before{
    content:"";position:absolute;left:0;right:0;top:-24px;height:24px;
    background:transparent;pointer-events:auto;
  }
  /* Strip the module's default 10px gap on every dropdown so hover never
     breaks while moving down from the trigger. */
  .hpv1__nav .ets_mm_megamenu .mm_columns_ul{
    margin-top:0!important;
  }
  /* Extend the trigger's clickable area downwards so the link itself reaches
     the panel — the :hover state on the li never lapses. */
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.mm_has_sub > a.ets_mm_url{
    position:relative;
  }
  .hpv1__nav .ets_mm_megamenu .mm_menus_li.mm_has_sub > a.ets_mm_url::after{
    content:"";position:absolute;left:0;right:0;bottom:-24px;height:24px;
    background:transparent;z-index:1;
  }
}

/* =============================================================================
   ets_megamenu — PRODUCTOS dropdown (V2 Magazine index)
   Same dual-emit pattern as DISCIPLINAS: V1 group on desktop, default mobile
   markup preserved underneath. Activated by custom_class="ikara-productos" or
   title containing "PRODUCTO".
   ========================================================================== */
/* Mobile: hide V2 group, default markup stays */
.mm_menus_li.ikara-productos .ikmm-prod__group,
.mm_menus_li.ikara-productos .ikmm-prod__cta-li{display:none;}
.mm_menus_li.ikara-productos .ikmm-prod__mobile{display:block;}

@media (min-width:992px){
  .mm_menus_li.ikara-productos .ikmm-prod__group{display:block;}
  .mm_menus_li.ikara-productos .ikmm-prod__cta-li{display:block;}
  .mm_menus_li.ikara-productos .ikmm-prod__mobile{display:none!important;}

  /* `display:grid` is applied only on hover (see the rule near the bottom of
     this block) — without it the module's `display:none` keeps the panel
     collapsed. */
  .mm_menus_li.ikara-productos .mm_columns_ul.ikmm-prod{
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr))!important;
    gap:2rem 2.4rem!important;
    width:100%!important;max-width:1400px;margin:0 auto;
    padding:2.4rem!important;
    background:#fff!important;
    border:none!important;list-style:none;
    box-shadow:0 30px 60px -20px rgba(0,0,0,.25);
  }
  .mm_menus_li.ikara-productos .mm_columns_ul.ikmm-prod > .mm_columns_li.ikmm-prod__cell{
    width:auto!important;flex:none!important;
    padding:0!important;margin:0!important;border:none!important;
    background:transparent!important;list-style:none;
  }

  .mm_menus_li.ikara-productos .ikmm-prod__title{
    font-family:'Space Grotesk','Inter',sans-serif!important;font-weight:700!important;
    font-size:.78rem!important;letter-spacing:.18em!important;
    text-transform:uppercase!important;color:#0c0a09!important;
    margin:0 0 1rem!important;padding:0!important;
    display:flex;align-items:center;gap:.5rem;line-height:1.3;
    background:transparent!important;border:none!important;
  }
  .mm_menus_li.ikara-productos .ikmm-prod__title::before{
    content:"";width:24px;height:3px;background:#dc2626;
    transform:skewX(-20deg);flex-shrink:0;display:inline-block;
  }
  .mm_menus_li.ikara-productos .ikmm-prod__list{display:block;}
  .mm_menus_li.ikara-productos .ikmm-prod__list .ets_mm_categories{
    list-style:none;margin:0 0 .55rem;padding:0;
  }
  .mm_menus_li.ikara-productos .ikmm-prod__list .ets_mm_categories > li{
    margin:0 0 .55rem;padding:0;list-style:none;background:transparent!important;
  }
  .mm_menus_li.ikara-productos .ikmm-prod__list .ets_mm_categories a,
  .mm_menus_li.ikara-productos .ikmm-prod__list .ets_mm_categories a.ets_mm_url{
    display:inline-flex!important;align-items:center;gap:.4rem;
    font-size:.85rem!important;color:#44403c!important;font-weight:500!important;
    text-decoration:none!important;letter-spacing:0!important;
    padding:0!important;margin:0!important;background:transparent!important;
    border:none!important;text-transform:none!important;
    transition:color .15s,gap .2s;
  }
  .mm_menus_li.ikara-productos .ikmm-prod__list .ets_mm_categories a::after{
    content:"arrow_forward";font-family:'Material Icons';font-weight:normal;
    font-size:16px;line-height:1;color:#dc2626;
    opacity:0;transform:translateX(-6px);
    transition:opacity .18s,transform .18s;
  }
  .mm_menus_li.ikara-productos .ikmm-prod__list .ets_mm_categories a:hover{
    color:#dc2626!important;gap:.65rem;
  }
  .mm_menus_li.ikara-productos .ikmm-prod__list .ets_mm_categories a:hover::after{
    opacity:1;transform:translateX(0);
  }
  .mm_menus_li.ikara-productos .ikmm-prod__list .arrow,
  .mm_menus_li.ikara-productos .ikmm-prod__list .ets_mm_categories ul{display:none!important;}

  /* Bottom CTA spans all columns */
  .mm_menus_li.ikara-productos .ikmm-prod__cta-li{
    grid-column:1 / -1;
    border-top:1px solid #e7e5e4;
    margin:.5rem 0 0!important;padding:1.4rem 0 0!important;
    list-style:none;background:transparent!important;
  }
  .mm_menus_li.ikara-productos .ikmm-prod__cta{
    display:inline-flex;align-items:center;gap:.5rem;
    font-family:'Space Grotesk','Inter',sans-serif!important;
    font-weight:700!important;font-size:.78rem!important;
    letter-spacing:.15em!important;text-transform:uppercase!important;
    color:#0c0a09!important;text-decoration:none!important;
    transition:color .15s,gap .2s;
    background:transparent!important;border:none!important;padding:0!important;
  }
  .mm_menus_li.ikara-productos .ikmm-prod__cta:hover{color:#dc2626!important;gap:.85rem;}
  .mm_menus_li.ikara-productos .ikmm-prod__cta .material-icons{font-size:18px;}
}

/* =============================================================================
   Cart & checkout — match the editorial light vocabulary used by the demos
   (Inter + Space Grotesk, #0c0a09 / #dc2626, sharp 1px borders, eyebrow with
   skewed red bar). Scoped to body classes so it can't leak elsewhere.
   ========================================================================== */
body.page-cart,
body.page-order,
body.page-order-confirmation,
body.page-authentication{
  font-family:'Inter',sans-serif;
}

/* Listing — Load more button (replaces pagination when JS attaches) */
.cat-load-more{
  display:flex;justify-content:center;
  margin:2.5rem 0 1.5rem;
}
.cat-load-more__btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  background:#fff;color:#0c0a09;
  border:1px solid #0c0a09;border-radius:999px;
  padding:.85rem 2.4rem;
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.82rem;letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .15s,color .15s,opacity .2s;
  min-width:14rem;
}
.cat-load-more__btn:hover{background:#0c0a09;color:#fff;}
.cat-load-more__btn:disabled,
.cat-load-more__btn.is-loading{cursor:default;}
.cat-load-more__btn.is-loading{opacity:.6;}
.cat-load-more.is-end .cat-load-more__btn{
  border-color:#d6d3d1;color:#a8a29e;background:transparent;
}
.cat-load-more.is-end .cat-load-more__btn:hover{
  background:transparent;color:#a8a29e;
}
body.has-load-more .cat-pagination{display:none!important;}

/* H1 — page title */
body.page-cart .page-title-section,
body.page-order .page-title-section,
body.page-order-confirmation .page-title-section,
body.page-authentication .page-title-section,
body.page-cart h1.page-title-section,
body.page-order h1.h1-title,
body.page-cart h1{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:2.5rem;letter-spacing:-.03em;line-height:1.05;
  color:#0c0a09;margin:3rem 0 1.75rem;
}

/* H2 — section heading with red skewed bar prefix (matches .f3__col h4) */
body.page-cart .cart-grid__aside-wrapper > h2,
body.page-cart .cart-grid__aside-wrapper > h3,
body.page-order .cart-grid__aside-wrapper > h2,
body.page-order .checkout-step-title,
body.page-order h2.step-title,
body.page-order .step-title,
body.page-cart h2:not(.section-title){
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:1rem;letter-spacing:.16em;text-transform:uppercase;
  color:#0c0a09;margin:0 0 1.25rem;
  display:flex;align-items:center;gap:.6rem;
}
body.page-cart .cart-grid__aside-wrapper > h2::before,
body.page-cart .cart-grid__aside-wrapper > h3::before,
body.page-order .cart-grid__aside-wrapper > h2::before,
body.page-order .checkout-step-title::before,
body.page-order h2.step-title::before,
body.page-order .step-title::before,
body.page-cart h2:not(.section-title)::before{
  content:"";width:24px;height:3px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;
}

/* Section title for "Productos destacados" etc. — heavier, no eyebrow */
body.page-cart .section-title,
body.page-order .section-title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:1.6rem;letter-spacing:-.025em;
  color:#0c0a09;margin:0 0 1.5rem;text-transform:none;
}

/* Right-column wrapper as a clean card */
body.page-cart .cart-grid__aside-wrapper,
body.page-order .cart-grid__aside-wrapper{
  background:#fff;
  border:1px solid #e7e5e4;
  padding:1.75rem;
  border-radius:1.25rem;
  /* Sticky behavior: clear hpv1 header at the top, cap height to viewport so
     it never overflows past the visible area (and so the bottom edge can't
     land underneath the page footer or the sticky chrome on long scroll).
     `top` must exceed the real desktop header height (~134px = topbar 40 +
     main 94); 7.5rem (120px) was too low and the header clipped the panel.
     z-index stays well below the header (1000) so the chrome always wins. */
  position:sticky;top:9rem;z-index:1;
  max-height:calc(100vh - 10.5rem);
  overflow-y:auto;
  /* Vertical offset so the H2 "Resumen del pedido" lines up with the first
     product row in the left column (which sits below the H1 "Carrito").
     Without this, the H2 would float above the H1 baseline and the columns
     read as misaligned. The offset must stay inside the column (via margin
     on the wrapper, not align-self on the col) so the sticky containing
     block remains taller than the wrapper — otherwise sticky has no room. */
  margin-top:4.5rem;
}
body.page-cart .cart-grid__aside-wrapper > hr,
body.page-order .cart-grid__aside-wrapper > hr{
  border:none;border-top:1px solid #e7e5e4;margin:1.5rem 0;
}

/* Cart summary — flatten the wrapper containers (Bootstrap injects vertical
   padding+border on .cart-summary__subtotals and .cart-summary__total which
   stack on top of our line spacing and create the impression of empty rows
   between the values and the dividers). Strip them so only our line padding
   contributes vertical rhythm. */
body.page-cart .cart-summary__subtotals,
body.page-order .cart-summary__subtotals,
body.page-cart .cart-summary__total,
body.page-order .cart-summary__total{
  margin:0!important;padding:0!important;border:none!important;
}

/* Cart summary lines — compact, no trailing dashed border (the bold total's
   black top border is enough separation, no visual debt needed below). */
body.page-cart .cart-summary__line,
body.page-order .cart-summary__line{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:.4rem 0;border-bottom:none;
  font-size:.92rem;color:#44403c;
}
body.page-cart .cart-summary__line .cart-summary__label,
body.page-order .cart-summary__line .cart-summary__label{
  color:#57534e;font-weight:500;
}
body.page-cart .cart-summary__line .cart-summary__value,
body.page-order .cart-summary__line .cart-summary__value{
  color:#0c0a09;font-weight:600;font-variant-numeric:tabular-nums;
}
body.page-cart .cart-summary__line--bold,
body.page-order .cart-summary__line--bold{
  margin-top:.4rem;padding-top:.7rem;border-top:1px solid #0c0a09;
  border-bottom:none!important;font-size:1.05rem;
}
body.page-cart .cart-summary__line--bold .cart-summary__label,
body.page-order .cart-summary__line--bold .cart-summary__label{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;color:#0c0a09;font-size:.85rem;
}
body.page-cart .cart-summary__line--bold .cart-summary__value,
body.page-order .cart-summary__line--bold .cart-summary__value{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:800;
  font-size:1.4rem;color:#0c0a09;letter-spacing:-.01em;
}

/* Buttons — primary red, outline dark. Scope to cart/checkout to avoid
   touching the new chrome (header / megamenu / footer have their own). */
body.page-cart .btn-primary,
body.page-order .btn-primary,
body.page-order-confirmation .btn-primary,
body.page-authentication .btn-primary{
  background:#dc2626!important;background-color:#dc2626!important;
  border:1px solid #dc2626!important;color:#fff!important;
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:.85rem!important;
  letter-spacing:.12em!important;text-transform:uppercase!important;
  padding:.9rem 1.6rem!important;border-radius:.7rem!important;
  box-shadow:none!important;
  transition:background .2s,color .2s,border-color .2s;
}
body.page-cart .btn-primary:hover,
body.page-order .btn-primary:hover,
body.page-order-confirmation .btn-primary:hover,
body.page-authentication .btn-primary:hover{
  background:#0c0a09!important;background-color:#0c0a09!important;
  border-color:#0c0a09!important;color:#fff!important;
}
body.page-cart .btn-primary.disabled,
body.page-cart .btn-primary[disabled],
body.page-order .btn-primary.disabled,
body.page-order .btn-primary[disabled]{
  background:#a8a29e!important;background-color:#a8a29e!important;
  border-color:#a8a29e!important;cursor:not-allowed;
}

/* "Proceed to checkout" / "Continue" buttons throughout the cart and
   checkout steps. Red reads as danger, and we are inviting the user to
   complete the flow — keep these black. Hover stays black (slightly
   lighter shade) so the action never flashes red. */
body.page-cart .cart-summary__actions .btn-primary,
body.page-cart .js-cart-detailed-actions .btn-primary,
body.page-cart .cart__cta-checkout,
body.page-cart a[href$='/pedido'].btn-primary,
body.page-cart a[href$='/order'].btn-primary,
body.page-cart .cart-detailed-actions .btn-primary,
body.page-order section.step .btn-primary,
body.page-order section.step button[type="submit"].btn-primary,
body.page-order .checkout-step .btn-primary,
body.page-order .checkout-step button[type="submit"].btn-primary,
body.page-order .checkout-step .continue,
body.page-order .js-continue,
body.page-order button.continue.btn-primary{
  background:#0c0a09!important;background-color:#0c0a09!important;
  border-color:#0c0a09!important;color:#fff!important;
}
body.page-cart .cart-summary__actions .btn-primary:hover,
body.page-cart .js-cart-detailed-actions .btn-primary:hover,
body.page-cart .cart__cta-checkout:hover,
body.page-cart a[href$='/pedido'].btn-primary:hover,
body.page-cart a[href$='/order'].btn-primary:hover,
body.page-cart .cart-detailed-actions .btn-primary:hover,
body.page-order section.step .btn-primary:hover,
body.page-order section.step button[type="submit"].btn-primary:hover,
body.page-order .checkout-step .btn-primary:hover,
body.page-order .checkout-step button[type="submit"].btn-primary:hover,
body.page-order .checkout-step .continue:hover,
body.page-order .js-continue:hover,
body.page-order button.continue.btn-primary:hover{
  background:#1c1917!important;background-color:#1c1917!important;
  border-color:#1c1917!important;color:#fff!important;
}

body.page-cart .btn-outline-primary,
body.page-order .btn-outline-primary,
body.page-order-confirmation .btn-outline-primary,
body.page-authentication .btn-outline-primary{
  background:transparent!important;
  border:1px solid #0c0a09!important;color:#0c0a09!important;
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:.85rem!important;
  letter-spacing:.12em!important;text-transform:uppercase!important;
  padding:.9rem 1.6rem!important;border-radius:.7rem!important;
  box-shadow:none!important;
  display:inline-flex;align-items:center;gap:.5rem;
  transition:background .2s,color .2s;
}
body.page-cart .btn-outline-primary:hover,
body.page-order .btn-outline-primary:hover,
body.page-order-confirmation .btn-outline-primary:hover,
body.page-authentication .btn-outline-primary:hover{
  background:#0c0a09!important;color:#fff!important;
}
body.page-cart .btn-outline-primary .material-icons,
body.page-order .btn-outline-primary .material-icons{font-size:18px;}

/* Continue-shopping link — keep the icon spacing tight */
body.page-cart .cart__continue-shopping{margin:1.5rem 0 0;}

/* =============================================================================
   Product zoom modal (#product-modal, .product-images-modal) — desktop fix.
   The stock template wraps a Bootstrap carousel of product images; with an
   image like 1440×1728 (portrait) the .modal-dialog grows to ~1430px tall
   and the user has to scroll the page to see the whole picture, plus the
   close button drifts off-screen. We turn it into a proper lightbox: full-
   viewport dark backdrop, image constrained to the viewport with object-fit
   contain, close button anchored top-right, prev/next floating side arrows.
   ============================================================================= */
.product-images-modal{
  background:transparent;
}
/* Backdrop fully opaque when the zoom modal is open. Both the underlying
   page (z:0…1000) and Bootstrap's transition opacity get neutralized so the
   image is the only thing visible. Scoped via :has() so other modals keep
   their stock dim. */
body:has(.product-images-modal.show) .modal-backdrop{
  --bs-backdrop-opacity:1;
  opacity:1!important;
  background-color:#0c0a09!important;
  z-index:2000;
}
/* The redesigned sticky header has z-index:1000 + contain:layout, which puts
   it above Bootstrap's default backdrop (z-index:1050) in the viewport. When
   the zoom modal opens, demote the header so it can't peek through the dim. */
body.modal-open:has(.product-images-modal.show) #header{
  z-index:0;
}
.product-images-modal.show{
  z-index:2010!important;
}
/* The product gallery's .product__left is `position:sticky` which creates a
   stacking context. Our modal lives inside that subtree, so its z:2010 is
   only relative to .product__left (which itself sits at z:0 in body) and
   the backdrop at z:2000 ends up painted *over* the modal. When the modal
   is open we drop sticky on the column so it stops creating its own context;
   the modal's position:fixed then lands at viewport root and z-index works. */
body.modal-open:has(.product-images-modal.show) .product__left{
  position:static;
}
.product-images-modal .modal-dialog{
  width:100vw;height:100vh;max-width:none;margin:0;
  display:flex;align-items:center;justify-content:center;
  pointer-events:none;
}
.product-images-modal .modal-content{
  background:transparent;border:none;box-shadow:none;
  width:100%;height:100%;
  display:flex;flex-direction:column;
  pointer-events:auto;
}
.product-images-modal .modal-header{
  position:absolute;top:1rem;right:1rem;left:auto;
  background:transparent;border:none;padding:0;z-index:5;
}
.product-images-modal .modal-header .btn-close{
  width:44px;height:44px;border-radius:50%;
  background:#fff url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="%230c0a09"%3E%3Cpath d="M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414Z"/%3E%3C/svg%3E') center/14px no-repeat;
  opacity:1;
  transition:background-color .15s, transform .15s;
}
.product-images-modal .modal-header .btn-close:hover{
  background-color:#dc2626;
  background-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="%23ffffff"%3E%3Cpath d="M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414Z"/%3E%3C/svg%3E');
  transform:scale(1.05);
}
.product-images-modal__body,
.product-images-modal .modal-body{
  padding:0;flex:1;min-height:0;
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
.product-images-modal__carousel,
.product-images-modal .carousel.slide{
  width:100%;height:100%;max-width:1400px;max-height:100%;
}
.product-images-modal .carousel-inner{
  width:100%;height:100%;
}
.product-images-modal .carousel-item{
  width:100%;height:100%;text-align:center;
}
.product-images-modal .carousel-item.active,
.product-images-modal .carousel-item-next,
.product-images-modal .carousel-item-prev{
  display:flex;align-items:center;justify-content:center;
}
.product-images-modal .carousel-item picture,
.product-images-modal .carousel-item img{
  display:block;
  max-width:min(90vw,1400px);
  max-height:calc(100vh - 6rem);
  width:auto;height:auto;
  object-fit:contain;
  margin:0 auto;
}
/* Carousel prev/next (only shown when >1 image) */
.product-images-modal .carousel-control-prev,
.product-images-modal .carousel-control-next{
  width:60px;opacity:1;
}
.product-images-modal .carousel-control-prev-icon,
.product-images-modal .carousel-control-next-icon{
  width:44px;height:44px;border-radius:50%;
  background-color:#fff;background-size:18px;
  transition:background-color .15s, transform .15s;
}
.product-images-modal .carousel-control-prev:hover .carousel-control-prev-icon,
.product-images-modal .carousel-control-next:hover .carousel-control-next-icon{
  background-color:#dc2626;
  filter:invert(1);
  transform:scale(1.05);
}

/* =============================================================================
   Sitemap (`/?controller=sitemap`, body.page-sitemap) — editorial typography
   instead of the stock plain-list layout. 4 columns: Ofertas / Categorías /
   Cuenta / Páginas, each with an eyebrow heading and a clean link list. The
   stock template ships <ul> with default bullets and tree connectors that
   feel dated; we drop those and replace with discreet red dots + indent.
   ============================================================================= */
body.page-sitemap .page-title-section,
body.page-sitemap h1{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:2rem;letter-spacing:-.02em;
  color:#0c0a09;margin:0 0 2.5rem;text-align:left;
  display:flex;align-items:center;gap:.7rem;
}
body.page-sitemap .page-title-section::before,
body.page-sitemap h1::before{
  content:"";width:24px;height:3px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;
}
body.page-sitemap .sitemap__block{
  margin-bottom:2rem;
}
body.page-sitemap .sitemap__block h2{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:#0c0a09;margin:0 0 1rem;padding-bottom:.6rem;
  border-bottom:1px solid #e7e5e4;
  display:flex;align-items:center;gap:.5rem;
}
body.page-sitemap .sitemap__block h2::before{
  content:"";width:18px;height:2px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;
}
body.page-sitemap .sitemap__block ul,
body.page-sitemap ul.tree{
  list-style:none;padding:0;margin:0;
}
body.page-sitemap .sitemap__block li,
body.page-sitemap ul.tree li{
  position:relative;padding:.35rem 0 .35rem 1.1rem;
  font-size:.88rem;line-height:1.4;
}
body.page-sitemap .sitemap__block li::before,
body.page-sitemap ul.tree li::before{
  content:"";position:absolute;left:0;top:.7rem;
  width:5px;height:5px;border-radius:50%;
  background:#dc2626;
}
body.page-sitemap .sitemap__block li ul,
body.page-sitemap ul.tree ul{
  margin:.25rem 0 .25rem .8rem;
}
body.page-sitemap .sitemap__block li ul li::before,
body.page-sitemap ul.tree li li::before{
  background:#a8a29e;width:4px;height:4px;
}
body.page-sitemap .sitemap__block a,
body.page-sitemap ul.tree a{
  color:#0c0a09;text-decoration:none;font-weight:500;
  transition:color .15s;
}
body.page-sitemap .sitemap__block a:hover,
body.page-sitemap ul.tree a:hover{color:#dc2626;}

/* Empty cart state (.cart__empty-state) — editorial card with icon, headline,
   sub and a CTA back to the catalog. Replaces the stock plain-text "There are
   no more items in your cart" line. */
body.page-cart .cart__empty-state{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:1rem;
  padding:3rem 1.5rem;
}
body.page-cart .cart__empty-icon{
  width:72px;height:72px;border-radius:50%;
  background:#fef2f2;
  display:inline-flex;align-items:center;justify-content:center;
  color:#dc2626;
}
body.page-cart .cart__empty-icon .material-icons{font-size:36px;}
body.page-cart .cart__empty-title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:1.6rem;letter-spacing:-.025em;
  color:#0c0a09;margin:0;
}
body.page-cart .cart__empty-sub{
  font-size:.95rem;color:#78716c;margin:0;max-width:30rem;line-height:1.5;
}
body.page-cart .cart__empty-cta{
  margin-top:.5rem;
}

/* Voucher / promo code panel — accordion with input + submit. The stock theme
   ships a plain accordion; we re-skin to match the editorial card language:
   compact button with eyebrow look, form as a pill input + dark submit. */
body.page-cart .cart-voucher,
body.page-order .cart-voucher{
  margin-top:1rem;
}
body.page-cart .cart-voucher__accordion,
body.page-order .cart-voucher__accordion{
  background:transparent;border:none;
}
body.page-cart .cart-voucher__accordion-item,
body.page-order .cart-voucher__accordion-item{
  background:transparent;border:none;
}
body.page-cart .cart-voucher__accordion-button,
body.page-order .cart-voucher__accordion-button{
  background:transparent!important;border:none!important;box-shadow:none!important;
  padding:.5rem 0!important;
  font-family:'Inter',sans-serif;font-weight:600;font-size:.7rem;
  letter-spacing:.12em;text-transform:uppercase;color:#0c0a09;
}
body.page-cart .cart-voucher__accordion-button::after,
body.page-order .cart-voucher__accordion-button::after{
  filter:none;
}
body.page-cart .cart-voucher__form,
body.page-order .cart-voucher__form{
  display:flex;gap:.5rem;align-items:stretch;
  padding:.25rem 0 .5rem;
}
body.page-cart .cart-voucher__form .form-control,
body.page-order .cart-voucher__form .form-control{
  flex:1;border:1px solid #e7e5e4!important;border-radius:.5rem!important;
  padding:.6rem .85rem!important;font-size:.85rem!important;
}
body.page-cart .cart-voucher__form .form-control:focus,
body.page-order .cart-voucher__form .form-control:focus{
  border-color:#0c0a09!important;box-shadow:none!important;
}
body.page-cart .cart-voucher__form .btn,
body.page-order .cart-voucher__form .btn{
  background:#0c0a09!important;color:#fff!important;border:none!important;
  border-radius:.5rem!important;padding:.6rem 1rem!important;
  font-family:'Inter',sans-serif!important;font-weight:600!important;
  font-size:.7rem!important;letter-spacing:.08em!important;
  text-transform:uppercase!important;
  transition:background .15s;
}
body.page-cart .cart-voucher__form .btn:hover,
body.page-order .cart-voucher__form .btn:hover{
  background:#dc2626!important;color:#fff!important;
}

/* Vouchers already added — show as small pill chips with × remove */
body.page-cart .cart-voucher__list,
body.page-order .cart-voucher__list{list-style:none;padding:0;margin:0 0 .5rem;}
body.page-cart .cart-summary__label--voucher,
body.page-order .cart-summary__label--voucher{
  display:inline-flex;align-items:center;gap:.4rem;
  color:#dc2626;font-weight:600;
}
body.page-cart .cart-voucher__remove,
body.page-order .cart-voucher__remove{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:50%;
  background:#fafaf9;color:#78716c;text-decoration:none;
  margin-left:.4rem;transition:background .15s,color .15s;
}
body.page-cart .cart-voucher__remove:hover,
body.page-order .cart-voucher__remove:hover{
  background:#dc2626;color:#fff;
}
body.page-cart .cart-voucher__remove .material-icons,
body.page-order .cart-voucher__remove .material-icons{font-size:14px;}

/* Empty cart state — card on the overview only when there are no lines.
   When there are products the lines themselves are the cards (see below) and
   the overview has to be a transparent passthrough or we get card-in-card. */
body.page-cart.cart-empty .cart__overview{
  background:#fff;border:1px solid #e7e5e4;border-radius:1.25rem;
  padding:3rem 2rem;text-align:center;
}
body.page-cart:not(.cart-empty) .cart__overview{
  background:transparent;border:none;padding:0;border-radius:0;
}
body.page-cart .cart__overview > hr{display:none;}
body.page-cart .cart__empty{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-size:1.25rem;font-weight:700;color:#0c0a09;
  letter-spacing:-.01em;margin:0;
}

/* =============================================================================
   Cart product line — editorial card (variant B). Three-column grid:
   image · details · actions. Replaces the theme's flex+inner-grid layout so
   we can normalize spacing and surface labels ("Precio unitario", "Subtotal")
   that the stock markup leaves bare. The middle column hosts title + chip
   cluster of attributes + small unit price; the right column groups stepper,
   line subtotal (big editorial number) and the remove pill.
   ============================================================================= */
body.page-cart .product-line,
body.page-order .product-line{
  display:grid;
  grid-template-columns:120px minmax(0,1fr) 200px;
  gap:1.5rem;align-items:center;
  background:#fff;border:1px solid #e7e5e4;border-radius:1rem;
  padding:1.25rem;margin-bottom:.85rem;
}

/* Image — fixed 120px square, cover-cropped */
body.page-cart .product-line__image,
body.page-order .product-line__image{
  width:120px;height:120px;flex-shrink:0;
  border-radius:.75rem;overflow:hidden;background:#fafaf9;
  margin:0;
}
body.page-cart .product-line__image > a,
body.page-order .product-line__image > a{
  display:block;width:100%;height:100%;
}
body.page-cart .product-line__image picture,
body.page-cart .product-line__image .product-line__img,
body.page-order .product-line__image picture,
body.page-order .product-line__image .product-line__img{
  width:100%!important;height:100%!important;object-fit:cover;display:block;
  border-radius:0;max-width:none;
}

/* .product-line__content unwraps so its children join the parent grid */
body.page-cart .product-line__content,
body.page-order .product-line__content{
  display:contents;
}

/* Details column (col 2) */
body.page-cart .product-line__content-left,
body.page-order .product-line__content-left{
  grid-column:2;min-width:0;margin:0;
  display:flex;flex-direction:column;gap:.55rem;
}

/* Title — editorial, clamped to 2 lines */
body.page-cart .product-line__content-left > .product-line__title,
body.page-order .product-line__content-left > .product-line__title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:1.05rem;line-height:1.25;
  color:#0c0a09;text-decoration:none;letter-spacing:-.005em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;
}
body.page-cart .product-line__content-left > .product-line__title:hover,
body.page-order .product-line__content-left > .product-line__title:hover{
  color:#dc2626;
}

/* Attributes — editorial chip cluster (.product-line__attrs wraps the foreach) */
body.page-cart .product-line__attrs,
body.page-order .product-line__attrs{
  display:flex;flex-wrap:wrap;gap:.45rem;margin:.4rem 0 0;
}
body.page-cart .product-line__attrs .product-line__item--info,
body.page-order .product-line__attrs .product-line__item--info{
  display:inline-flex;align-items:baseline;gap:.45rem;
  padding:.32rem .8rem;margin:0;
  background:#fff;border:1px solid #0c0a09;border-radius:999px;
  font-family:'Space Grotesk','Inter',sans-serif;
  font-size:.78rem;line-height:1;
  transition:background-color .15s,color .15s;
}
body.page-cart .product-line__attrs .product-line__item--info:hover,
body.page-order .product-line__attrs .product-line__item--info:hover{
  background:#0c0a09;color:#fff;
}
body.page-cart .product-line__attrs .product-line__item-label,
body.page-order .product-line__attrs .product-line__item-label{
  color:#78716c;font-weight:600;text-transform:uppercase;
  letter-spacing:.1em;font-size:.62rem;
  transition:color .15s;
}
body.page-cart .product-line__attrs .product-line__item--info:hover .product-line__item-label,
body.page-order .product-line__attrs .product-line__item--info:hover .product-line__item-label{
  color:#a8a29e;
}
body.page-cart .product-line__attrs .product-line__item-value,
body.page-order .product-line__attrs .product-line__item-value{
  color:inherit;font-weight:700;
  font-size:.78rem;letter-spacing:.01em;
}

/* Price line — "Precio unitario" eyebrow + value(s) (+ discount) */
body.page-cart .product-line__content-left .product-line__item--prices,
body.page-order .product-line__content-left .product-line__item--prices{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:.45rem;
  font-size:.8rem;color:#78716c;margin:0;
}
body.page-cart .product-line__content-left .product-line__item--prices::before,
body.page-order .product-line__content-left .product-line__item--prices::before{
  content:'Precio unitario';
  color:#78716c;font-size:.8rem;font-weight:500;
}
body.page-cart .product-line__content-left .product-line__item-price,
body.page-order .product-line__content-left .product-line__item-price{
  font-weight:600;color:#0c0a09;
  font-variant-numeric:tabular-nums;width:auto;
}
body.page-cart .product-line__content-left .product-line__item-regular-price,
body.page-order .product-line__content-left .product-line__item-regular-price{
  color:#a8a29e;text-decoration:line-through;
  font-size:.78rem;font-variant-numeric:tabular-nums;
}
body.page-cart .product-line__content-left .product-line__item-discount,
body.page-order .product-line__content-left .product-line__item-discount{
  background:#dc2626!important;color:#fff!important;
  font-weight:700;font-size:.65rem;letter-spacing:.06em;
  padding:.15rem .4rem;border-radius:.25rem;
}

/* Actions column (col 3) — stepper + subtotal + remove, right-aligned */
body.page-cart .product-line__content-right,
body.page-order .product-line__content-right{
  grid-column:3;min-width:0;margin:0;
  display:flex;flex-direction:column;align-items:flex-end;gap:.6rem;
}
body.page-cart .product-line__content-right .product-line__quantity-button,
body.page-order .product-line__content-right .product-line__quantity-button{order:1;max-width:none;}
body.page-cart .product-line__content-right .product-line__price,
body.page-order .product-line__content-right .product-line__price{order:2;}
body.page-cart .product-line__content-right .product-line__remove,
body.page-order .product-line__content-right .product-line__remove{order:3;}

/* Line subtotal — small "SUBTOTAL" eyebrow + big editorial value */
body.page-cart .product-line__content-right .product-line__price,
body.page-order .product-line__content-right .product-line__price{
  display:flex;flex-direction:column;align-items:flex-end;gap:.1rem;
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:1.2rem;
  color:#0c0a09;letter-spacing:-.01em;
  font-variant-numeric:tabular-nums;line-height:1;
}
body.page-cart .product-line__content-right .product-line__price::before,
body.page-order .product-line__content-right .product-line__price::before{
  content:'Subtotal';
  font-family:'Inter',sans-serif;
  font-size:.62rem;font-weight:600;color:#a8a29e;
  letter-spacing:.14em;text-transform:uppercase;
}

/* Mobile — stack image+details, actions on a row underneath */
@media (max-width:720px){
  body.page-cart .product-line,
  body.page-order .product-line{
    grid-template-columns:96px minmax(0,1fr);
    gap:1rem 1.1rem;padding:1rem;
  }
  body.page-cart .product-line__image,
  body.page-order .product-line__image{width:96px;height:96px;}
  body.page-cart .product-line__content-left,
  body.page-order .product-line__content-left{grid-column:2;}
  body.page-cart .product-line__content-right,
  body.page-order .product-line__content-right{
    grid-column:1 / -1;
    flex-direction:row;align-items:center;justify-content:space-between;
    gap:.75rem;
    padding-top:.75rem;border-top:1px dashed #e7e5e4;
  }
  /* Keep the stepper at its intrinsic width regardless of how long the
     subtotal next to it becomes (3-digit prices used to push the price
     column to `flex:1` and steal width from the stepper). */
  body.page-cart .product-line__content-right .product-line__quantity-button,
  body.page-order .product-line__content-right .product-line__quantity-button{
    flex:0 0 auto;
  }
  body.page-cart .product-line__content-right .product-line__price,
  body.page-order .product-line__content-right .product-line__price{
    flex:1;min-width:0;align-items:flex-start;
  }
}

/* Legacy PS1.7-era selectors kept for safety on edge templates */
body.page-cart .product-line-info .label{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
  font-size:.95rem;color:#0c0a09;text-decoration:none;
}
body.page-cart .product-line-info .label:hover{color:#dc2626;}
body.page-cart .product-price,
body.page-cart .cart__price{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
  color:#0c0a09;font-variant-numeric:tabular-nums;
}
body.page-cart .product-discount,
body.page-cart .regular-price{color:#a8a29e;text-decoration:line-through;}

/* Quantity stepper — PS9 ships <button>−</button><input><button>+</button>
   inside `.quantity-button__group.input-group`. We treat the wrapper as one
   pill: border + radius live on the wrapper, children are flat (no border,
   no radius) so the three pieces read as a single cohesive control.
   `flex-wrap:nowrap` is mandatory — Bootstrap's `.input-group` wraps by
   default, which makes the +/-/input stack on two rows once the subtotal
   next to it grows to 3 digits (the qty cell shrinks until the row no
   longer fits the children side-by-side). */
body.page-cart .quantity-button__group.input-group,
body.page-order .quantity-button__group.input-group{
  display:inline-flex;align-items:stretch;flex-wrap:nowrap;
  border:1px solid #e7e5e4;border-radius:.5rem;overflow:hidden;
  background:#fff;
}
body.page-cart .quantity-button__group.input-group > .btn,
body.page-cart .quantity-button__group.input-group > input.form-control,
body.page-order .quantity-button__group.input-group > .btn,
body.page-order .quantity-button__group.input-group > input.form-control{
  border:none!important;border-radius:0!important;
  background:#fff!important;color:#0c0a09!important;
  height:auto;margin:0!important;box-shadow:none!important;
}
body.page-cart .quantity-button__group.input-group > .btn,
body.page-order .quantity-button__group.input-group > .btn{
  width:42px;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s;
}
body.page-cart .quantity-button__group.input-group > .btn:hover,
body.page-order .quantity-button__group.input-group > .btn:hover{
  background:#0c0a09!important;color:#fff!important;
}
body.page-cart .quantity-button__group.input-group > input.form-control,
body.page-order .quantity-button__group.input-group > input.form-control{
  text-align:center;width:56px;min-width:0;
  padding:.5rem .25rem;font-weight:600;
}
body.page-cart .quantity-button__group.input-group > input.form-control:focus,
body.page-order .quantity-button__group.input-group > input.form-control:focus{
  outline:none;background:#fafaf9!important;
}
/* Hide the native spinner arrows on the number input */
body.page-cart .quantity-button__group.input-group > input[type="number"]::-webkit-inner-spin-button,
body.page-cart .quantity-button__group.input-group > input[type="number"]::-webkit-outer-spin-button,
body.page-order .quantity-button__group.input-group > input[type="number"]::-webkit-inner-spin-button,
body.page-order .quantity-button__group.input-group > input[type="number"]::-webkit-outer-spin-button{
  -webkit-appearance:none;margin:0;
}
body.page-cart .quantity-button__group.input-group > input[type="number"],
body.page-order .quantity-button__group.input-group > input[type="number"]{
  -moz-appearance:textfield;
}

/* Cart line "Eliminar" — the stock theme renders a plain text link spanning
   the bottom of the row; it's hard to spot. The .tpl now places the remove
   anchor inside .product-line__content-right (between the qty stepper and
   the line total) and we style it as an icon+caption pill aligned to the
   right edge so the user finds it directly under the qty input. */
body.page-cart .product-line__content-right .product-line__remove,
body.page-order .product-line__content-right .product-line__remove{
  align-self:flex-end;
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.4rem .7rem;
  background:#fff;border:1px solid #e7e5e4;border-radius:.5rem;
  color:#57534e;text-decoration:none;
  font-family:'Inter',sans-serif;font-weight:600;font-size:.7rem;
  letter-spacing:.08em;text-transform:uppercase;line-height:1;
  transition:color .15s,border-color .15s,background .15s;
}
body.page-cart .product-line__content-right .product-line__remove:hover,
body.page-order .product-line__content-right .product-line__remove:hover{
  color:#dc2626;border-color:#dc2626;
}
body.page-cart .product-line__content-right .product-line__remove .material-icons,
body.page-order .product-line__content-right .product-line__remove .material-icons{
  font-size:18px;line-height:1;
}
/* The original .product-line__actions slot now only carries hook content
   (rare). Hide its grid track when empty so it doesn't open a blank row. */
body.page-cart .product-line__actions:empty,
body.page-order .product-line__actions:empty{display:none;}

/* Vouchers / coupon block */
body.page-cart .promo-code,
body.page-cart .block-promo,
body.page-order .promo-code,
body.page-order .block-promo{
  background:#fff;border:1px solid #e7e5e4;border-radius:.75rem;
  padding:1.25rem;margin-top:1rem;
}
body.page-cart .promo-code .form-control,
body.page-order .promo-code .form-control{
  border:1px solid #e7e5e4!important;border-radius:.5rem!important;
  padding:.7rem 1rem!important;font-size:.9rem!important;
}
body.page-cart .promo-code .form-control:focus,
body.page-order .promo-code .form-control:focus{
  border-color:#0c0a09!important;box-shadow:none!important;
}

/* Cart page: hide featured-products, breadcrumb, and the shipping subtotal
   line (shipping is computed at the delivery step in checkout, not here). */
body.page-cart .cart-grid__footer,
body.page-cart .ps-featuredproducts,
body.page-cart .breadcrumb__wrapper,
body.page-cart .breadcrumb,
body.page-cart nav.breadcrumb,
body.page-cart nav[aria-label="breadcrumb"],
body.page-cart #cart-subtotal-shipping{
  display:none!important;
}

/* Checkout: defer the "Transporte" line until the user reaches the delivery
   step. Showing a placeholder shipping price (often "Gratis") on personal-info
   or addresses steps is misleading because it changes once the carrier is
   picked. We hide by default and reveal only when delivery-step is current
   or payment-step is reachable (i.e., user has progressed past delivery). */
body.page-order #cart-subtotal-shipping{display:none!important;}
body.page-order:has(#checkout-delivery-step.step--current) #cart-subtotal-shipping,
body.page-order:has(#checkout-payment-step.step--reachable) #cart-subtotal-shipping{
  display:flex!important;
}

/* =============================================================================
   "Ver detalles" mini cart line — checkout aside (.cart-summary-product).
   Compact editorial layout that mirrors the main cart row but at smaller
   scale: image 64px / title + chips + small qty caption / line total on the
   right. The stock template renders attributes as inline label/value pairs
   ("Talla: AD") and shows the unit price + total separately, which doubled
   visually with the right-column total. We hide the unit-price block (the
   right-column total is the source of truth) and chip-style the attrs.
   ============================================================================= */
body.page-order .cart-summary-product{
  display:grid;grid-template-columns:64px minmax(0,1fr) auto;
  gap:.75rem;align-items:center;
  padding:.75rem 0;
  border-bottom:1px solid #e7e5e4;
}
body.page-order .cart-summary-product:last-child{border-bottom:none;}

body.page-order .cart-summary-product__image{
  width:64px;height:64px;flex-shrink:0;
  border-radius:.5rem;overflow:hidden;background:#fafaf9;
  margin:0;
}
body.page-order .cart-summary-product__image > a{
  display:block;width:100%;height:100%;
}
body.page-order .cart-summary-product__image picture,
body.page-order .cart-summary-product__img{
  width:100%!important;height:100%!important;object-fit:cover;display:block;
  max-width:none;
}

body.page-order .cart-summary-product__content{
  display:contents;
}
body.page-order .cart-summary-product__content-left{
  grid-column:2;min-width:0;
  display:flex;flex-direction:column;gap:.3rem;
}
body.page-order .cart-summary-product__content-right{
  grid-column:3;min-width:0;
  display:flex;flex-direction:column;align-items:flex-end;
}

/* Title — compact, clamped */
body.page-order .cart-summary-product__link{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.85rem;line-height:1.2;
  color:#0c0a09;text-decoration:none;letter-spacing:-.005em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;
}
body.page-order .cart-summary-product__link:hover{color:#dc2626;}

/* Attributes — chip cluster */
body.page-order .cart-summary-product__attributes{
  display:flex;flex-wrap:wrap;gap:.3rem;
}
body.page-order .cart-summary-product__attribute{
  display:inline-flex;align-items:center;gap:.25rem;
  padding:.15rem .45rem;
  background:#fafaf9;border:1px solid #e7e5e4;border-radius:999px;
  font-size:.65rem;font-weight:500;color:#44403c;
}
body.page-order .cart-summary-product__attribute .label{
  color:#a8a29e;font-weight:600;text-transform:uppercase;
  letter-spacing:.05em;font-size:.6rem;
}
body.page-order .cart-summary-product__attribute .value{
  color:#44403c;font-weight:500;
}

/* Hide redundant left-column price block — the right-column total wins.
   Kept as a hook target; show only if you ever need a unit-price-only view. */
body.page-order .cart-summary-product__price,
body.page-order .cart-summary-product__unit-price{display:none;}

/* Quantity caption — "× 1" style, compact */
body.page-order .cart-summary-product__quantity{
  font-size:.7rem;color:#78716c;
}
body.page-order .cart-summary-product__quantity .label{display:none;}
body.page-order .cart-summary-product__quantity .value{
  font-weight:600;color:#44403c;
}

/* Gift indicator — small */
body.page-order .cart-summary-product__gift:empty{display:none;}
body.page-order .cart-summary-product__gift{
  font-size:.7rem;color:#dc2626;font-weight:600;
}

/* Right column total — bold editorial number */
body.page-order .cart-summary-product__prices{
  display:flex;flex-direction:column;align-items:flex-end;
}
body.page-order .cart-summary-product__total{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:.95rem;
  color:#0c0a09;letter-spacing:-.01em;
  font-variant-numeric:tabular-nums;line-height:1;
}

/* "Show details" toggle — clean accordion button */
body.page-order .cart-summary__products-accordion .accordion-button{
  background:transparent!important;border:none!important;box-shadow:none!important;
  padding:.65rem 0!important;
  font-family:'Inter',sans-serif;font-weight:600;font-size:.7rem;
  letter-spacing:.12em;text-transform:uppercase;color:#0c0a09;
}
body.page-order .cart-summary__products-accordion .accordion-button:not(.collapsed){
  color:#0c0a09;
}
body.page-order .cart-summary__products-accordion .accordion-button:focus{
  outline:none;
}
body.page-order .cart-summary__products-accordion hr,
body.page-order .cart-summary__products > hr{
  border-top:1px solid #e7e5e4;margin:0;
}
body.page-order .cart-summary__products-list{
  padding:.5rem 0;
}
body.page-order .cart-summary__products-number{
  font-size:.85rem;color:#44403c;font-weight:500;
}

/* Checkout step navigation (PS9 multi-step) */
body.page-order .step,
body.page-order .checkout-step{
  background:#fff;border:1px solid #e7e5e4;padding:1.5rem 1.75rem;
  margin-bottom:1rem;border-radius:1rem;
}
body.page-order .step.-current,
body.page-order .checkout-step.-current{border-left:3px solid #dc2626;}

/* Form fields inside cart/checkout */
body.page-cart .form-control,
body.page-order .form-control{
  border:1px solid #e7e5e4;border-radius:.5rem;background:#fff;
  padding:.7rem 1rem;font-size:.95rem;color:#0c0a09;
}
body.page-cart .form-control:focus,
body.page-order .form-control:focus{
  border-color:#0c0a09;box-shadow:none;
}
body.page-cart label,
body.page-order label{
  font-family:'Inter',sans-serif;font-weight:600;font-size:.82rem;
  color:#44403c;margin-bottom:.3rem;
}

/* Generic <hr> in cart/checkout — soften */
body.page-cart hr,
body.page-order hr{
  border:none;border-top:1px solid #e7e5e4;margin:1.25rem 0;
}

/* Mobile tweaks */
@media (max-width:991px){
  body.page-cart .cart-grid__aside-wrapper,
  body.page-order .cart-grid__aside-wrapper{position:static;margin-top:1.5rem;}
  body.page-cart .page-title-section,
  body.page-order .page-title-section{font-size:2rem;}
}

/* Unibody checkout: hide chrome on the checkout flow so it reads as a single
   focused funnel. The header stays visible in hpv1 logo-only mode (rendered
   by header.tpl when $ikara_header_logo_only is true). */
body.page-order #footer,
body.page-order > .breadcrumb,
body.page-order .breadcrumb,
body.page-order .breadcrumb__wrapper,
body.page-order .mmpv2,
body.page-order #_mobile_ps_languageselector,
body.page-order #back-to-top{
  display:none!important;
}
/* hpv1 logo-only — center the brand, no sticky, no borders. */
body.page-order #header{
  position:static!important;background:#fff!important;
  border:none!important;box-shadow:none!important;
  /* The desktop megamenu rule sets `contain:layout` on #header so the
     full-width dropdown panel has a containing block. The leave-checkout
     modal also lives inside #header (rendered by the same partial) and as
     `position:fixed; inset:0` it inherits that containing block — so on
     ≥992 px the modal was trapped within the header's bounds and the cart
     summary aside floated above it. Disable containment here; checkout has
     no megamenu anyway. */
  contain:none!important;
}
body.page-order .hpv1__main--logo-only{
  display:flex;justify-content:flex-start;align-items:center;
  padding:.95rem 2rem;
}

/* Leave-checkout confirm modal (vanilla — no Bootstrap dep). Fired by the
   logo click in logo-only mode. Editorial language: red warning accent,
   .7rem buttons, 1.25rem panel radius. */
.ikara-leave-modal{
  position:fixed;inset:0;z-index:2000;
  display:flex;align-items:center;justify-content:center;
  padding:1.5rem;
  opacity:0;transition:opacity .18s ease-out;
}
.ikara-leave-modal.is-open{opacity:1;}
.ikara-leave-modal[hidden]{display:none;}
.ikara-leave-modal__backdrop{
  position:absolute;inset:0;background:rgba(12,10,9,.55);
}
.ikara-leave-modal__dialog{
  position:relative;background:#fff;
  border:1px solid #e7e5e4;border-radius:1.25rem;
  padding:2.25rem 2rem;text-align:center;
  width:100%;max-width:420px;
  box-shadow:0 24px 60px rgba(12,10,9,.24);
  transform:translateY(8px);transition:transform .22s ease-out;
}
.ikara-leave-modal.is-open .ikara-leave-modal__dialog{transform:translateY(0);}
.ikara-leave-modal__icon{
  width:3.25rem;height:3.25rem;margin:0 auto 1rem;
  display:flex;align-items:center;justify-content:center;
  background:#fef2f2;color:#dc2626;border-radius:50%;
}
.ikara-leave-modal__icon .material-icons{font-size:32px;}
.ikara-leave-modal__title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:1.4rem;letter-spacing:-.02em;line-height:1.2;
  /* CE kit 1 (creativeelements) ships a `body.ce-kit-1 h3 { color: #fff }`
     rule that beats our class selector by specificity — the title rendered
     white on a white panel. Mark the color so the modal stays readable. */
  color:#0c0a09!important;margin:0 0 .65rem;
}
.ikara-leave-modal__text{
  color:#57534e;font-size:.95rem;line-height:1.5;
  margin:0 0 1.5rem;
}
.ikara-leave-modal__actions{
  display:flex;flex-direction:column;gap:.5rem;align-items:stretch;
}
.ikara-leave-modal__stay{
  background:#dc2626;color:#fff;border:none;
  border-radius:.7rem;padding:.85rem 1.25rem;
  font-family:'Inter',sans-serif;font-weight:700;font-size:.95rem;
  cursor:pointer;transition:background .15s;
}
.ikara-leave-modal__stay:hover{background:#b91c1c;}
.ikara-leave-modal__leave{
  background:transparent;border:none;
  color:#78716c;text-decoration:underline;
  font-size:.85rem;font-weight:600;padding:.5rem;
  cursor:pointer;
}
.ikara-leave-modal__leave:hover{color:#0c0a09;}

body.page-order #wrapper.wrapper,
body.page-order main#wrapper{
  padding:2.5rem 1.5rem!important;background:#fafaf9;
  /* Vertically center content in the remaining viewport (header takes up
     ~5rem, so subtract that as the centering reference). */
  min-height:calc(100vh - 5rem);
  display:flex;flex-direction:column;justify-content:center;
}
body.page-order #main-content{
  max-width:1200px;margin:0 auto;width:100%;
}

/* =============================================================================
   Checkout — full reskin of all 4 steps (personal info, addresses, shipping,
   payment) plus the side summary accordion. Same vocabulary as the cart and
   the product page: editorial Space Grotesk + Inter, red #dc2626 accents,
   rounded radii (.5/.7/1/1.25rem), red skewed-bar eyebrows.
   ========================================================================== */

/* Top step navigation hidden — the theme's PHP marks every non-final step
   as complete and only the last as current, so the indicator never reflects
   the real position. Section titles + aside summary cover the wayfinding. */
body.page-order .checkout-steps{display:none!important;}

/* Each step section as a card --------------------------------------------- */
body.page-order .step{
  background:#fff;border:1px solid #e7e5e4;
  border-radius:1.25rem;padding:2rem 2.25rem;
  margin-bottom:1.5rem;
  transition:opacity .2s;
}
body.page-order .step.step--current{border-color:#0c0a09;}
body.page-order .step:not(.step--current):not(.step--complete):not(.step--reachable){
  opacity:.55;
}
/* Step header */
body.page-order .step__title{
  margin:0 0 1.5rem;padding:0;
  display:flex;align-items:center;gap:.75rem;
}
body.page-order .step__title hr{display:none;}
body.page-order .step__title .page-title-section{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:800!important;font-size:1.6rem!important;
  letter-spacing:-.025em!important;line-height:1.1!important;
  color:#0c0a09!important;margin:0!important;padding:0!important;
  display:flex;align-items:center;gap:.65rem;
}
body.page-order .step__title .page-title-section::before{
  content:"";width:24px;height:3px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;display:inline-block;
}
body.page-order .step:not(.step--current) .step__title .page-title-section{
  font-size:1.1rem!important;color:#57534e!important;
}

/* Personal info step — login/guest tabs */
body.page-order .nav.nav-underline{
  border-bottom:1px solid #e7e5e4;margin-bottom:1.5rem;gap:.5rem;
}
body.page-order .nav.nav-underline .nav-link{
  background:transparent!important;border:none!important;
  border-bottom:2px solid transparent!important;border-radius:0!important;
  padding:.75rem 1rem!important;
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:.85rem!important;
  letter-spacing:.08em!important;text-transform:uppercase!important;
  color:#78716c!important;
  transition:color .15s,border-color .15s;
}
body.page-order .nav.nav-underline .nav-link:hover{color:#0c0a09!important;}
body.page-order .nav.nav-underline .nav-link.active{
  color:#0c0a09!important;border-bottom-color:#dc2626!important;
}

/* Delivery options (shipping step) ---------------------------------------- */
body.page-order .delivery-options__list{
  display:flex;flex-direction:column;gap:.85rem;margin-bottom:1.5rem;
}
body.page-order .delivery-option__item{
  background:#fff;border:1px solid #e7e5e4;border-radius:1rem;
  overflow:hidden;transition:border-color .2s,box-shadow .2s;
}
body.page-order .delivery-option__item:has(input:checked){
  border-color:#0c0a09;box-shadow:0 0 0 1px #0c0a09;
}
body.page-order .delivery-option__label{
  display:grid!important;
  grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;
  padding:1.1rem 1.4rem;cursor:pointer;margin:0;
}
body.page-order .delivery-option__left{
  display:flex;align-items:center;gap:1rem;
}
body.page-order .delivery-option__check .form-check-input{
  width:1.1rem;height:1.1rem;margin:0;cursor:pointer;
  border:1.5px solid #d6d3d1;
}
body.page-order .delivery-option__check .form-check-input:checked{
  background-color:#dc2626;border-color:#dc2626;
}
body.page-order .delivery-option__carrier{
  display:flex;align-items:center;gap:.75rem;
}
body.page-order .delivery-option__carrier-logo{
  max-height:32px;max-width:90px;object-fit:contain;
}
body.page-order .delivery-option__carrier-name{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.95rem;color:#0c0a09;
}
body.page-order .delivery-option__content{
  font-size:.85rem;color:#57534e;line-height:1.4;
}
body.page-order .delivery-option__price{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:1.05rem;color:#0c0a09;
  font-variant-numeric:tabular-nums;
}
body.page-order .delivery-option__extra{
  padding:0 1.4rem;max-height:0;overflow:hidden;transition:max-height .25s;
}
body.page-order .delivery-option__extra[data-active]{
  padding:0 1.4rem 1rem;max-height:600px;
}
body.page-order .delivery-option__extra-content{
  border-top:1px dashed #e7e5e4;padding-top:1rem;font-size:.88rem;color:#44403c;
}
/* Order options block (delivery message, recyclable, gift) */
body.page-order .order-options{
  margin:1.5rem 0;padding:1.25rem;
  background:#fafaf9;border:1px solid #e7e5e4;border-radius:.75rem;
}
body.page-order .order-options .form-label{
  font-family:'Inter',sans-serif;font-weight:600;font-size:.82rem;
  color:#44403c;margin-bottom:.4rem;
}
body.page-order .order-options textarea.form-control{
  min-height:80px;resize:vertical;
}

/* Payment options ---------------------------------------------------------- */
body.page-order .payment-options__list{
  display:flex;flex-direction:column;gap:.85rem;margin-bottom:1.5rem;
}
body.page-order .payment-option{
  background:#fff;border:1px solid #e7e5e4;border-radius:1rem;
  overflow:hidden;transition:border-color .2s,box-shadow .2s;
}
body.page-order .payment-option:has(input:checked){
  border-color:#0c0a09;box-shadow:0 0 0 1px #0c0a09;
}
body.page-order .payment-option__form-check{
  padding:1.1rem 1.4rem;margin:0;display:flex;align-items:center;gap:.85rem;
}
body.page-order .payment-option__input{
  width:1.1rem;height:1.1rem;margin:0;cursor:pointer;
  border:1.5px solid #d6d3d1;flex-shrink:0;
}
body.page-order .payment-option__input:checked{
  background-color:#dc2626;border-color:#dc2626;
}
body.page-order .payment-option__label{
  display:flex!important;align-items:center;gap:.85rem;cursor:pointer;margin:0;
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.95rem;color:#0c0a09;
  flex:1;padding:0!important;
}
body.page-order .payment-option__label img{max-height:32px;width:auto;}
body.page-order .payment-option__additional-information,
body.page-order .js-payment-option-form{
  padding:0 1.4rem 1.25rem;border-top:1px dashed #e7e5e4;margin-top:0;
  font-size:.88rem;color:#44403c;
}
body.page-order .payment-option__additional-information{padding-top:1rem;}
body.page-order .payment-options__updated{
  background:rgba(34,197,94,.1);color:#15803d;border:1px solid rgba(34,197,94,.25);
  padding:.85rem 1.1rem;border-radius:.7rem;font-size:.9rem;margin-bottom:1rem;
}

/* Conditions checkbox + Place order */
body.page-order .payment-options__conditions{
  margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #e7e5e4;
}
body.page-order .payment-options__conditions .form-check{
  display:flex;align-items:flex-start;gap:.6rem;font-size:.88rem;color:#44403c;
}
body.page-order .payment-options__conditions .form-check-input{
  margin:.25rem 0 0;width:1.1rem;height:1.1rem;
  border:1.5px solid #d6d3d1;
}
body.page-order .payment-options__conditions .form-check-input:checked{
  background-color:#dc2626;border-color:#dc2626;
}

/* Address selector cards */
body.page-order .address__list{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:1rem;margin-bottom:1.25rem;
}
body.page-order .address-selector-block,
body.page-order .address-selector-block.address__item{
  background:#fff;border:1px solid #e7e5e4;border-radius:1rem;
  padding:1.25rem;cursor:pointer;transition:border-color .2s,box-shadow .2s;
}
body.page-order .address-selector-block:has(input:checked),
body.page-order .address-selector-block.selected{
  border-color:#0c0a09;box-shadow:0 0 0 1px #0c0a09;
}
body.page-order .address-selector-block .form-check-input{
  margin:0;width:1.1rem;height:1.1rem;border:1.5px solid #d6d3d1;
}
body.page-order .address-selector-block .form-check-input:checked{
  background-color:#dc2626;border-color:#dc2626;
}

/* Buttons wrapper (back / continue) */
body.page-order .buttons-wrapper{
  display:flex;justify-content:flex-end;gap:.85rem;align-items:center;
  margin-top:1.5rem;
}
body.page-order .buttons-wrapper--split{justify-content:space-between;}
body.page-order .buttons-wrapper--end{justify-content:flex-end;}
body.page-order .buttons-wrapper .btn{margin:0!important;}
body.page-order .buttons-wrapper .btn .material-icons{font-size:18px;}
@media (max-width:600px){
  body.page-order .buttons-wrapper{flex-direction:column;align-items:stretch;}
  body.page-order .buttons-wrapper--invert-mobile{flex-direction:column-reverse;}
  body.page-order .buttons-wrapper .btn{width:100%;justify-content:center;}
}

/* Aside summary accordion ------------------------------------------------- */
body.page-order .checkout-grid__aside-wrapper{
  background:#fff;border:1px solid #e7e5e4;border-radius:1.25rem;
  padding:1.75rem;
  position:sticky;top:1rem;z-index:1;
  max-height:calc(100vh - 2rem);overflow-y:auto;
}
body.page-order .checkout__summary-accordion{
  background:transparent;border:none;
}
body.page-order .checkout__summary-accordion-item{
  border:none!important;background:transparent!important;
}
body.page-order .checkout__summary-accordion-header .accordion-button{
  background:transparent!important;box-shadow:none!important;
  padding:0 0 1rem!important;color:#0c0a09!important;
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:1rem!important;
  letter-spacing:.16em!important;text-transform:uppercase!important;
  display:flex;align-items:center;gap:.6rem;
}
body.page-order .checkout__summary-accordion-header .accordion-button::after{
  margin-left:auto;
}
body.page-order .checkout__summary-accordion-header .accordion-button::before{
  content:"";width:24px;height:3px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;
}
body.page-order .checkout__summary-accordion-wrapper{
  padding-top:.5rem;
}

/* Customer/login forms in steps */
body.page-order .form-group,
body.page-order .form-floating{margin-bottom:1rem;}
body.page-order .form-control,
body.page-order .form-select{
  border:1px solid #e7e5e4;border-radius:.5rem;background:#fff;
  padding:.7rem 1rem;font-size:.95rem;color:#0c0a09;
}
body.page-order .form-control:focus,
body.page-order .form-select:focus{
  border-color:#0c0a09;box-shadow:0 0 0 2px rgba(12,10,9,.08);outline:none;
}
body.page-order .form-label,
body.page-order label.form-check-label{
  font-family:'Inter',sans-serif;font-weight:600;font-size:.82rem;
  color:#44403c;margin-bottom:.35rem;
}

/* Remove the legacy <hr> dividers used inside step__title (we use eyebrow) */
body.page-order .step__title hr,
body.page-order .step hr.step-divider{display:none;}

/* Defensive: ensure header/footer always show on cart (they're in the HTML —
   if anything else tries to hide them, this re-asserts visibility). */
body.page-cart #header,
body.page-cart #footer{display:block!important;}

/* =============================================================================
   Customer account — full reskin of the user panel: dashboard, identity,
   addresses, history, order detail, returns, vouchers, password reset.
   Same vocabulary as the rest of the redesign: editorial Space Grotesk +
   Inter, red `#dc2626` accents, rounded radii (.5/.7/1/1.25rem), red skewed
   eyebrows. Targeted via `:has(.page-content--customer)` on the body so the
   rules pick up every account flow without enumerating page-* slugs.
   ========================================================================== */

/* Page wrapper -------------------------------------------------------------- */
body:has(.page-content--customer) #wrapper.wrapper,
body:has(.page-content--customer) main#wrapper{
  background:#fafaf9;padding:2.5rem 1.5rem!important;
}
body:has(.page-content--customer) #main-content,
body:has(.page-content--customer) .columns-container{
  max-width:1800px;margin:0 auto;
}

/* Hide breadcrumb — the rail + page title give enough wayfinding. */
body:has(.page-content--customer) .breadcrumb,
body:has(.page-content--customer) .breadcrumb__wrapper{display:none!important;}

/* Page title (h1) — same eyebrow + editorial vocabulary as cart/checkout. */
body:has(.page-content--customer) .page-header{margin-bottom:2rem;}
body:has(.page-content--customer) .page-header .page-title-section,
body:has(.page-content--customer) .page-header h1{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:800!important;font-size:2.25rem!important;
  letter-spacing:-.025em!important;line-height:1.05!important;
  color:#0c0a09!important;margin:0!important;
  display:flex;align-items:center;gap:.85rem;
}
body:has(.page-content--customer) .page-header .page-title-section::before,
body:has(.page-content--customer) .page-header h1::before{
  content:"";width:32px;height:4px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;display:inline-block;
}

/* Sidebar rail (account-menu--sidebar) ------------------------------------- */
body:has(.page-content--customer) .account-menu--sidebar{
  background:#fff;border:1px solid #e7e5e4;border-radius:1.25rem;
  padding:1.5rem 1.25rem;
  margin-top:0;
  position:sticky;top:11rem;z-index:1;
}
/* When the page renders the page-header + "Volver a su cuenta" back button
   on the right column, push the rail down so its top aligns with the start
   of the content panel instead of with the page title. */
body:has(.page-content--customer):has(.account-menu__back) .account-menu--sidebar{
  margin-top:9.3rem;
}
/* Sub-pages keep the rail at the same top as the page-header — the title
   acts as the visual anchor on the right column. */
body:has(.page-content--customer) .account-menu__title{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:.78rem!important;
  letter-spacing:.18em!important;text-transform:uppercase!important;
  color:#0c0a09!important;margin:0 0 1rem!important;
  display:flex;align-items:center;gap:.55rem;
}
body:has(.page-content--customer) .account-menu__title::before{
  content:"";width:18px;height:3px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;
}
body:has(.page-content--customer) .account-menu__nav{
  display:flex;flex-direction:column;gap:.15rem;
}
body:has(.page-content--customer) .account-menu__link{
  display:flex;align-items:center;gap:.7rem;
  padding:.7rem .85rem;border-radius:.7rem;
  color:#44403c!important;text-decoration:none!important;
  font-family:'Inter',sans-serif!important;
  font-weight:500;font-size:.92rem;
  transition:background .15s,color .15s;
}
body:has(.page-content--customer) .account-menu__link:hover{
  background:#f5f5f4;color:#0c0a09!important;
}
body:has(.page-content--customer) .account-menu__link--active{
  background:#0c0a09!important;color:#fff!important;
}
body:has(.page-content--customer) .account-menu__link--active:hover{
  background:#0c0a09!important;color:#fff!important;
}
body:has(.page-content--customer) .account-menu__icon{
  font-size:20px!important;color:inherit!important;
}
body:has(.page-content--customer) .account-menu__link--signout{
  margin-top:.5rem;padding-top:.85rem;
  border-top:1px solid #e7e5e4;border-radius:0;
  color:#dc2626!important;
}
body:has(.page-content--customer) .account-menu__link--signout:hover{
  background:transparent;color:#b91c1c!important;
}

/* "Back to your account" button (sub-pages of /mi-cuenta/) */
body:has(.page-content--customer) .account-menu__back{
  display:inline-flex;align-items:center;gap:.4rem;
  background:transparent!important;border:1px solid #e7e5e4!important;
  border-radius:.7rem!important;padding:.55rem .9rem!important;
  color:#44403c!important;text-decoration:none!important;
  font-family:'Inter',sans-serif!important;
  font-weight:600!important;font-size:.85rem!important;
  margin-bottom:1.5rem;
  transition:border-color .15s,color .15s;
}
body:has(.page-content--customer) .account-menu__back:hover{
  border-color:#0c0a09!important;color:#0c0a09!important;
}

/* Dashboard view (account-menu--main) — turn the link list into a grid of
   editorial cards. */
body.page-my-account .account-menu--main{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:1rem;margin-top:1rem;
}
body.page-my-account .account-menu--main .account-menu__link{
  flex-direction:column;align-items:flex-start;justify-content:flex-start;
  gap:.75rem;padding:1.5rem;
  background:#fff;border:1px solid #e7e5e4;border-radius:1rem;
  font-size:1rem;font-weight:600;color:#0c0a09!important;
  min-height:130px;
  transition:border-color .15s,transform .15s,box-shadow .15s;
}
body.page-my-account .account-menu--main .account-menu__link:hover{
  border-color:#0c0a09!important;background:#fff!important;
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(12,10,9,.06);
}
body.page-my-account .account-menu--main .account-menu__icon{
  font-size:28px!important;color:#dc2626!important;
  background:#fef2f2;border-radius:.6rem;padding:.5rem;
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
}
body.page-my-account .account-menu--main .account-menu__link--signout{
  color:#dc2626!important;border-color:#fecaca!important;background:#fef2f2!important;
}
body.page-my-account .account-menu--main .account-menu__link--signout .account-menu__icon{
  background:#fff;color:#dc2626!important;
}

/* Page content panel (everything inside .page-content--customer) ----------- */
body:has(.page-content--customer) .page-content--customer{
  background:#fff;border:1px solid #e7e5e4;border-radius:1.25rem;
  padding:2rem 2.25rem;margin-bottom:1.5rem;
}
body.page-my-account .page-content--customer{
  background:transparent;border:none;padding:0;
}
body:has(.page-content--customer) .page-content--customer > p{
  color:#57534e;font-size:.95rem;line-height:1.5;margin-bottom:1.5rem;
}

/* Forms (identity, address, password) — scoped to the content panel so the
   header's language <select.form-select> isn't reskinned along with the
   in-page forms. */
body:has(.page-content--customer) .page-content--customer .form-group,
body:has(.page-content--customer) .page-content--customer .form-floating{margin-bottom:1.1rem;}
body:has(.page-content--customer) .page-content--customer .form-control,
body:has(.page-content--customer) .page-content--customer input.form-control,
body:has(.page-content--customer) .page-content--customer select.form-select,
body:has(.page-content--customer) .page-content--customer textarea.form-control{
  border:1px solid #e7e5e4!important;border-radius:.5rem!important;
  background:#fff!important;color:#0c0a09!important;
  font-family:'Inter',sans-serif!important;font-size:.95rem!important;
  padding:.7rem .85rem!important;
  transition:border-color .15s,box-shadow .15s;
}
body:has(.page-content--customer) .page-content--customer .form-control:focus,
body:has(.page-content--customer) .page-content--customer .form-select:focus{
  border-color:#0c0a09!important;
  box-shadow:0 0 0 3px rgba(12,10,9,.08)!important;
}
body:has(.page-content--customer) label,
body:has(.page-content--customer) .form-label{
  font-family:'Inter',sans-serif!important;
  font-weight:600!important;font-size:.82rem!important;
  letter-spacing:.04em!important;text-transform:uppercase!important;
  color:#44403c!important;margin-bottom:.4rem!important;
}

/* Buttons — match the cart/checkout vocabulary. */
body:has(.page-content--customer) .btn-primary{
  background:#dc2626!important;border-color:#dc2626!important;
  border-radius:.7rem!important;padding:.7rem 1.25rem!important;
  font-family:'Inter',sans-serif!important;font-weight:700!important;
  font-size:.9rem!important;letter-spacing:.02em;
  color:#fff!important;
}
body:has(.page-content--customer) .btn-primary:hover{
  background:#b91c1c!important;border-color:#b91c1c!important;
}
body:has(.page-content--customer) .btn-outline-primary,
body:has(.page-content--customer) .btn-outline-tertiary{
  background:transparent!important;border:1px solid #0c0a09!important;
  border-radius:.7rem!important;padding:.7rem 1.25rem!important;
  font-family:'Inter',sans-serif!important;font-weight:700!important;
  font-size:.9rem!important;letter-spacing:.02em;
  color:#0c0a09!important;
}
body:has(.page-content--customer) .btn-outline-primary:hover,
body:has(.page-content--customer) .btn-outline-tertiary:hover{
  background:#0c0a09!important;color:#fff!important;
}
body:has(.page-content--customer) .btn-sm{
  padding:.45rem .85rem!important;font-size:.78rem!important;
}

/* Address cards (addresses list + checkout reuse) -------------------------- */
body:has(.page-content--customer) .addresses__list{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:1rem;
}
body:has(.page-content--customer) .address-card{
  background:#fff;border:1px solid #e7e5e4;border-radius:1rem;
  padding:1.5rem;display:flex;flex-direction:column;
  transition:border-color .15s;
}
body:has(.page-content--customer) .address-card:hover{border-color:#0c0a09;}
body:has(.page-content--customer) .address-card__container{flex:1;display:flex;flex-direction:column;}
body:has(.page-content--customer) .address-card__alias{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:1rem!important;
  color:#0c0a09!important;margin-bottom:.85rem;display:inline-block;
}
body:has(.page-content--customer) .address-card__content{
  font-style:normal;font-size:.92rem;line-height:1.55;color:#44403c;
  flex:1;margin-bottom:1rem;
}
body:has(.page-content--customer) .address-card__actions{
  display:flex;gap:.85rem;padding-top:.85rem;border-top:1px solid #e7e5e4;
  font-size:.85rem;font-weight:600;
}
body:has(.page-content--customer) .address-card__edit{
  color:#0c0a09!important;text-decoration:underline;
}
body:has(.page-content--customer) .address-card__delete{color:#dc2626!important;}
body:has(.page-content--customer) .address-card--add-address{
  background:#fafaf9;border:2px dashed #d6d3d1;
  align-items:center;justify-content:center;text-align:center;gap:.85rem;
  min-height:180px;color:#0c0a09!important;text-decoration:none!important;
  transition:border-color .15s,background .15s;
}
body:has(.page-content--customer) .address-card--add-address:hover{
  border-color:#0c0a09;background:#fff;
}
body:has(.page-content--customer) .address-card__add-text{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:1rem!important;color:#0c0a09;
}
body:has(.page-content--customer) .address-card__add-icon{
  width:48px!important;height:48px!important;
  background:#0c0a09!important;border-color:#0c0a09!important;
  border-radius:.7rem!important;
}

/* Order history list (history.tpl) -----------------------------------------
   The table is rendered as a CSS grid by the theme. With col-lg-9 the 7
   columns get squeezed (~118px each) and the status pill collapses into a
   ball-shaped circle. We widen the content column (rail narrower + container
   to 1400px) so each cell has room to breathe, and force the pill to keep
   its text on a single line, centred. */
@media (min-width:992px){
  body:has(.page-content--customer) .columns-container.container{
    max-width:1800px;
  }
  body:has(.page-content--customer) > #wrapper.wrapper{max-width:none;}
  /* Bootstrap col-lg-3 (rail) → fixed 340px wide so menu labels read
     comfortably. col-lg-9 (content) absorbs the rest. */
  body:has(.page-content--customer) .row > .col-lg-3{
    flex:0 0 340px;max-width:340px;
  }
  body:has(.page-content--customer) .row > .col-lg-9{
    flex:0 0 calc(100% - 340px);max-width:calc(100% - 340px);
  }
}
body:has(.page-content--customer) .order-history{
  border:1px solid #e7e5e4;border-radius:1rem;overflow:hidden;
}
body:has(.page-content--customer) .order-history__header{
  background:#0c0a09!important;color:#fff!important;
}
body:has(.page-content--customer) .order-history__header .order-history__cell{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:.72rem!important;
  letter-spacing:.12em!important;text-transform:uppercase!important;
  color:#fff!important;padding:.95rem .85rem;
}
body:has(.page-content--customer) .order-history__row{
  border-top:1px solid #e7e5e4;
  transition:background .15s;
}
body:has(.page-content--customer) .order-history__row:hover{background:#fafaf9;}
body:has(.page-content--customer) .order-history__cell{
  padding:.95rem .85rem;font-size:.92rem;color:#44403c;
  display:flex;align-items:center;
}
body:has(.page-content--customer) .order-history__cell--reference{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700;color:#0c0a09;
}
body:has(.page-content--customer) .order-history__cell--total{font-weight:700;color:#0c0a09;}
/* Status pill — inline-flex so it doesn't stretch full-width, white-space
   nowrap so the label never wraps into a "ball", min-width to keep short
   labels from collapsing into a circle. */
body:has(.page-content--customer) .order-history__status.badge{
  display:inline-flex!important;align-items:center;justify-content:center;
  border-radius:999px!important;padding:.4rem .9rem!important;
  font-family:'Inter',sans-serif!important;
  font-weight:600!important;font-size:.75rem!important;letter-spacing:.02em;
  white-space:nowrap;line-height:1.2;min-width:7rem;text-align:center;
  width:auto;max-width:100%;
}
/* The status cell itself: align the pill left, allow it to shrink rather
   than be forced to full width by the cell's flex layout. */
body:has(.page-content--customer) .order-history__cell--status{
  min-width:0;
}
/* The actions cell hosts two outline buttons side by side. Stack them on
   narrow screens and make sure they don't overflow. */
body:has(.page-content--customer) .order-history__cell--actions{
  display:flex;flex-wrap:wrap;gap:.4rem;
}
body:has(.page-content--customer) .order-history__cell--actions .btn{
  white-space:nowrap;
}
@media (max-width:991.98px){
  body:has(.page-content--customer) .order-history{
    border:none;background:transparent;border-radius:0;
  }
  body:has(.page-content--customer) .order-history__header{display:none;}
  body:has(.page-content--customer) .order-history__row{
    display:grid;grid-template-columns:1fr 1fr;gap:.5rem 1rem;
    background:#fff;border:1px solid #e7e5e4;border-radius:.85rem;
    padding:1rem 1.1rem;margin-bottom:.85rem;
  }
  body:has(.page-content--customer) .order-history__cell{
    padding:0;font-size:.88rem;display:flex;flex-direction:column;
  }
  body:has(.page-content--customer) .order-history__cell::before{
    content:attr(data-ps-label);
    font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
    font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:#78716c;
    margin-bottom:.2rem;
  }
  body:has(.page-content--customer) .order-history__cell--actions{
    grid-column:1 / -1;flex-direction:row;
  }
  body:has(.page-content--customer) .order-history__cell--actions::before{display:none;}
}

/* Alerts -------------------------------------------------------------------- */
body:has(.page-content--customer) .alert{
  border:1px solid #e7e5e4;border-radius:1rem;padding:1rem 1.25rem;
  font-size:.92rem;
}
body:has(.page-content--customer) .alert-info,
body:has(.page-content--customer) .alert-warning{
  background:#fafaf9!important;border-color:#e7e5e4!important;color:#44403c!important;
}
/* Contact form — hide the honeypot field. It's a bot-trap input that humans
   never see. Use position:absolute + clip-path so it stays focusable for AT
   tools (would be skipped by tabindex=-1 anyway) but never paints. */
.ik-contact-trap{
  position:absolute!important;left:-10000px!important;top:auto!important;
  width:1px!important;height:1px!important;overflow:hidden!important;
}

/* Stockalert "My stock alerts" populated list — editorial cards. Theme
   override .tpl emits .ikara-stockalert-* markup. */
body#module-stockalert-account .ikara-stockalert-list{
  display:grid;grid-template-columns:1fr;gap:.85rem;
}
body#module-stockalert-account .ikara-stockalert-card{
  display:grid;
  grid-template-columns:84px 1fr auto;
  gap:1.1rem;align-items:center;
  background:#fff;
  border:1px solid #e7e5e4;border-radius:1rem;
  padding:.9rem 1.1rem;
}
body#module-stockalert-account .ikara-stockalert-card__media{
  display:block;width:84px;height:84px;border-radius:.65rem;
  overflow:hidden;background:#f5f5f4;
  border:1px solid #e7e5e4;
}
body#module-stockalert-account .ikara-stockalert-card__media img{
  width:100%;height:100%;object-fit:cover;display:block;
}
body#module-stockalert-account .ikara-stockalert-card__body{
  display:flex;flex-direction:column;gap:.25rem;min-width:0;
}
body#module-stockalert-account .ikara-stockalert-card__title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:1rem;line-height:1.25;color:#0c0a09;
  text-decoration:none;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;
}
body#module-stockalert-account .ikara-stockalert-card__title:hover{color:#dc2626;}
body#module-stockalert-account .ikara-stockalert-card__attrs{
  font-size:.78rem;color:#57534e;
}
body#module-stockalert-account .ikara-stockalert-card__meta{
  display:flex;align-items:baseline;gap:.4rem;font-size:.72rem;
}
body#module-stockalert-account .ikara-stockalert-card__date-label{
  color:#a8a29e;font-weight:600;text-transform:uppercase;letter-spacing:.08em;
}
body#module-stockalert-account .ikara-stockalert-card__date{color:#0c0a09;font-weight:600;}
body#module-stockalert-account .ikara-stockalert-card__remove{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.55rem .9rem;
  background:transparent;color:#0c0a09;
  border:1px solid #0c0a09;border-radius:999px;
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.74rem;letter-spacing:.1em;
  text-transform:uppercase;text-decoration:none;
  transition:background .15s,color .15s,border-color .15s;
}
body#module-stockalert-account .ikara-stockalert-card__remove:hover{
  background:#dc2626;color:#fff;border-color:#dc2626;
}
body#module-stockalert-account .ikara-stockalert-card__remove .material-icons{font-size:18px;}
@media(max-width:600px){
  body#module-stockalert-account .ikara-stockalert-card{
    grid-template-columns:64px 1fr;gap:.8rem;
    padding:.8rem;
  }
  body#module-stockalert-account .ikara-stockalert-card__media{width:64px;height:64px;}
  body#module-stockalert-account .ikara-stockalert-card__remove{
    grid-column:1 / -1;justify-content:center;
  }
}

/* Stockalert empty state — same pattern as history but with notification icon */
body#module-stockalert-account .page-content--customer .alert.alert-warning,
body#module-stockalert-account .page-content--customer .alert.alert-info{
  background:#fafaf9!important;border:1px dashed #d6d3d1!important;
  border-radius:1rem!important;
  padding:3rem 1.5rem!important;text-align:center;
  color:#0c0a09!important;font-size:1rem;font-weight:500;
  position:relative;margin-top:0!important;
}
body#module-stockalert-account .page-content--customer .alert.alert-warning::before,
body#module-stockalert-account .page-content--customer .alert.alert-info::before{
  content:"notifications_none";
  font-family:'Material Icons';font-size:48px;font-weight:normal;
  display:block;color:#a8a29e;margin:0 auto .85rem;
  width:48px;height:48px;line-height:1;
}
body#module-stockalert-account .page-content--customer .alert.alert-warning::after,
body#module-stockalert-account .page-content--customer .alert.alert-info::after{
  content:"Recibirás un aviso por email cuando un producto vuelva a estar disponible.";
  display:block;font-size:.88rem;color:#78716c;font-weight:400;
  margin-top:.6rem;
}
/* History empty state — hero-card with icon + message + CTA when no orders. */
body.page-history .page-content--customer:not(:has(.order-history)) #order_history_description{
  display:none;
}
body.page-history .page-content--customer:not(:has(.order-history)) .alert-info{
  background:#fafaf9!important;border:1px dashed #d6d3d1!important;
  border-radius:1rem!important;
  padding:3rem 1.5rem!important;text-align:center;
  color:#0c0a09!important;font-size:1rem;font-weight:500;
  position:relative;margin-top:0!important;
}
body.page-history .page-content--customer:not(:has(.order-history)) .alert-info::before{
  content:"shopping_bag";
  font-family:'Material Icons';font-size:48px;font-weight:normal;
  display:block;color:#a8a29e;margin:0 auto .85rem;
  width:48px;height:48px;line-height:1;
}
body.page-history .page-content--customer:not(:has(.order-history)) .alert-info::after{
  content:"Tus pedidos aparecerán aquí cuando hagas tu primera compra.";
  display:block;font-size:.88rem;color:#78716c;font-weight:400;
  margin-top:.6rem;
}
body:has(.page-content--customer) .alert-success{
  background:#f0fdf4;border-color:#bbf7d0;color:#166534;
}
body:has(.page-content--customer) .alert-danger{
  background:#fef2f2;border-color:#fecaca;color:#991b1b;
}

/* Mobile ------------------------------------------------------------------- */
@media (max-width: 991.98px){
  body:has(.page-content--customer) .account-menu--sidebar{
    position:static;margin-bottom:1.5rem;
  }
  body:has(.page-content--customer) .page-content--customer{padding:1.5rem 1.25rem;}
  body:has(.page-content--customer) .page-header .page-title-section,
  body:has(.page-content--customer) .page-header h1{font-size:1.7rem!important;}
}

/* =============================================================================
   Authentication, registration, password reset, guest tracking — these pages
   render through page.tpl (NOT customer/page.tpl) so they carry
   .page-content--general instead of --customer. Single centered form, no
   sidebar rail. Same vocabulary as the rest of the redesign.
   ========================================================================== */
body.page-authentication #wrapper.wrapper,
body.page-registration #wrapper.wrapper,
body.page-password #wrapper.wrapper,
body.page-guest-tracking #wrapper.wrapper{
  background:#fafaf9;padding:3rem 1.5rem!important;
}
body.page-authentication #main-content,
body.page-registration #main-content,
body.page-password #main-content,
body.page-guest-tracking #main-content{
  max-width:1100px;margin:0 auto;
}
/* The actual form panel lives inside `.container.container--limited-sm`
   (~480px) or `.container--limited-md` (~560px) from the theme. Override
   on every page that renders `.page-content--general` (auth, registration,
   password reset, guest tracking, 404/410 errors) so the inner card gets
   real estate. */
body:has(.page-content--general) .container.container--limited-sm,
body:has(.page-content--general) .container.container--limited-md{
  max-width:780px!important;
}
/* Page header */
body.page-authentication .page-header,
body.page-registration .page-header,
body.page-password .page-header,
body.page-guest-tracking .page-header{
  text-align:center;margin-bottom:1.5rem;
}
body.page-authentication .page-header .page-title-section,
body.page-authentication .page-header h1,
body.page-registration .page-header .page-title-section,
body.page-registration .page-header h1,
body.page-password .page-header .page-title-section,
body.page-password .page-header h1,
body.page-guest-tracking .page-header .page-title-section,
body.page-guest-tracking .page-header h1{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:800!important;font-size:2rem!important;
  letter-spacing:-.025em!important;line-height:1.05!important;
  color:#0c0a09!important;margin:0!important;
  display:inline-flex;align-items:center;gap:.85rem;
}
body.page-authentication .page-header .page-title-section::before,
body.page-authentication .page-header h1::before,
body.page-registration .page-header .page-title-section::before,
body.page-registration .page-header h1::before,
body.page-password .page-header .page-title-section::before,
body.page-password .page-header h1::before,
body.page-guest-tracking .page-header .page-title-section::before,
body.page-guest-tracking .page-header h1::before{
  content:"";width:28px;height:4px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;
}
/* Container card */
body.page-authentication .page-content--general,
body.page-registration .page-content--general,
body.page-password .page-content--general,
body.page-guest-tracking .page-content--general{
  background:#fff;border:1px solid #e7e5e4;border-radius:1.25rem;
  padding:2rem 2.25rem;
}
/* Mobile: shrink page padding and panel padding so the form has more
   horizontal room (iPhone 11 = 414px). Without this the inner panel ends
   up ~340px wide and inputs feel cramped. Covers every page-content--general
   page (login, register, password reset, guest tracking, 404/410). */
@media (max-width:600px){
  body:has(.page-content--general) #wrapper.wrapper{
    padding:1.5rem .75rem!important;
  }
  body:has(.page-content--general) .container.container--limited-sm,
  body:has(.page-content--general) .container.container--limited-md{
    max-width:none!important;padding-left:0!important;padding-right:0!important;
  }
  body:has(.page-content--general) .page-content--general{
    padding:1.5rem 1.1rem;border-radius:1rem;
  }
}
/* Login/register form — inputs, buttons, footer split */
body.page-authentication .form-control,
body.page-registration .form-control,
body.page-password .form-control,
body.page-guest-tracking .form-control,
body.page-authentication .form-select,
body.page-registration .form-select,
body.page-password .form-select,
body.page-guest-tracking .form-select{
  border:1px solid #e7e5e4!important;border-radius:.5rem!important;
  background:#fff!important;color:#0c0a09!important;
  font-family:'Inter',sans-serif!important;font-size:.95rem!important;
  padding:.7rem .85rem!important;
  transition:border-color .15s,box-shadow .15s;
}
body.page-authentication .form-control:focus,
body.page-registration .form-control:focus,
body.page-password .form-control:focus,
body.page-guest-tracking .form-control:focus,
body.page-authentication .form-select:focus,
body.page-registration .form-select:focus,
body.page-password .form-select:focus,
body.page-guest-tracking .form-select:focus{
  border-color:#0c0a09!important;box-shadow:0 0 0 3px rgba(12,10,9,.08)!important;
}
body.page-authentication label,body.page-authentication .form-label,
body.page-registration label,body.page-registration .form-label,
body.page-password label,body.page-password .form-label,
body.page-guest-tracking label,body.page-guest-tracking .form-label{
  font-family:'Inter',sans-serif!important;
  font-weight:600!important;font-size:.82rem!important;
  letter-spacing:.04em!important;text-transform:uppercase!important;
  color:#44403c!important;margin-bottom:.4rem!important;
}
body.page-authentication .btn-primary,
body.page-registration .btn-primary,
body.page-password .btn-primary,
body.page-guest-tracking .btn-primary{
  background:#dc2626!important;border-color:#dc2626!important;
  border-radius:.7rem!important;padding:.85rem 1.25rem!important;
  font-family:'Inter',sans-serif!important;font-weight:700!important;
  font-size:.95rem!important;letter-spacing:.02em;color:#fff!important;
}
body.page-authentication .btn-primary:hover,
body.page-registration .btn-primary:hover,
body.page-password .btn-primary:hover,
body.page-guest-tracking .btn-primary:hover{
  background:#b91c1c!important;border-color:#b91c1c!important;
}
body.page-authentication .btn-outline-primary,
body.page-registration .btn-outline-primary,
body.page-password .btn-outline-primary,
body.page-guest-tracking .btn-outline-primary{
  background:transparent!important;border:1px solid #0c0a09!important;
  border-radius:.7rem!important;padding:.85rem 1.25rem!important;
  font-family:'Inter',sans-serif!important;font-weight:700!important;
  font-size:.95rem!important;letter-spacing:.02em;color:#0c0a09!important;
}
body.page-authentication .btn-outline-primary:hover,
body.page-registration .btn-outline-primary:hover,
body.page-password .btn-outline-primary:hover,
body.page-guest-tracking .btn-outline-primary:hover{
  background:#0c0a09!important;color:#fff!important;
}
body.page-authentication .btn-basic,
body.page-registration .btn-basic,
body.page-password .btn-basic,
body.page-order .btn-basic{
  color:#78716c!important;text-decoration:underline;
  font-size:.85rem;font-weight:600;background:transparent;border:none;padding:.4rem 0;
}
body.page-authentication .btn-basic:hover,
body.page-registration .btn-basic:hover,
body.page-password .btn-basic:hover,
body.page-order .btn-basic:hover{color:#dc2626!important;}

/* Specifically the "Billing address differs from shipping address" anchor —
   it ships as .btn.btn-basic with `data-link-action="different-invoice-address"`.
   Style it as a small inline action below the address grid, separated by a
   thin top border so it reads as a meta-action rather than a primary CTA. */
body.page-order [data-link-action="different-invoice-address"]{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.55rem 0;margin-top:.75rem;
  color:#44403c!important;text-decoration:none;
  font-family:'Inter',sans-serif;font-weight:600;font-size:.78rem;
  letter-spacing:.04em;
  border-top:1px dashed #e7e5e4;
  border-radius:0;
  width:auto;
}
body.page-order [data-link-action="different-invoice-address"]::before{
  content:"add";font-family:'Material Icons';font-size:16px;
  color:#dc2626;font-weight:normal;letter-spacing:0;
}
body.page-order [data-link-action="different-invoice-address"]:hover{
  color:#dc2626!important;text-decoration:none;
}

/* =============================================================================
   Order recap product line (.order-confirmation__product) — used in:
   1. The payment-step "Please check your order" final-summary card.
   2. The post-checkout order-confirmation page.
   The stock template is structurally close to .product-line but with its own
   class namespace; we re-skin it with the same editorial language so the user
   sees the same row format across cart → payment review → confirmation.
   ============================================================================= */
body.page-order .order-confirmation__product,
body#order-confirmation .order-confirmation__product{
  display:grid;
  grid-template-columns:80px minmax(0,1fr) auto;
  gap:1rem;align-items:center;
  padding:1rem 0;
  border-bottom:1px solid #e7e5e4;
}
body.page-order .order-confirmation__product:last-child,
body#order-confirmation .order-confirmation__product:last-child{border-bottom:none;}

body.page-order .order-confirmation__product-image,
body#order-confirmation .order-confirmation__product-image{
  width:80px;height:80px;flex-shrink:0;
  border-radius:.5rem;overflow:hidden;background:#fafaf9;position:relative;
  margin:0;
}
body.page-order .order-confirmation__product-image picture,
body.page-order .order-confirmation__product-image .order-confirmation__product-img,
body#order-confirmation .order-confirmation__product-image picture,
body#order-confirmation .order-confirmation__product-image .order-confirmation__product-img{
  width:100%!important;height:100%!important;object-fit:cover;display:block;max-width:none;
}
/* Quantity badge — sits on top-right of the image when qty > 1 */
body.page-order .order-confirmation__product-quantity,
body#order-confirmation .order-confirmation__product-quantity{
  position:absolute;top:-6px;right:-6px;margin:0;
  background:#0c0a09;color:#fff;
  width:22px;height:22px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:.65rem;font-weight:700;letter-spacing:0;
}

body.page-order .order-confirmation__product-content,
body#order-confirmation .order-confirmation__product-content{
  display:contents;
}
body.page-order .order-confirmation__product-details,
body#order-confirmation .order-confirmation__product-details{
  grid-column:2;min-width:0;
  display:flex;flex-direction:column;gap:.4rem;
}
body.page-order .order-confirmation__product-prices,
body#order-confirmation .order-confirmation__product-prices{
  grid-column:3;min-width:0;
  display:flex;flex-direction:column;align-items:flex-end;
}

/* Title */
body.page-order .order-confirmation__product-link,
body#order-confirmation .order-confirmation__product-link{text-decoration:none;}
body.page-order .order-confirmation__product-title,
body#order-confirmation .order-confirmation__product-title{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:700;font-size:.95rem;line-height:1.2;
  color:#0c0a09;letter-spacing:-.005em;margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;
}
body.page-order .order-confirmation__product-link:hover .order-confirmation__product-title,
body#order-confirmation .order-confirmation__product-link:hover .order-confirmation__product-title{
  color:#dc2626;
}

/* Attributes — chip cluster */
body.page-order .order-confirmation__product-attributes,
body#order-confirmation .order-confirmation__product-attributes{
  display:flex;flex-wrap:wrap;gap:.3rem;margin:0;
}
body.page-order .order-confirmation__product-attribute,
body#order-confirmation .order-confirmation__product-attribute{
  display:inline-flex;align-items:center;gap:.25rem;
  padding:.18rem .5rem;
  background:#fafaf9;border:1px solid #e7e5e4;border-radius:999px;
  font-size:.7rem;font-weight:500;color:#44403c;
}
body.page-order .order-confirmation__product-attribute .label,
body#order-confirmation .order-confirmation__product-attribute .label{
  color:#a8a29e;font-weight:600;text-transform:uppercase;
  letter-spacing:.05em;font-size:.62rem;
}

/* Reference — small, secondary */
body.page-order .order-confirmation__product-reference,
body#order-confirmation .order-confirmation__product-reference{
  font-size:.7rem;color:#a8a29e;margin:0;
  letter-spacing:.04em;
}

/* Unit price — small below chips */
body.page-order .order-confirmation__product-price,
body#order-confirmation .order-confirmation__product-price{
  font-size:.78rem;color:#78716c;margin:0;font-weight:500;
}

/* Right column total — bold editorial */
body.page-order .order-confirmation__product-total,
body#order-confirmation .order-confirmation__product-total{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:1rem;
  color:#0c0a09;letter-spacing:-.01em;
  font-variant-numeric:tabular-nums;line-height:1;
}

/* Subtotal/total lines below the products list */
body.page-order .order-confirmation__line,
body#order-confirmation .order-confirmation__line{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:.4rem 0;
  font-size:.92rem;color:#44403c;
}
body.page-order .order-confirmation__line-label,
body#order-confirmation .order-confirmation__line-label{
  color:#57534e;font-weight:500;
}
body.page-order .order-confirmation__line-value,
body#order-confirmation .order-confirmation__line-value{
  color:#0c0a09;font-weight:600;font-variant-numeric:tabular-nums;
}
body.page-order .order-confirmation__line--bold,
body#order-confirmation .order-confirmation__line--bold{
  margin-top:.4rem;padding-top:.7rem;border-top:1px solid #0c0a09;
  font-size:1.05rem;
}
body.page-order .order-confirmation__line--bold .order-confirmation__line-label,
body#order-confirmation .order-confirmation__line--bold .order-confirmation__line-label{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;color:#0c0a09;font-size:.85rem;
}
body.page-order .order-confirmation__line--bold .order-confirmation__line-value,
body#order-confirmation .order-confirmation__line--bold .order-confirmation__line-value{
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:800;
  font-size:1.4rem;color:#0c0a09;letter-spacing:-.01em;
}

/* HRs inside the table — softer, no margin */
body.page-order .order-confirmation__table > hr,
body#order-confirmation .order-confirmation__table > hr{
  border:none;border-top:1px solid #e7e5e4;margin:.75rem 0;
}

/* Final-summary section (payment step recap) — strip the Bootstrap card chrome
   that wraps the order-confirmation table; it duplicates our editorial card. */
body.page-order .final-summary__order-table.card{
  border:none!important;background:transparent!important;
}
body.page-order .final-summary__order-table > .card-body{padding:0!important;}
body.page-order .final-summary > hr{
  border:none;border-top:1px solid #e7e5e4;margin:1.5rem 0;
}
body.page-order .final-summary p.h2{
  font-family:'Space Grotesk','Inter',sans-serif;
  font-weight:800;font-size:1.4rem;letter-spacing:-.02em;
  color:#0c0a09;margin:0 0 1rem;
}
body.page-order .final-summary__header{
  display:flex;justify-content:space-between;align-items:center;gap:1rem;
  font-family:'Inter',sans-serif;font-weight:600;font-size:.78rem;
  letter-spacing:.12em;text-transform:uppercase;color:#0c0a09;
  margin:1.5rem 0 .75rem;padding-bottom:.4rem;
  border-bottom:1px solid #e7e5e4;
}

/* Step content headlines — "Shipping Address", "Your Invoice Address" */
body.page-order .step__content > .h3,
body.page-order .step__content > h3,
body.page-order .step__content > p.h3{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700;font-size:.95rem;letter-spacing:.12em;text-transform:uppercase;
  color:#0c0a09;margin:1.25rem 0 .75rem;
  display:flex;align-items:center;gap:.55rem;
}
body.page-order .step__content > .h3::before,
body.page-order .step__content > h3::before,
body.page-order .step__content > p.h3::before{
  content:"";width:18px;height:2px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;
}
body.page-order .step__content > p:not(.h3):not(.alert){
  font-size:.9rem;color:#57534e;margin:0 0 1rem;line-height:1.5;
}
/* Login footer — split between forgot pwd link and submit */
body.page-authentication .buttons-wrapper--split{
  display:flex;justify-content:space-between;align-items:center;gap:.75rem;
  margin-top:1.25rem;
}
/* Login bottom: register prompt */
body.page-authentication .login__register-prompt{
  text-align:center;margin-top:1.5rem;
}
body.page-authentication .login__register-prompt h2,
body.page-authentication .login__register-prompt .h4{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:1.05rem!important;
  color:#0c0a09!important;margin:0 0 .85rem;letter-spacing:-.01em;
}
body.page-authentication hr{
  border:none;border-top:1px solid #e7e5e4;margin:1.5rem 0;
}
/* Alerts inside auth pages */
body.page-authentication .alert,
body.page-registration .alert,
body.page-password .alert,
body.page-guest-tracking .alert{
  border:1px solid #e7e5e4;border-radius:1rem;padding:1rem 1.25rem;
  font-size:.92rem;margin-bottom:1.25rem;
}
body.page-authentication .alert-danger,
body.page-registration .alert-danger,
body.page-password .alert-danger,
body.page-guest-tracking .alert-danger{
  background:#fef2f2;border-color:#fecaca;color:#991b1b;
}
body.page-authentication .alert-success,
body.page-registration .alert-success,
body.page-password .alert-success,
body.page-guest-tracking .alert-success{
  background:#f0fdf4;border-color:#bbf7d0;color:#166534;
}

/* =============================================================================
   Order confirmation (`page-order-confirmation`) — post-checkout thank-you.
   Centered hero with success accent, then the order summary table.
   ========================================================================== */
body.page-order-confirmation #wrapper.wrapper{
  background:#fafaf9;padding:3rem 1.5rem!important;
}
body.page-order-confirmation #main-content{max-width:900px;margin:0 auto;}
body.page-order-confirmation .breadcrumb{display:none!important;}
body.page-order-confirmation .page-header{text-align:center;margin-bottom:2rem;}
body.page-order-confirmation .page-header .page-title-section,
body.page-order-confirmation .page-header h1{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:800!important;font-size:2.5rem!important;
  letter-spacing:-.025em!important;line-height:1.05!important;
  color:#0c0a09!important;margin:0!important;
  display:inline-flex;align-items:center;gap:.85rem;
}
body.page-order-confirmation .page-header .page-title-section::before,
body.page-order-confirmation .page-header h1::before{
  content:"";width:32px;height:4px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;
}
body.page-order-confirmation .page-content,
body.page-order-confirmation .page-content--general{
  background:#fff;border:1px solid #e7e5e4;border-radius:1.25rem;
  padding:2rem 2.25rem;
}
body.page-order-confirmation .order-confirmation-table,
body.page-order-confirmation .order-confirmation__table{
  border:1px solid #e7e5e4;border-radius:1rem;overflow:hidden;margin:1.25rem 0;
}
body.page-order-confirmation .alert-success{
  background:#f0fdf4;border:1px solid #bbf7d0;color:#166534;
  border-radius:1rem;padding:1rem 1.25rem;
}
body.page-order-confirmation .btn-primary{
  background:#dc2626!important;border-color:#dc2626!important;
  border-radius:.7rem!important;padding:.85rem 1.25rem!important;
  color:#fff!important;font-weight:700!important;
}
body.page-order-confirmation .btn-primary:hover{
  background:#b91c1c!important;border-color:#b91c1c!important;
}

/* =============================================================================
   Search results page (`page-search`) — list of products from the search
   query. Reuses the category listing markup so the existing category styles
   already cover the grid; we just add a hero treatment for the query.
   ========================================================================== */
body.page-search #wrapper.wrapper{background:#fafaf9;}
body.page-search .page-header{
  max-width:1200px;margin:1.5rem auto 1rem;padding:0 1.5rem;
}
body.page-search .page-header .page-title-section,
body.page-search .page-header h1{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:800!important;font-size:2rem!important;
  letter-spacing:-.025em!important;line-height:1.05!important;
  color:#0c0a09!important;margin:0!important;
  display:flex;align-items:center;gap:.85rem;
}
body.page-search .page-header .page-title-section::before,
body.page-search .page-header h1::before{
  content:"";width:28px;height:4px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;
}

/* =============================================================================
   Redsys payment error page (`#module-redsys-errorpayment`) — rendered through
   page.tpl, no `page-*` class. Centered hero card with red error mark, cause
   panel and dual CTA. Mirrors the order-confirmation hero treatment.
   ========================================================================== */
body#module-redsys-errorpayment #wrapper.wrapper{
  background:#fafaf9;padding:3rem 1.5rem!important;
}
body#module-redsys-errorpayment #main-content{max-width:720px;margin:0 auto;}
body#module-redsys-errorpayment .breadcrumb{display:none!important;}
body#module-redsys-errorpayment .page-header{display:none!important;}
body#module-redsys-errorpayment #content.page-content,
body#module-redsys-errorpayment .page-content--general{
  background:transparent;border:none;padding:0;
}
body#module-redsys-errorpayment .redsys_ko{
  background:#fff;border:1px solid #e7e5e4;border-radius:1.25rem;
  padding:2.75rem 2.25rem;text-align:center;
  display:flex;flex-direction:column;align-items:center;
}
body#module-redsys-errorpayment .redsys_ko__icon{
  width:88px;height:88px;border-radius:999px;
  background:#fef2f2;color:#dc2626;
  display:inline-flex;align-items:center;justify-content:center;
  margin-bottom:1.25rem;
}
body#module-redsys-errorpayment .redsys_ko__eyebrow{
  font-family:'Inter',sans-serif;font-weight:600;font-size:.78rem;
  letter-spacing:.14em;text-transform:uppercase;color:#dc2626;
  display:inline-flex;align-items:center;gap:.6rem;margin-bottom:.85rem;
}
body#module-redsys-errorpayment .redsys_ko__eyebrow::before{
  content:"";width:22px;height:3px;background:#dc2626;
  transform:skewX(-20deg);
}
body#module-redsys-errorpayment .redsys_ko__title,
body#module-redsys-errorpayment .redsys_ko h1{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:800!important;font-size:2.1rem!important;
  letter-spacing:-.025em!important;line-height:1.1!important;
  color:#0c0a09!important;margin:0 0 1.25rem!important;
  max-width:32ch;
}
body#module-redsys-errorpayment .redsys_ko__cause{
  width:100%;background:#fef2f2;border:1px solid #fecaca;
  border-radius:1rem;padding:1rem 1.25rem;margin:.25rem 0 1.25rem;
  text-align:left;display:flex;flex-direction:column;gap:.25rem;
}
body#module-redsys-errorpayment .redsys_ko__cause-label{
  font-family:'Inter',sans-serif;font-weight:700;font-size:.72rem;
  letter-spacing:.12em;text-transform:uppercase;color:#991b1b;
}
body#module-redsys-errorpayment .redsys_ko__cause-text{
  font-family:'Inter',sans-serif;font-size:.95rem;font-weight:500;
  color:#7f1d1d;line-height:1.5;
}
body#module-redsys-errorpayment .redsys_ko__hint{
  font-family:'Inter',sans-serif;font-size:.95rem;color:#57534e;
  line-height:1.55;margin:0 0 1.75rem;max-width:46ch;
}
body#module-redsys-errorpayment .redsys_ko__actions{
  display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;width:100%;
}
body#module-redsys-errorpayment .redsys_ko__cta,
body#module-redsys-errorpayment .redsys_ko .btn-primary{
  background:#dc2626!important;border:1px solid #dc2626!important;
  border-radius:.7rem!important;padding:.85rem 1.4rem!important;
  font-family:'Inter',sans-serif!important;font-weight:700!important;
  font-size:.95rem!important;letter-spacing:.02em;color:#fff!important;
  text-decoration:none!important;display:inline-flex;align-items:center;
  justify-content:center;min-width:180px;transition:background .15s,border-color .15s;
}
body#module-redsys-errorpayment .redsys_ko__cta:hover,
body#module-redsys-errorpayment .redsys_ko .btn-primary:hover{
  background:#b91c1c!important;border-color:#b91c1c!important;color:#fff!important;
}
body#module-redsys-errorpayment .redsys_ko__cta-alt,
body#module-redsys-errorpayment .redsys_ko .btn-outline-primary{
  background:transparent!important;border:1px solid #0c0a09!important;
  border-radius:.7rem!important;padding:.85rem 1.4rem!important;
  font-family:'Inter',sans-serif!important;font-weight:700!important;
  font-size:.95rem!important;letter-spacing:.02em;color:#0c0a09!important;
  text-decoration:none!important;display:inline-flex;align-items:center;
  justify-content:center;min-width:180px;transition:background .15s,color .15s;
}
body#module-redsys-errorpayment .redsys_ko__cta-alt:hover,
body#module-redsys-errorpayment .redsys_ko .btn-outline-primary:hover{
  background:#0c0a09!important;color:#fff!important;
}
@media (max-width: 575.98px){
  body#module-redsys-errorpayment #wrapper.wrapper{padding:1.5rem 1rem!important;}
  body#module-redsys-errorpayment .redsys_ko{padding:2rem 1.25rem;}
  body#module-redsys-errorpayment .redsys_ko__title,
  body#module-redsys-errorpayment .redsys_ko h1{font-size:1.65rem!important;}
  body#module-redsys-errorpayment .redsys_ko__actions{flex-direction:column;}
  body#module-redsys-errorpayment .redsys_ko__cta,
  body#module-redsys-errorpayment .redsys_ko__cta-alt{width:100%;min-width:0;}
}

/* =============================================================================
   Search results — empty state
   `body.page-search` already gets a full-bleed wrapper for the listing. When
   there are no results the `<section.page-content--not-found>` renders alone
   with no panel and no padding, looking abandoned. Wrap it with the same
   editorial card vocabulary used by history/stockalert empty states.
   ========================================================================== */
body.page-search #js-product-list-header,
body.page-search section.page-content--not-found{
  max-width:1200px;margin:0 auto;padding-left:1.5rem;padding-right:1.5rem;
}
body.page-search #js-product-list-header .page-title-section{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:800!important;font-size:2rem!important;
  letter-spacing:-.025em!important;line-height:1.1!important;
  color:#0c0a09!important;
  display:flex;align-items:center;gap:.85rem;margin:2.5rem 0 1.5rem;
}
body.page-search #js-product-list-header .page-title-section::before{
  content:"";width:32px;height:4px;background:#dc2626;
  transform:skewX(-20deg);flex-shrink:0;display:inline-block;
}
body.page-search section.page-content--not-found{
  background:#fafaf9;border:1px dashed #d6d3d1;border-radius:1rem;
  padding:3rem 1.5rem;text-align:center;color:#0c0a09;
  font-size:1rem;font-weight:500;position:relative;margin-bottom:3rem;
}
body.page-search section.page-content--not-found::before{
  content:"search_off";font-family:'Material Icons';font-size:48px;
  font-weight:normal;display:block;color:#a8a29e;margin:0 auto .85rem;
  width:48px;height:48px;line-height:1;
}
body.page-search section.page-content--not-found p{
  margin:0;color:#78716c;font-weight:400;font-size:.92rem;
}

/* =============================================================================
   CMS pages — flat text content (Aviso legal, Privacidad, Devoluciones, ...)
   The Bootstrap accordion buttons render with a dark-blue active state by
   default, and links in CMS bodies pick up the theme's blue. Both are out
   of palette — repaint to #0c0a09 / #dc2626 so legal pages match the rest.
   ========================================================================== */
/* Accordion + link reskin — only on flat-text CMS pages (Aviso legal, etc.).
   Elementor pages have their own component styling that we shouldn't pisar. */
body.page-cms:not(.elementor-page) .accordion{
  background:transparent;border:none;
}
body.page-cms:not(.elementor-page) .accordion-item{
  background:transparent!important;border:none!important;
  border-bottom:1px solid #e7e5e4!important;
}
body.page-cms:not(.elementor-page) .accordion-item:last-child{border-bottom:none!important;}
body.page-cms:not(.elementor-page) .accordion-button,
body.page-cms:not(.elementor-page) .accordion-button.collapsed{
  background:transparent!important;background-color:transparent!important;
  color:#0c0a09!important;
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-weight:700!important;font-size:1rem!important;
  letter-spacing:.04em;text-transform:uppercase;
  padding:1rem 0!important;
  border:none!important;box-shadow:none!important;
}
body.page-cms:not(.elementor-page) .accordion-button:not(.collapsed){
  color:#0c0a09!important;
}
body.page-cms:not(.elementor-page) .accordion-button:focus{
  box-shadow:none!important;border:none!important;
}
body.page-cms:not(.elementor-page) .accordion-button::after{
  filter:none;
}
body.page-cms:not(.elementor-page) .accordion-body{
  padding:.5rem 0 1.25rem!important;
  color:#44403c;font-size:.95rem;line-height:1.65;
}
/* Inline links in any CMS body */
body.page-cms:not(.elementor-page) .cms-block a,
body.page-cms:not(.elementor-page) .accordion-body a,
body.page-cms:not(.elementor-page) #content a:not(.btn){
  color:#0c0a09!important;text-decoration:underline;text-underline-offset:3px;
  transition:color .15s;
}
body.page-cms:not(.elementor-page) .cms-block a:hover,
body.page-cms:not(.elementor-page) .accordion-body a:hover,
body.page-cms:not(.elementor-page) #content a:not(.btn):hover{color:#dc2626!important;}
/* Generic h2/h3/h4 in CMS body content (when they're not inside an accordion).
   Skip Elementor pages — those bring their own typography from the page
   builder and our override would crush the landing layouts. */
body.page-cms:not(.elementor-page) #content h1,
body.page-cms:not(.elementor-page) #content h2,
body.page-cms:not(.elementor-page) #content h3,
body.page-cms:not(.elementor-page) #content h4{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  color:#0c0a09!important;letter-spacing:-.01em;
}

/* Modal "Solicitud mayorista" — the dark header needs a white title. The
   ikgymform module ships the modal with `.ikgymform-modal__header` (dark
   background) but the H2 inherits black from the global heading rules. */
.ikgymform-modal .ikgymform-modal__title,
#ikgymformModal .ikgymform-modal__title,
#ikgymformModal h2.modal-title{
  color:#fff!important;
}

/* =============================================================================
   Password input toggle eye — the theme's `data-ps-action="toggle-password"`
   button inherits .btn-primary which makes it a giant red square next to the
   password field. Slim it down to a square with a subtle border and a grey
   icon that turns red on hover, matching the rest of the form chrome.
   ========================================================================== */
.input-group.password-field{position:relative;}
.input-group.password-field button[data-ps-action="toggle-password"],
.input-group.password-field button.btn.btn-primary[data-ps-action="toggle-password"]{
  background:transparent!important;background-color:transparent!important;
  border:1px solid #e7e5e4!important;color:#78716c!important;
  border-radius:.5rem!important;
  padding:0!important;margin-left:.4rem!important;
  width:42px;height:42px;flex:0 0 42px;
  display:inline-flex;align-items:center;justify-content:center;
  box-shadow:none!important;
  transition:color .15s,border-color .15s,background .15s;
}
.input-group.password-field button[data-ps-action="toggle-password"]:hover,
.input-group.password-field button[data-ps-action="toggle-password"]:focus{
  background:transparent!important;color:#dc2626!important;
  border-color:#0c0a09!important;
}
.input-group.password-field button[data-ps-action="toggle-password"] .material-icons{
  font-size:20px!important;color:inherit;line-height:1;
}

/* =============================================================================
   CMS id=4 "Nosotros" — editorial layout served via cms/page-id-4.tpl override.
   All rules scoped under body.cms-id-4 .about so they don't leak to other CMS pages.
   ========================================================================== */
body.cms-id-4 .page-content--cms{padding:0!important;background:transparent!important;border:none!important;box-shadow:none!important;}
body.cms-id-4 .page-header,
body.cms-id-4 .breadcrumb,
body.cms-id-4 .breadcrumb__wrapper{display:none!important;}
body.cms-id-4 #content-wrapper,
body.cms-id-4 .container--limited-md,
body.cms-id-4 .container--limited-lg,
body.cms-id-4 .container.container--limited-md{max-width:none!important;padding:0!important;margin:0!important;}
body.cms-id-4 main.wrapper,
body.cms-id-4 #main{padding:0!important;}

/* Break out of the theme's .columns-container/.center-column wrapper so the
   editorial sections (full-bleed dark hero, mosaic, brands…) span the entire
   viewport. Body retains overflow-x:hidden via the global rules. */
body.cms-id-4 #wrapper,
body.cms-id-4 .columns-container,
body.cms-id-4 .center-column{
  max-width:none!important;width:auto!important;
  margin-inline:0!important;padding-inline:0!important;
}

body.cms-id-4 .about{
  --about-ink:#0c0a09;--about-ink-2:#1c1917;--about-ink-3:#44403c;--about-mute:#78716c;
  --about-red:#dc2626;--about-red-2:#991b1b;
  --about-paper:#fafaf9;--about-paper-2:#f5f5f4;--about-paper-3:#e7e5e4;
  --about-ease:cubic-bezier(.2,.7,.2,1);
  font-family:'Inter',sans-serif;color:var(--about-ink);
  -webkit-font-smoothing:antialiased;
  width:100%;
}
body.cms-id-4 .about a{color:inherit;text-decoration:none;}
body.cms-id-4 .about img{max-width:100%;display:block;}
body.cms-id-4 .about *,
body.cms-id-4 .about *::before,
body.cms-id-4 .about *::after{box-sizing:border-box;}

body.cms-id-4 .about__container{max-width:1440px;margin:0 auto;padding:0 1.75rem;}
body.cms-id-4 .about__container--tight{max-width:1240px;}

body.cms-id-4 .about__tag{
  display:inline-flex;align-items:center;gap:.55rem;
  font-weight:700;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--about-red);
}
body.cms-id-4 .about__tag::before{content:"";width:24px;height:1px;background:var(--about-red);}
body.cms-id-4 .about__tag--ink{color:var(--about-ink);}
body.cms-id-4 .about__tag--paper{color:#fff;}
body.cms-id-4 .about__tag--paper::before{background:var(--about-red);}

body.cms-id-4 .about__display{font-weight:900;letter-spacing:-.045em;line-height:.95;}
body.cms-id-4 .about__display--xl{font-size:clamp(3.25rem,9vw,9rem);}
body.cms-id-4 .about__display--lg{font-size:clamp(2.5rem,5vw,5rem);}
body.cms-id-4 .about__display--md{font-size:clamp(1.75rem,3vw,2.5rem);}

body.cms-id-4 .about__btn{
  display:inline-flex;align-items:center;gap:.55rem;
  font-weight:700;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  padding:1rem 1.5rem;border-radius:999px;
  border:1px solid transparent;cursor:pointer;
  transition:transform .25s var(--about-ease),background .25s,color .25s,border-color .25s;
  position:relative;overflow:hidden;
}
body.cms-id-4 .about__btn .material-icons{font-size:18px;transition:transform .25s var(--about-ease);}
body.cms-id-4 .about__btn:hover .material-icons{transform:translateX(4px);}
body.cms-id-4 .about__btn--primary{background:var(--about-red);color:#fff;}
body.cms-id-4 .about__btn--primary:hover{background:var(--about-ink);color:#fff;}
body.cms-id-4 .about__btn--ghost-light{border-color:rgba(255,255,255,.25);color:#fff;}
body.cms-id-4 .about__btn--ghost-light:hover{background:#fff;color:var(--about-ink);border-color:#fff;}
body.cms-id-4 .about__btn--ghost-dark{border-color:var(--about-ink);color:var(--about-ink);}
body.cms-id-4 .about__btn--ghost-dark:hover{background:var(--about-ink);color:#fff;}

/* HERO */
body.cms-id-4 .about__hero{
  background:var(--about-ink);color:#fff;
  position:relative;overflow:hidden;
  padding:5rem 0 0;min-height:calc(100vh - 50px);
  display:flex;flex-direction:column;justify-content:flex-end;
}
/* Static IKARA stamp watermark in place of the moving marquee. The marquee
   is now a Home-only signature; landings use this rotated, very faint seal
   so they share the brand vocabulary without competing with the Home hero. */
body.cms-id-4 .about__hero-stamp{
  position:absolute;top:50%;right:-9%;
  width:min(72vh,52vw);max-width:780px;height:auto;
  transform:translateY(-50%) rotate(-8deg);
  opacity:.07;pointer-events:none;user-select:none;z-index:0;
  filter:invert(1) brightness(1.6);
}
@media (max-width:991.98px){
  body.cms-id-4 .about__hero-stamp{
    width:min(95vw,520px);right:-22%;top:42%;
  }
}

body.cms-id-4 .about__hero-content{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.4fr 1fr;gap:4rem;align-items:end;
  padding-bottom:5rem;
}
body.cms-id-4 .about__title{margin:1.5rem 0 1.25rem;color:#fff;}
body.cms-id-4 .about__lead{
  font-size:1.1rem;color:rgba(255,255,255,.72);
  line-height:1.7;max-width:54ch;margin:0 0 2rem;
}
body.cms-id-4 .about__cta{display:flex;gap:.65rem;flex-wrap:wrap;}

body.cms-id-4 .about__hero-side{position:relative;display:flex;flex-direction:column;gap:1.25rem;}
body.cms-id-4 .about__hero-photo{
  position:relative;aspect-ratio:4/5;border-radius:1rem;overflow:hidden;
  background:#fff;border:1px solid rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;
}
body.cms-id-4 .about__hero-photo::before{
  content:"";position:absolute;inset:0;
  background:url('/img/cms/about/about-storefront-close.webp') center/cover no-repeat,
             linear-gradient(135deg,#fafaf9 0%,#f5f5f4 100%);
}
body.cms-id-4 .about__hero-photo::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(12,10,9,.85) 100%);
}
body.cms-id-4 .about__hero-photo-meta{position:absolute;left:1.25rem;bottom:1.25rem;right:1.25rem;color:#fff;z-index:2;}
body.cms-id-4 .about__hero-photo-meta .about__name{font-weight:800;font-size:1.1rem;letter-spacing:-.01em;}
body.cms-id-4 .about__hero-photo-meta .about__role{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;opacity:.78;margin-top:.25rem;}

body.cms-id-4 .about__hero-rule{
  border-top:1px solid rgba(255,255,255,.08);
  display:flex;justify-content:space-between;padding:1.25rem 0;
  font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(255,255,255,.5);font-weight:600;
  position:relative;z-index:2;
}
body.cms-id-4 .about__dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--about-red);margin-right:.5rem;vertical-align:middle;}

/* STATS */
body.cms-id-4 .about__stats{background:var(--about-ink);padding:0 0 6rem;color:#fff;position:relative;z-index:1;}
body.cms-id-4 .about__stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.85rem;}
body.cms-id-4 .about__stats-card{
  position:relative;padding:2rem 1.5rem 1.75rem;
  border:1px solid rgba(255,255,255,.08);border-radius:1rem;
  background:rgba(255,255,255,.02);
  transition:transform .35s var(--about-ease),background .25s,border-color .25s;
  display:flex;flex-direction:column;gap:.5rem;overflow:hidden;
}
body.cms-id-4 .about__stats-card:hover{transform:translateY(-4px);background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.4);}
body.cms-id-4 .about__stats-card::after{
  content:attr(data-icon);font-family:'Material Icons';
  position:absolute;right:1rem;top:1rem;
  font-size:22px;color:rgba(255,255,255,.18);transition:color .25s;
}
body.cms-id-4 .about__stats-card:hover::after{color:var(--about-red);}
body.cms-id-4 .about__stats-num{font-weight:900;font-size:3.2rem;letter-spacing:-.04em;line-height:1;}
body.cms-id-4 .about__stats-lbl{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6);font-weight:700;margin-top:.5rem;}
body.cms-id-4 .about__stats-hint{font-size:.85rem;color:rgba(255,255,255,.78);}

/* MANIFESTO */
body.cms-id-4 .about__manifesto{background:var(--about-paper);color:var(--about-ink);padding:7rem 0;border-top:1px solid var(--about-paper-3);border-bottom:1px solid var(--about-paper-3);}
body.cms-id-4 .about__manifesto-grid{display:grid;grid-template-columns:1fr 2fr;gap:5rem;align-items:start;}
body.cms-id-4 .about__manifesto-intro p{font-size:1rem;color:var(--about-ink-3);line-height:1.7;margin:0 0 1rem;}
body.cms-id-4 .about__manifesto-quote{
  font-weight:900;font-size:clamp(2rem,4vw,4.5rem);letter-spacing:-.03em;line-height:1.05;
  color:var(--about-ink);margin:0 0 2.5rem;
}
body.cms-id-4 .about__manifesto-sig{display:flex;align-items:center;gap:1rem;border-top:1px solid var(--about-paper-3);padding-top:1.25rem;margin-top:1.5rem;}
body.cms-id-4 .about__manifesto-sig-avatar{
  width:48px;height:48px;border-radius:50%;
  background:#fff center/cover no-repeat;flex-shrink:0;
  background-image:url('/img/cms/about/about-embroidery.webp');
  border:1px solid var(--about-paper-3);
}
body.cms-id-4 .about__manifesto-sig-name{font-weight:800;font-size:.95rem;letter-spacing:-.005em;}
body.cms-id-4 .about__manifesto-sig-role{font-size:.74rem;letter-spacing:.15em;text-transform:uppercase;color:var(--about-mute);font-weight:600;margin-top:.15rem;}

/* MOSAIC */
body.cms-id-4 .about__mosaic{padding:6rem 0;background:var(--about-paper);color:var(--about-ink);}
body.cms-id-4 .about__mosaic-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:2.5rem;flex-wrap:wrap;}
body.cms-id-4 .about__mosaic-title{margin:0;}
body.cms-id-4 .about__mosaic-hint{font-size:.95rem;color:var(--about-mute);max-width:42ch;}
body.cms-id-4 .about__mosaic-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:120px;gap:.85rem;}
body.cms-id-4 .about__mosaic-cell{position:relative;border-radius:1rem;overflow:hidden;background:#1c1917;cursor:pointer;}
body.cms-id-4 .about__mosaic-cell img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--about-ease);}
body.cms-id-4 .about__mosaic-cell:hover img{transform:scale(1.06);}
body.cms-id-4 .about__mosaic-cell::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(12,10,9,.7) 100%);pointer-events:none;}
body.cms-id-4 .about__mosaic-caption{position:absolute;left:1rem;bottom:1rem;color:#fff;z-index:2;}
body.cms-id-4 .about__mosaic-caption .yr{font-weight:900;font-size:1.4rem;letter-spacing:-.02em;}
body.cms-id-4 .about__mosaic-caption .ttl{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;opacity:.92;}
body.cms-id-4 .about__mosaic-cell--a{grid-column:span 7;grid-row:span 4;}
body.cms-id-4 .about__mosaic-cell--b{grid-column:span 5;grid-row:span 2;}
body.cms-id-4 .about__mosaic-cell--c{grid-column:span 5;grid-row:span 2;}
body.cms-id-4 .about__mosaic-cell--d{grid-column:span 4;grid-row:span 3;}
body.cms-id-4 .about__mosaic-cell--e{grid-column:span 4;grid-row:span 3;}
body.cms-id-4 .about__mosaic-cell--f{grid-column:span 4;grid-row:span 3;}

/* TIMELINE */
body.cms-id-4 .about__tl{padding:7rem 0;background:#fff;color:var(--about-ink);}
body.cms-id-4 .about__tl-head{display:grid;grid-template-columns:1fr 1.5fr;gap:4rem;align-items:end;margin-bottom:4rem;}
body.cms-id-4 .about__tl-lead{font-size:1.05rem;line-height:1.7;color:var(--about-ink-3);max-width:50ch;}
body.cms-id-4 .about__tl-list{position:relative;padding-left:0;list-style:none;margin:0;}
body.cms-id-4 .about__tl-list::before{content:"";position:absolute;left:120px;top:.5rem;bottom:.5rem;width:1px;background:var(--about-paper-3);}
body.cms-id-4 .about__tl-item{display:grid;grid-template-columns:120px 1fr;gap:3rem;padding:1.5rem 0;border-bottom:1px dashed var(--about-paper-3);position:relative;transition:padding-left .3s var(--about-ease);}
body.cms-id-4 .about__tl-item:hover{padding-left:1rem;}
body.cms-id-4 .about__tl-item:last-child{border-bottom:0;}
body.cms-id-4 .about__tl-year{font-weight:900;font-size:1.6rem;letter-spacing:-.025em;color:var(--about-ink);position:relative;}
body.cms-id-4 .about__tl-year::after{content:"";position:absolute;right:-1.55rem;top:.55rem;width:13px;height:13px;border-radius:50%;background:#fff;border:2px solid var(--about-red);z-index:1;transition:background .25s;}
body.cms-id-4 .about__tl-item:hover .about__tl-year::after{background:var(--about-red);}
body.cms-id-4 .about__tl-body strong{display:block;font-weight:800;font-size:1.1rem;margin-bottom:.4rem;letter-spacing:-.01em;}
body.cms-id-4 .about__tl-body p{font-size:.95rem;color:var(--about-ink-3);line-height:1.65;margin:0;max-width:60ch;}

/* BRANDS */
body.cms-id-4 .about__brands{padding:7rem 0;background:var(--about-ink);color:#fff;}
body.cms-id-4 .about__brands-head{display:grid;grid-template-columns:1fr 1.2fr;gap:4rem;align-items:end;margin-bottom:3rem;}
body.cms-id-4 .about__brands-lead{font-size:1rem;color:rgba(255,255,255,.65);line-height:1.7;max-width:48ch;}
body.cms-id-4 .about__brands-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
body.cms-id-4 .about__brand{
  position:relative;padding:2.5rem 2rem 2rem;
  background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);
  border-radius:1.25rem;overflow:hidden;
  transition:background .3s,border-color .3s,transform .3s var(--about-ease);
  min-height:340px;display:flex;flex-direction:column;
}
body.cms-id-4 .about__brand:hover{transform:translateY(-4px);background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.5);}
body.cms-id-4 .about__brand-num{position:absolute;right:1.5rem;top:1.25rem;font-weight:900;font-size:5rem;letter-spacing:-.04em;color:rgba(255,255,255,.05);line-height:1;pointer-events:none;}
body.cms-id-4 .about__brand-role{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--about-red);font-weight:700;margin-bottom:1.25rem;}
body.cms-id-4 .about__brand-name{font-weight:900;font-size:2.5rem;letter-spacing:-.03em;line-height:1;color:#fff;margin:0 0 1rem;}
body.cms-id-4 .about__brand-desc{font-size:.95rem;color:rgba(255,255,255,.7);line-height:1.65;margin:0 0 auto;}
body.cms-id-4 .about__brand-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.5rem;}
body.cms-id-4 .about__brand-tags span{display:inline-flex;align-items:center;gap:.3rem;padding:.35rem .7rem;border-radius:999px;background:rgba(255,255,255,.06);color:rgba(255,255,255,.92);font-size:.7rem;font-weight:600;letter-spacing:.04em;}
body.cms-id-4 .about__brand-tags .material-icons{font-size:14px;color:var(--about-red);}

/* EVENT SPLIT */
body.cms-id-4 .about__event{background:var(--about-ink);color:#fff;padding:0;border-top:1px solid rgba(255,255,255,.06);display:grid;grid-template-columns:1fr 1fr;}
body.cms-id-4 .about__event-media{position:relative;min-height:580px;background:linear-gradient(135deg,#1c1917,#000);overflow:hidden;}
body.cms-id-4 .about__event-media::before{content:"";position:absolute;inset:0;background:url('/img/cms/about/about-tshirts-bag.webp') center/cover;filter:grayscale(.35);opacity:.7;}
body.cms-id-4 .about__event-media::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 40%,rgba(12,10,9,.6) 100%);}
body.cms-id-4 .about__event-media-tag{position:absolute;top:2rem;left:2rem;z-index:2;display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.95);color:var(--about-ink);padding:.6rem 1rem;border-radius:999px;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;}
body.cms-id-4 .about__event-body{padding:5rem 4rem;display:flex;flex-direction:column;justify-content:center;}
body.cms-id-4 .about__event-title{margin:1.25rem 0 1.5rem;color:#fff;}
body.cms-id-4 .about__event-lead{font-size:1.05rem;color:rgba(255,255,255,.72);line-height:1.7;margin:0 0 2.25rem;max-width:50ch;}
body.cms-id-4 .about__event-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:.85rem;}
body.cms-id-4 .about__event-num{padding:1.25rem;border:1px solid rgba(255,255,255,.08);border-radius:.85rem;background:rgba(255,255,255,.02);}
body.cms-id-4 .about__event-num strong{display:block;font-weight:900;font-size:1.85rem;letter-spacing:-.03em;line-height:1;}
body.cms-id-4 .about__event-num span{display:block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.62);font-weight:700;margin-top:.5rem;}

/* CTA */
body.cms-id-4 .about__cta-block{background:var(--about-paper);color:var(--about-ink);padding:7rem 0;text-align:center;border-top:1px solid var(--about-paper-3);}
body.cms-id-4 .about__cta-inner{max-width:780px;margin:0 auto;}
body.cms-id-4 .about__cta-title{margin:1rem 0 1rem;}
body.cms-id-4 .about__cta-lead{font-size:1.05rem;line-height:1.7;color:var(--about-ink-3);max-width:55ch;margin:0 auto 2.25rem;}
body.cms-id-4 .about__cta-row{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;}

/* Responsive */
@media(max-width:1100px){
  body.cms-id-4 .about__hero-content{grid-template-columns:1fr;gap:3rem;align-items:start;padding-bottom:4rem;}
  body.cms-id-4 .about__hero-side{flex-direction:row;align-items:flex-end;gap:2rem;}
  body.cms-id-4 .about__hero-photo{flex:1;max-width:340px;}
  body.cms-id-4 .about__stats-grid{grid-template-columns:repeat(2,1fr);}
  body.cms-id-4 .about__manifesto-grid{grid-template-columns:1fr;gap:2.5rem;}
  body.cms-id-4 .about__tl-head{grid-template-columns:1fr;gap:1.5rem;align-items:start;}
  body.cms-id-4 .about__brands-head{grid-template-columns:1fr;gap:1.5rem;align-items:start;}
  body.cms-id-4 .about__brands-grid{grid-template-columns:1fr;}
  body.cms-id-4 .about__event{grid-template-columns:1fr;}
  body.cms-id-4 .about__event-body{padding:3rem 2rem;}
  body.cms-id-4 .about__mosaic-cell--a,
  body.cms-id-4 .about__mosaic-cell--b,
  body.cms-id-4 .about__mosaic-cell--c,
  body.cms-id-4 .about__mosaic-cell--d,
  body.cms-id-4 .about__mosaic-cell--e,
  body.cms-id-4 .about__mosaic-cell--f{grid-column:span 6;grid-row:span 3;}
}
@media(max-width:600px){
  body.cms-id-4 .about__hero{padding-top:3rem;}
  body.cms-id-4 .about__stats-grid{grid-template-columns:1fr;}
  body.cms-id-4 .about__manifesto,
  body.cms-id-4 .about__tl,
  body.cms-id-4 .about__cta-block,
  body.cms-id-4 .about__brands,
  body.cms-id-4 .about__mosaic{padding:4rem 0;}
  body.cms-id-4 .about__tl-list::before{display:none;}
  body.cms-id-4 .about__tl-item{grid-template-columns:1fr;gap:.6rem;padding-left:0!important;}
  body.cms-id-4 .about__tl-year::after{display:none;}
  body.cms-id-4 .about__event-nums{grid-template-columns:1fr;}
  body.cms-id-4 .about__mosaic-cell--a,
  body.cms-id-4 .about__mosaic-cell--b,
  body.cms-id-4 .about__mosaic-cell--c,
  body.cms-id-4 .about__mosaic-cell--d,
  body.cms-id-4 .about__mosaic-cell--e,
  body.cms-id-4 .about__mosaic-cell--f{grid-column:span 12;grid-row:span 2;}
}

/* =============================================================================
   CMS id=10 "Programa para gimnasios" — editorial layout served via
   cms/page-id-10.tpl override. All rules scoped under body.cms-id-10 .gymv1.
   The form modal itself is the existing #ikgymformModal from the ikgymform
   module; this stylesheet only handles the landing layout + module host hiding.
   ========================================================================== */
body.cms-id-10 .page-content--cms{padding:0!important;background:transparent!important;border:none!important;box-shadow:none!important;}
body.cms-id-10 .page-header,
body.cms-id-10 .breadcrumb,
body.cms-id-10 .breadcrumb__wrapper{display:none!important;}
body.cms-id-10 #content-wrapper,
body.cms-id-10 .container--limited-md,
body.cms-id-10 .container--limited-lg,
body.cms-id-10 .container.container--limited-md{max-width:none!important;padding:0!important;margin:0!important;}
body.cms-id-10 main.wrapper,
body.cms-id-10 #main{padding:0!important;}
body.cms-id-10 #wrapper,
body.cms-id-10 .columns-container,
body.cms-id-10 .center-column{
  max-width:none!important;width:auto!important;
  margin-inline:0!important;padding-inline:0!important;
}

/* Hide the module's default trigger button and wrapper — the landing has its
   own designed CTAs that open #ikgymformModal via Bootstrap data attributes.
   The modal itself stays in the DOM via the hook so Bootstrap can target it. */
body.cms-id-10 .gymv1__form-host .ikgymform-wrapper{display:contents;}
body.cms-id-10 .gymv1__form-host .ikgymform-trigger-wrap,
body.cms-id-10 .gymv1__form-host .ikgymform-trigger-btn{display:none!important;}

/* IKGYMFORM modal title: the theme/CE kit overrides the module's intended
   1.1rem with a BebasNeue ~60px display heading that wraps to 3 lines on
   mobile and steals scroll. Force the module's sizing back. Applied globally
   so it works wherever the modal opens, not just on the gimnasios landing. */
#ikgymformModal .ikgymform-modal__title{
  font-size:1.15rem!important;line-height:1.3!important;
  font-family:'Inter','Space Grotesk',-apple-system,BlinkMacSystemFont,sans-serif!important;
  font-weight:800!important;letter-spacing:.5px!important;
}
@media (max-width:600px){
  #ikgymformModal .ikgymform-modal__title{font-size:1rem!important;line-height:1.25!important;}
  #ikgymformModal .ikgymform-modal__header{padding:14px 20px!important;}
}
/* Mobile: stack the modal footer so the primary action (Next / Submit) sits on
   top and Previous sits below — prevents the thumb-misfire of tapping Prev
   thinking it's Next. The module's own 767px rule sets flex-direction:column;
   we promote it to column-reverse. Final-actions block stays on top in step 4
   because it's the last child in source order. */
@media (max-width:767px){
  #ikgymformModal .ikgymform-modal__footer{flex-direction:column-reverse!important;}

  /* iOS Safari: the module's `height:100vh` extends behind the URL bar and the
     home indicator, clipping the bottom button. Use `100svh` (small viewport)
     so the modal stays within the visible area at all URL-bar states, and add
     safe-area padding so the footer button clears the home indicator. */
  #ikgymformModal .modal-dialog{
    height:100svh!important;max-height:100svh!important;
  }
  #ikgymformModal .ikgymform-modal{
    height:100svh!important;max-height:100svh!important;
  }
  #ikgymformModal .ikgymform-modal__footer{
    padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))!important;
  }
}

body.cms-id-10 .gymv1{
  --gym-ink:#0c0a09;--gym-ink-2:#1c1917;--gym-ink-3:#44403c;--gym-mute:#78716c;
  --gym-red:#dc2626;--gym-red-2:#991b1b;--gym-red-3:#7f1d1d;
  --gym-paper:#fafaf9;--gym-paper-2:#f5f5f4;--gym-paper-3:#e7e5e4;
  --gym-ease:cubic-bezier(.2,.7,.2,1);
  font-family:'Inter',sans-serif;color:var(--gym-ink);
  background:var(--gym-paper);
  -webkit-font-smoothing:antialiased;
  width:100%;
}
/* Defensive: ce-kit-1 sets h1..h4 and anchors to white. Restore colors. */
body.cms-id-10 .gymv1 h1,
body.cms-id-10 .gymv1 h2,
body.cms-id-10 .gymv1 h3,
body.cms-id-10 .gymv1 h4{color:inherit;}
body.cms-id-10 .gymv1__hero-title{color:#fafaf9!important;}
body.cms-id-10 .gymv1__benefits-title,
body.cms-id-10 .gymv1__benefit-t,
body.cms-id-10 .gymv1__contact-title{color:var(--gym-ink)!important;}
body.cms-id-10 .gymv1__req-title{color:#fafaf9!important;}
body.cms-id-10 .gymv1 *,
body.cms-id-10 .gymv1 *::before,
body.cms-id-10 .gymv1 *::after{box-sizing:border-box;}
body.cms-id-10 .gymv1 a{color:inherit;text-decoration:none;}
body.cms-id-10 .gymv1 img{max-width:100%;display:block;}

body.cms-id-10 .gymv1__container{max-width:1440px;margin:0 auto;padding:0 1.75rem;}

body.cms-id-10 .gymv1__tag{
  display:inline-flex;align-items:center;gap:.55rem;font-weight:700;
  font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gym-red);
}
body.cms-id-10 .gymv1__tag::before{content:"";width:24px;height:1px;background:var(--gym-red);}
body.cms-id-10 .gymv1__tag--paper{color:#fff;}
body.cms-id-10 .gymv1__tag--paper::before{background:var(--gym-red);}

body.cms-id-10 .gymv1__btn{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.95rem 1.4rem;border-radius:999px;
  font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid transparent;cursor:pointer;
  transition:all .25s var(--gym-ease);
  background:var(--gym-ink);color:#fff!important;
  text-decoration:none!important;
}
body.cms-id-10 .gymv1__btn,
body.cms-id-10 .gymv1__btn *{color:inherit!important;}
body.cms-id-10 .gymv1__btn:hover{background:var(--gym-red);transform:translateY(-1px);}
body.cms-id-10 .gymv1__btn--ink{background:var(--gym-ink);color:#fff!important;}
body.cms-id-10 .gymv1__btn--paper{background:#fff;color:var(--gym-ink)!important;}
body.cms-id-10 .gymv1__btn--paper:hover{background:var(--gym-red);color:#fff!important;}
body.cms-id-10 .gymv1__btn--ghost-light{
  background:transparent;color:#fafaf9!important;border-color:rgba(250,250,249,.4);
}
body.cms-id-10 .gymv1__btn--ghost-light:hover{background:#fafaf9;color:var(--gym-ink)!important;border-color:#fafaf9;}
body.cms-id-10 .gymv1__btn--ghost-dark{
  background:transparent;color:var(--gym-ink)!important;border-color:var(--gym-ink);
}
body.cms-id-10 .gymv1__btn--ghost-dark:hover{background:var(--gym-ink);color:#fff!important;}
body.cms-id-10 .gymv1__btn .material-icons{font-size:1.05rem;}

/* HERO */
body.cms-id-10 .gymv1__hero{
  position:relative;min-height:96vh;
  background:var(--gym-ink);color:#fafaf9;overflow:hidden;
  display:flex;flex-direction:column;justify-content:center;
  padding:7rem 0 4rem;
}
body.cms-id-10 .gymv1__hero-photo{position:absolute;inset:0;overflow:hidden;}
body.cms-id-10 .gymv1__hero-photo img{
  width:100%;height:100%;object-fit:cover;
  object-position:center 18%;
  filter:grayscale(.35) contrast(1.05) brightness(.55);
  opacity:.7;
}
body.cms-id-10 .gymv1__hero-photo::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(12,10,9,.45) 0%,rgba(12,10,9,.55) 50%,rgba(12,10,9,.85) 100%);
}
/* Static IKARA stamp watermark in place of the moving marquee. The marquee
   is now a Home-only signature; landings use this rotated, very faint seal
   so they share the brand vocabulary without competing with the Home hero. */
body.cms-id-10 .gymv1__hero-stamp{
  position:absolute;top:50%;right:-9%;
  width:min(72vh,52vw);max-width:780px;height:auto;
  transform:translateY(-50%) rotate(-8deg);
  opacity:.07;pointer-events:none;user-select:none;z-index:1;
  filter:invert(1) brightness(1.6);
}

body.cms-id-10 .gymv1__hero-content{position:relative;z-index:2;}
body.cms-id-10 .gymv1__hero-meta{
  display:flex;justify-content:space-between;align-items:center;
  gap:1rem;flex-wrap:wrap;margin-bottom:2rem;
}
body.cms-id-10 .gymv1__hero-meta-r{
  display:flex;gap:1.5rem;font-size:.74rem;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:rgba(250,250,249,.55);
}
body.cms-id-10 .gymv1__hero-title{
  font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:clamp(2.75rem,8vw,7.5rem);line-height:.92;letter-spacing:-.035em;
  margin:.5rem 0 1.75rem;color:#fafaf9;
}
body.cms-id-10 .gymv1__hero-title em{font-style:normal;color:var(--gym-red);}
body.cms-id-10 .gymv1__hero-bottom{
  display:grid;grid-template-columns:1.2fr .8fr;gap:3rem;align-items:end;
  margin-top:2rem;
}
body.cms-id-10 .gymv1__hero-lead{
  font-size:clamp(1rem,1.2vw,1.18rem);max-width:580px;
  color:rgba(250,250,249,.82);margin:0;
}
body.cms-id-10 .gymv1__hero-actions{display:flex;gap:.65rem;justify-content:flex-end;flex-wrap:wrap;}
body.cms-id-10 .gymv1__hero-scroll{
  position:absolute;bottom:1.6rem;left:1.75rem;z-index:3;
  font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(250,250,249,.55);display:flex;align-items:center;gap:.5rem;
}
body.cms-id-10 .gymv1__hero-scroll::before{content:"";width:36px;height:1px;background:rgba(250,250,249,.4);}

/* INTRO */
body.cms-id-10 .gymv1__intro{padding:6rem 0 5rem;background:var(--gym-paper);}
body.cms-id-10 .gymv1__intro-row{
  display:grid;grid-template-columns:.65fr 1.35fr;gap:4rem;align-items:start;
}
body.cms-id-10 .gymv1__intro-num{
  font-family:'Space Grotesk',sans-serif;font-weight:600;
  font-size:clamp(3rem,5vw,4.75rem);line-height:.9;
  color:var(--gym-paper-3);letter-spacing:-.02em;
}
body.cms-id-10 .gymv1__intro-num small{
  display:block;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gym-ink-3);margin-top:1rem;font-weight:700;
}
body.cms-id-10 .gymv1__intro-copy{
  font-size:clamp(1.1rem,1.5vw,1.4rem);line-height:1.5;color:var(--gym-ink-2);max-width:720px;
}
body.cms-id-10 .gymv1__intro-copy p{margin:0 0 1.1rem;}
body.cms-id-10 .gymv1__intro-copy p:last-child{margin-bottom:0;}
body.cms-id-10 .gymv1__intro-copy strong{color:var(--gym-ink);font-weight:700;}

/* BENEFICIOS */
body.cms-id-10 .gymv1__benefits{padding:5rem 0 6rem;background:var(--gym-paper);border-top:1px solid var(--gym-paper-3);}
body.cms-id-10 .gymv1__benefits-head{
  display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;
  flex-wrap:wrap;margin-bottom:3.25rem;
}
body.cms-id-10 .gymv1__benefits-title{
  font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:clamp(1.85rem,3.5vw,3rem);letter-spacing:-.018em;line-height:1.04;
  margin:.6rem 0 0;max-width:780px;
}
body.cms-id-10 .gymv1__benefit{
  display:grid;grid-template-columns:80px 1fr 1.2fr;gap:2.5rem;align-items:center;
  padding:1.75rem 0;border-top:1px solid var(--gym-paper-3);
  transition:background .3s var(--gym-ease);
}
body.cms-id-10 .gymv1__benefit:last-child{border-bottom:1px solid var(--gym-paper-3);}
body.cms-id-10 .gymv1__benefit:hover{background:var(--gym-paper-2);}
body.cms-id-10 .gymv1__benefit-n{
  font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:1.5rem;color:var(--gym-red);letter-spacing:-.01em;
}
body.cms-id-10 .gymv1__benefit-t{
  font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:clamp(1.25rem,2vw,1.7rem);letter-spacing:-.015em;margin:0;
}
body.cms-id-10 .gymv1__benefit-d{color:var(--gym-ink-2);margin:0;line-height:1.55;font-size:.98rem;}

/* REQUISITOS */
body.cms-id-10 .gymv1__req{
  position:relative;background:var(--gym-ink);color:#fafaf9;padding:6rem 0;overflow:hidden;
}
body.cms-id-10 .gymv1__req-photo{position:absolute;inset:0;overflow:hidden;}
body.cms-id-10 .gymv1__req-photo img{
  width:100%;height:100%;object-fit:cover;object-position:right 35%;
  filter:grayscale(.2) contrast(1.05);
  opacity:.6;
  transform:scale(1.2);transform-origin:right center;
}
body.cms-id-10 .gymv1__req-photo::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(12,10,9,1) 0%,rgba(12,10,9,1) 38%,rgba(12,10,9,.85) 52%,rgba(12,10,9,.45) 72%,rgba(12,10,9,.15) 100%);
}
body.cms-id-10 .gymv1__req-wrap{position:relative;z-index:2;}
body.cms-id-10 .gymv1__req-head{margin-bottom:2.5rem;max-width:640px;}
body.cms-id-10 .gymv1__req-title{
  font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:clamp(1.85rem,3.5vw,3rem);line-height:1.04;letter-spacing:-.018em;
  margin:.6rem 0 1rem;color:#fafaf9;
}
body.cms-id-10 .gymv1__req-lead{color:rgba(250,250,249,.7);margin:0;font-size:1.02rem;}
body.cms-id-10 .gymv1__req-list{display:grid;grid-template-columns:1fr;gap:1.25rem;max-width:640px;}
body.cms-id-10 .gymv1__req-item{
  display:grid;grid-template-columns:auto 1fr;gap:1.25rem;align-items:start;
  background:rgba(250,250,249,.06);
  border:1px solid rgba(250,250,249,.1);
  padding:1.5rem 1.6rem;border-radius:1rem;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
body.cms-id-10 .gymv1__req-icon{
  width:42px;height:42px;border-radius:999px;
  background:var(--gym-red);color:#fff;display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.95rem;font-family:'Space Grotesk',sans-serif;
  flex-shrink:0;
}
body.cms-id-10 .gymv1__req-body{font-size:1rem;line-height:1.5;color:#fafaf9;margin:0;}

/* CONTACTA */
body.cms-id-10 .gymv1__contact{padding:6rem 0 5rem;background:var(--gym-paper);position:relative;overflow:hidden;}
body.cms-id-10 .gymv1__contact-stamp{
  position:absolute;top:50%;right:-120px;transform:translateY(-50%) rotate(-8deg);
  width:480px;opacity:.07;pointer-events:none;
}
body.cms-id-10 .gymv1__contact-wrap{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;
}
body.cms-id-10 .gymv1__contact-title{
  font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:clamp(2rem,4vw,3.5rem);line-height:1;letter-spacing:-.025em;
  margin:.6rem 0 1.25rem;
}
body.cms-id-10 .gymv1__contact-lead{
  font-size:1.1rem;color:var(--gym-ink-2);margin:0 0 1.5rem;max-width:520px;line-height:1.55;
}
body.cms-id-10 .gymv1__contact-actions{display:flex;gap:.55rem;flex-wrap:wrap;}

body.cms-id-10 .gymv1__panel{
  background:#fff;border:1px solid var(--gym-paper-3);border-radius:1.25rem;
  padding:2rem 2.25rem;box-shadow:0 24px 48px -32px rgba(12,10,9,.18);
}
body.cms-id-10 .gymv1__panel-h{
  font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;
  color:var(--gym-ink-3);margin-bottom:1.1rem;
}
body.cms-id-10 .gymv1__panel-fields{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:1rem;}
body.cms-id-10 .gymv1__panel-fields > div{
  padding:.85rem 1rem;background:var(--gym-paper-2);border-radius:.7rem;
}
body.cms-id-10 .gymv1__panel-l{
  font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gym-ink-3);font-weight:600;margin-bottom:.15rem;
}
body.cms-id-10 .gymv1__panel-v{font-weight:600;font-size:.95rem;color:var(--gym-ink);}
body.cms-id-10 .gymv1__panel-disciplines{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.25rem;}
body.cms-id-10 .gymv1__chip{
  display:inline-flex;align-items:center;padding:.35rem .75rem;border-radius:999px;
  background:var(--gym-paper-2);font-size:.78rem;font-weight:600;color:var(--gym-ink-2);
}

/* RESPONSIVE */
@media (max-width:1199px){
  body.cms-id-10 .gymv1__req-photo img{
    object-position:65% 28%;
    transform:scale(1.6);transform-origin:65% center;
  }
  body.cms-id-10 .gymv1__req-photo::after{
    background:linear-gradient(90deg,rgba(12,10,9,1) 0%,rgba(12,10,9,.98) 35%,rgba(12,10,9,.7) 55%,rgba(12,10,9,.3) 90%);
  }
}
@media (max-width:991.98px){
  body.cms-id-10 .gymv1__hero{padding:5.5rem 0 2.5rem;min-height:78vh;}
  body.cms-id-10 .gymv1__hero-photo img{object-position:center 15%;}
  body.cms-id-10 .gymv1__hero-photo::after{
    background:linear-gradient(180deg,rgba(12,10,9,.35) 0%,rgba(12,10,9,.55) 55%,rgba(12,10,9,.92) 100%);
  }
  body.cms-id-10 .gymv1__hero-stamp{
    width:min(95vw,520px);right:-22%;top:42%;
  }
  body.cms-id-10 .gymv1__hero-meta{margin-bottom:1.25rem;}
  body.cms-id-10 .gymv1__hero-meta-r{font-size:.65rem;gap:.85rem;}
  body.cms-id-10 .gymv1__hero-title{font-size:clamp(2.4rem,9vw,4rem);margin:.25rem 0 1.25rem;}
  body.cms-id-10 .gymv1__hero-bottom{grid-template-columns:1fr;gap:1.25rem;margin-top:1rem;}
  body.cms-id-10 .gymv1__hero-lead{font-size:1rem;}
  body.cms-id-10 .gymv1__hero-actions{justify-content:flex-start;gap:.5rem;}
  body.cms-id-10 .gymv1__hero-scroll{bottom:1rem;font-size:.65rem;}

  body.cms-id-10 .gymv1__intro{padding:3.5rem 0 3rem;}
  body.cms-id-10 .gymv1__intro-row{grid-template-columns:1fr;gap:1rem;}
  body.cms-id-10 .gymv1__intro-num{
    display:flex;align-items:baseline;gap:1rem;
    font-size:1.75rem;color:var(--gym-ink);
  }
  body.cms-id-10 .gymv1__intro-num small{
    display:inline-block;margin-top:0;font-size:.7rem;
    color:var(--gym-red);letter-spacing:.16em;
  }
  body.cms-id-10 .gymv1__intro-copy{font-size:1.05rem;line-height:1.55;}

  body.cms-id-10 .gymv1__benefits{padding:3.5rem 0 4rem;}
  body.cms-id-10 .gymv1__benefits-head{margin-bottom:2rem;}
  body.cms-id-10 .gymv1__benefit{
    grid-template-columns:auto 1fr;gap:.8rem 1rem;
    padding:1.4rem 0;align-items:start;
  }
  body.cms-id-10 .gymv1__benefit-n{
    font-size:1rem;padding-top:.3rem;line-height:1;align-self:start;
  }
  body.cms-id-10 .gymv1__benefit-t{font-size:1.15rem;line-height:1.2;margin-top:.1rem;}
  body.cms-id-10 .gymv1__benefit-d{
    grid-column:2 / 3;font-size:.92rem;
    color:var(--gym-ink-3);margin-top:.15rem;
  }

  body.cms-id-10 .gymv1__req{padding:4rem 0;}
  body.cms-id-10 .gymv1__req-photo img{
    object-position:55% 25%;
    transform:scale(1.7);transform-origin:55% center;
  }
  body.cms-id-10 .gymv1__req-photo::after{
    background:linear-gradient(180deg,rgba(12,10,9,.55) 0%,rgba(12,10,9,.6) 40%,rgba(12,10,9,.88) 100%);
  }
  body.cms-id-10 .gymv1__req-head{margin-bottom:1.75rem;}
  body.cms-id-10 .gymv1__req-title{font-size:clamp(1.6rem,5.5vw,2.2rem);margin-top:.4rem;}
  body.cms-id-10 .gymv1__req-lead{font-size:.95rem;}
  body.cms-id-10 .gymv1__req-list{gap:.85rem;}
  body.cms-id-10 .gymv1__req-item{padding:1.2rem 1.25rem;border-radius:.85rem;gap:1rem;}
  body.cms-id-10 .gymv1__req-icon{width:36px;height:36px;font-size:.85rem;}
  body.cms-id-10 .gymv1__req-body{font-size:.95rem;}

  body.cms-id-10 .gymv1__contact{padding:3.5rem 0 2.5rem;}
  body.cms-id-10 .gymv1__contact-wrap{grid-template-columns:1fr;gap:1.75rem;}
  body.cms-id-10 .gymv1__contact-stamp{display:none;}
  body.cms-id-10 .gymv1__contact-title{font-size:clamp(1.8rem,7vw,2.6rem);}
  body.cms-id-10 .gymv1__contact-lead{font-size:1rem;}
  body.cms-id-10 .gymv1__panel{padding:1.5rem 1.5rem;border-radius:1rem;}
  body.cms-id-10 .gymv1__panel-fields{grid-template-columns:1fr 1fr;gap:.55rem;}
  body.cms-id-10 .gymv1__contact-actions{flex-direction:column;align-items:stretch;}
  body.cms-id-10 .gymv1__contact-actions .gymv1__btn{justify-content:center;width:100%;}
}
@media (max-width:600px){
  body.cms-id-10 .gymv1__hero{min-height:auto;padding:5rem 0 2rem;}
  body.cms-id-10 .gymv1__hero-stamp{display:none;}
  body.cms-id-10 .gymv1__hero-title{font-size:2.4rem;line-height:.98;}
  body.cms-id-10 .gymv1__hero-meta{flex-direction:column;align-items:flex-start;gap:.5rem;}
  body.cms-id-10 .gymv1__hero-meta-r{flex-wrap:wrap;}
  body.cms-id-10 .gymv1__hero-actions{flex-direction:column;align-items:stretch;}
  body.cms-id-10 .gymv1__hero-actions .gymv1__btn{justify-content:center;}
  body.cms-id-10 .gymv1__intro-num{font-size:1.4rem;}
  body.cms-id-10 .gymv1__benefits-title{font-size:1.5rem;}
  body.cms-id-10 .gymv1__req-item{padding:1.05rem 1.1rem;}
  body.cms-id-10 .gymv1__panel-fields{grid-template-columns:1fr;}
}