/** Shopify CDN: Minification failed

Line 120:8 Unexpected "{"
Line 120:17 Expected ":"

**/
/* ============================================================
   GYMSPIDERR — DESIGN SYSTEM CUSTOM
   Borrador: Copia de Página Maty 2
   ============================================================ */

/* 1. SEPARADORES */
.gym-divider {
  display: flex; align-items: center; justify-content: center;
  gap: 1.6rem; padding: 2rem 0; width: 100%;
}
.gym-divider::before, .gym-divider::after {
  content: ''; flex: 1; max-width: 18rem; height: 1px;
  background: linear-gradient(to right, transparent, rgba(var(--color-foreground), 0.3), transparent);
}
.gym-divider__icon { font-size: 1.8rem; opacity: 0.7; animation: gym-spider-bounce 3s ease-in-out infinite; }
@keyframes gym-spider-bounce {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  25% { transform: translateY(-3px) rotate(-5deg); }
  75% { transform: translateY(3px) rotate(5deg); }
}

/* ============================================================
   2. MARQUEE
   ============================================================ */
.gym-marquee {
  background: rgb(var(--color-button));
  color: rgb(var(--color-button-text));
  overflow: hidden; position: relative; padding: 1.4rem 0;
  border-top: 1px solid rgba(255,255,255,0.15);
  border-bottom: 1px solid rgba(255,255,255,0.15);
  z-index: 1;
}
.gym-marquee__track {
  display: flex; white-space: nowrap;
  animation: gym-marquee-scroll 28s linear infinite;
  width: max-content; will-change: transform;
}
.gym-marquee:hover .gym-marquee__track { animation-play-state: paused; }
.gym-marquee__item {
  display: inline-flex; align-items: center; gap: 1.6rem;
  padding: 0 2.4rem; font-size: 1.5rem; font-weight: 700;
  letter-spacing: 0.18rem; text-transform: uppercase;
}
.gym-marquee__item span { font-size: 1.6rem; opacity: 0.85; }
@keyframes gym-marquee-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.gym-marquee--alt { background: rgb(var(--color-foreground)); }
@media screen and (max-width: 749px) {
  .gym-marquee { padding: 1.1rem 0; }
  .gym-marquee__item { font-size: 1.3rem; padding: 0 1.4rem; letter-spacing: 0.12rem; }
}

/* ============================================================
   3. HOVER CARDS
   ============================================================ */
.card-wrapper { position: relative; cursor: pointer; }
.card-wrapper .card__media .media img:first-child { transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1); }
.card-wrapper:hover .card__media .media img:first-child { transform: scale(1.04); }
.card__badge .badge { font-weight: 700; letter-spacing: 0.1rem; text-transform: uppercase; font-size: 1.05rem; }
.card-wrapper { cursor: pointer; }
.card-wrapper .card__media, .card-wrapper .card__media * { cursor: pointer; }

/* ============================================================
   4. BOTONES
   ============================================================ */
.button:not(.button--tertiary) { position: relative; overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease; }
.button:not(.button--tertiary):hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(var(--color-shadow), 0.2); }
.button:not(.button--tertiary):active { transform: translateY(0); box-shadow: 0 4px 12px rgba(var(--color-shadow), 0.15); }

/* ============================================================
   5. TIPOGRAFÍA
   ============================================================ */
h1, .h1, h2, .h2 { letter-spacing: -0.02em; line-height: 1.05; }
h1.banner__heading, .banner__heading.h0, .banner__heading.hxl, .banner__heading.hxxl {
  font-weight: 900; text-transform: uppercase; letter-spacing: -0.01em;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.15);
}

/* ============================================================
   6. CURSOR
   ============================================================ */
@media (hover: hover) and (pointer: fine) and (min-width: 991px) {
  html.gym-cursor-active, html.gym-cursor-active body, html.gym-cursor-active * { cursor: none !important; }
  .gym-cursor { position: fixed; top: 0; left: 0; pointer-events: none; z-index: 99999; transition: width 0.3s, height 0.3s, background 0.3s, border-color 0.3s, opacity 0.25s; margin-left: -50%; margin-top: -50%; }
  .gym-cursor--dot { width: 8px; height: 8px; background: rgb(var(--color-button, 233, 30, 140)); border-radius: 50%; mix-blend-mode: difference; }
  .gym-cursor--ring { width: 36px; height: 36px; border: 1.5px solid rgb(var(--color-button, 233, 30, 140)); border-radius: 50%; opacity: 0.85; }
  html.gym-cursor-hover .gym-cursor--ring { width: 64px; height: 64px; background: rgba(233, 30, 140, 0.12); }
  html.gym-cursor-hidden .gym-cursor { opacity: 0; }
}
@media (hover: none), (pointer: coarse), (max-width: 990px) { .gym-cursor { display: none !important; } }

/* ============================================================
   7. NAV
   ============================================================ */
.header__menu-item { position: relative; transition: color 0.3s ease; }
.header__menu-item span { position: relative; display: inline-block; }
.header__menu-item span::after { content: ''; position: absolute; bottom: -4px; left: 50%; transform: translateX(-50%); width: 0; height: 2px; background: rgb(var(--color-button)); transition: width 0.35s cubic-bezier(0.16, 1, 0.3, 1); border-radius: 2px; }
.header__menu-item:hover span::after { width: 100%; }

/* ============================================================
   8. INPUTS
   ============================================================ */
.field__input:focus, .select__select:focus, .text-area:focus { border-color: rgb(var(--color-button)) !important; box-shadow: 0 0 0 3px rgba(var(--color-button), 0.15) !important; }

/* ============================================================
   9. PRECIOS
   ============================================================ */
.price__sale .price-item--sale, .price--on-sale .price-item--sale { font-weight: 800; }
.price__sale .price-item--regular { opacity: 0.5; }

/* Precio más grande en página de producto */
#price-{{ section.id }} .price--large .price-item,
.product__info-container .price--large .price-item {
  font-size: 2.8rem !important;
  font-weight: 800 !important;
}

/* ============================================================
   10. SELECTION
   ============================================================ */
::selection { background: rgb(var(--color-button)); color: rgb(var(--color-button-text)); }

/* ============================================================
   11. PRECIO GRANDE EN PRODUCTO
   ============================================================ */
.product__info-container .price--large .price-item--regular,
.product__info-container .price--large .price-item--sale {
  font-size: 3rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}

/* ============================================================
   12. TAMBIÉN TE PUEDE GUSTAR — Fondo blanco + borde rosa neón
   ============================================================ */
product-recommendations.related-products { background-color: #ffffff !important; }
section.section > [class*="color-"]:has(.related-products),
section.section > [class*="gradient"]:has(.related-products) { background-color: #ffffff !important; }
.related-products .card, .related-products .card--product, .related-products .card--standard {
  border: 1.5px solid rgba(233,30,140,0.6) !important;
  border-radius: 8px !important; overflow: hidden;
  box-shadow: 0 0 8px rgba(233,30,140,0.15) !important;
  transition: box-shadow 0.2s ease;
  background-color: #ffffff !important;
}
.related-products .card:hover { box-shadow: 0 0 18px rgba(233,30,140,0.4) !important; }
.related-products .related-products__heading { color: #111 !important; }

/* ============================================================
   13. BANNER EMAIL / DESCUENTO — Rosa + blanco
   ============================================================ */
.email-signup-banner { background-color: #e91e8c !important; }
.email-signup-banner .banner__media { display: none !important; }
.email-signup-banner .email-signup-banner__box, .email-signup-banner .banner__box, .email-signup-banner .newsletter { background-color: transparent !important; background-image: none !important; box-shadow: none !important; }
.email-signup-banner .email-signup-banner__heading, .email-signup-banner h1, .email-signup-banner h2, .email-signup-banner h3, .email-signup-banner p, .email-signup-banner .rte, .email-signup-banner .newsletter__subheading, .email-signup-banner .rte * { color: #ffffff !important; }
.email-signup-banner .field__input { background-color: rgba(255,255,255,0.15) !important; color: #ffffff !important; border-color: rgba(255,255,255,0.5) !important; }
.email-signup-banner .field__input::placeholder { color: rgba(255,255,255,0.7) !important; }
.email-signup-banner .field__label { color: rgba(255,255,255,0.8) !important; }
.email-signup-banner .newsletter-form__button, .email-signup-banner .field__button { background-color: #ffffff !important; color: #e91e8c !important; }
.email-signup-banner .newsletter-form__button svg path, .email-signup-banner .field__button svg path { stroke: #e91e8c !important; fill: #e91e8c !important; }

/* ============================================================
   14. MULTICOLUMNA — Contorno neón rosa
   ============================================================ */
.multicolumn-card { border: 1.5px solid rgba(233,30,140,0.45) !important; border-radius: 10px !important; box-shadow: 0 0 10px rgba(233,30,140,0.12) !important; transition: box-shadow 0.25s ease, border-color 0.25s ease; overflow: hidden; }
.multicolumn-card:hover { border-color: rgba(233,30,140,0.8) !important; box-shadow: 0 0 20px rgba(233,30,140,0.28) !important; }

/* ============================================================
   FLECHAS DE CARRUSELES — sin círculo, símbolo rosa grande
   ============================================================ */
.slider-button {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  width: auto !important;
  height: auto !important;
  padding: 0.8rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
  transition: opacity 0.2s ease !important;
  flex-shrink: 0;
}
.slider-button svg,
.slider-button .svg-wrapper svg {
  stroke: #e91e8c !important;
  fill: none !important;
  width: 2.8rem !important;
  height: 2.8rem !important;
  stroke-width: 2.5 !important;
}
.slider-button:hover {
  opacity: 0.6 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Flechas del slideshow hero — también sin círculo */
.slideshow__controls .slider-button {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0.6rem !important;
}
.slideshow__controls .slider-button svg,
.slideshow__controls .slider-button .svg-wrapper svg {
  stroke: #e91e8c !important;
  width: 2.4rem !important;
  height: 2.4rem !important;
  stroke-width: 2.5 !important;
}

/* Flechas centradas a los lados en carruseles de colecciones desktop */
@media screen and (min-width: 750px) {
  .slider-component-desktop {
    position: relative;
  }
  .slider-component-desktop .slider-buttons {
    position: absolute;
    top: 38%;
    left: -3rem;
    right: -3rem;
    transform: translateY(-50%);
    pointer-events: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    padding: 0;
    z-index: 3;
  }
  .slider-component-desktop .slider-button {
    pointer-events: all;
  }
  .slider-component-desktop .slider-counter {
    display: none !important;
  }
}

/* Contador — solo número actual en rosa, sin barra */
.slider-counter [aria-hidden="true"] { display: none !important; }
.slider-counter .slider-counter--total { display: none !important; }
.slider-counter .visually-hidden { display: none !important; }
.slider-counter--current {
  font-size: 1.4rem;
  font-weight: 700;
  color: #e91e8c;
  display: block;
  text-align: center;
}
.slider-buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.6rem;
  margin-top: 1.2rem;
}

/* Respetar las clases de Dawn que ocultan flechas cuando no hacen falta
   (sin esto, el display:flex !important de arriba las mostraba bloqueadas) */
@media screen and (max-width: 749px) {
  .slider-button.small-hide { display: none !important; }
}
@media screen and (min-width: 750px) and (max-width: 989px) {
  .slider-button.medium-hide { display: none !important; }
}
@media screen and (min-width: 990px) {
  .slider-button.large-up-hide { display: none !important; }
}

/* ============================================================
   16. SLIDESHOW — Cuadro con personalidad
   Fondo semitransparente, sin exceso de espacio, esquinas rosas
   ============================================================ */
.slideshow__text.banner__box {
  border-radius: 12px !important;
  border: 1.5px solid rgba(233,30,140,0.65) !important;
  box-shadow: 0 0 18px rgba(233,30,140,0.2) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  background: rgba(13,13,13,0.55) !important;
  padding: 1.6rem 2rem !important;
  max-width: none !important;
  width: fit-content !important;
  display: inline-flex !important;
  flex-direction: column !important;
  gap: 0.8rem !important;
}

/* Quitar padding innecesario del color scheme dentro del box */
.slideshow__text.banner__box.color-scheme-1,
.slideshow__text.banner__box.gradient {
  background: rgba(13,13,13,0.55) !important;
}

/* Posición abajo-izquierda en desktop */
@media screen and (min-width: 750px) {
  .slideshow__text-wrapper.banner__content {
    align-items: flex-end !important;
    justify-content: flex-start !important;
    padding-bottom: 3.5rem !important;
    padding-left: 3rem !important;
  }
}

/* ============================================================
   17. VIDEO SLIDESHOW — Calidad
   ============================================================ */
.slideshow__video video {
  image-rendering: -webkit-optimize-contrast;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* ============================================================
   18. JUDGE.ME — Reseñas
   ============================================================ */
.jdgm-star { color: #e91e8c !important; }
.jdgm-star.jdgm--on { color: #e91e8c !important; }
.jdgm-star.jdgm--half::after { color: #e91e8c !important; }
.jdgm-star.jdgm--off { color: #d0d0d0 !important; }
.gymspiderr-rating-badge { margin: 4px 0 6px; line-height: 1; }
.gymspiderr-rating-badge .jdgm-prev-badge { display: flex; align-items: center; gap: 4px; }
.gymspiderr-reviews-section { margin-top: 24px; padding-top: 24px; border-top: 1px solid #f0f0f0; }
.jdgm-histogram__bar { background-color: #e91e8c !important; }
.jdgm-write-rev-link, .jdgm-write-rev-link:visited, a.jdgm-write-rev-link, a.jdgm-write-rev-link:visited {
  background-color: #e91e8c !important; color: #ffffff !important; border: none !important;
  border-radius: 6px !important; padding: 14px 32px !important; font-size: 0 !important;
  font-weight: 700 !important; text-decoration: none !important; display: inline-block !important;
  margin-bottom: 24px !important; cursor: pointer !important;
}
.jdgm-write-rev-link::before { content: 'Escribir una reseña' !important; font-size: 16px !important; font-weight: 700 !important; color: #ffffff !important; }
.jdgm-write-rev-link:hover, a.jdgm-write-rev-link:hover { background-color: #c4177a !important; }
.jdgm-submit-btn, button.jdgm-submit-btn { background-color: #e91e8c !important; color: #ffffff !important; border: none !important; border-radius: 6px !important; padding: 12px 28px !important; font-size: 15px !important; font-weight: 700 !important; }
.jdgm-rev__author { color: #e91e8c !important; font-weight: 600; }
.jdgm-rev__timestamp { color: #888 !important; font-size: 12px; }
.jdgm-rev__body { color: #222 !important; font-size: 14px; line-height: 1.6; }
.jdgm-paginate .jdgm-page.jdgm--active { background-color: #e91e8c !important; color: #fff !important; border-color: #e91e8c !important; }
.jdgm-rev__verif-text { color: #e91e8c !important; }

/* ============================================================
   19. CARRUSEL DE IMÁGENES EN PRODUCTO
   ============================================================ */
/* Galería en modo thumbnail_slider — ya nativo de Dawn */
.product__media-list { scroll-snap-type: x mandatory; }
.product__media-item { scroll-snap-align: start; }

/* ============================================================
   BOTÓN FLOTANTE WHATSAPP — lado izquierdo
   ============================================================ */
.gym-whatsapp-btn {
  position: fixed;
  bottom: 2.4rem;
  left: 2.4rem;
  right: auto;
  z-index: 9999;
  width: 5.6rem;
  height: 5.6rem;
  border-radius: 50%;
  background: #25D366;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 20px rgba(37,211,102,0.45);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  text-decoration: none;
}
.gym-whatsapp-btn:hover {
  transform: scale(1.1);
  box-shadow: 0 6px 28px rgba(37,211,102,0.6);
}
.gym-whatsapp-btn svg {
  width: 3.2rem;
  height: 3.2rem;
  fill: #ffffff;
}
@media screen and (max-width: 749px) {
  .gym-whatsapp-btn {
    bottom: 1.6rem;
    left: 1.6rem;
    right: auto;
    width: 5rem;
    height: 5rem;
  }
  .gym-whatsapp-btn svg {
    width: 2.8rem;
    height: 2.8rem;
  }
}

/* ============================================================
   THUMBNAILS EN GALERÍA DE PRODUCTO
   ============================================================ */
.thumbnail-list {
  display: flex !important;
  gap: 0.8rem;
  margin-top: 1.2rem;
  overflow-x: auto;
  scrollbar-width: none;
}
.thumbnail-list::-webkit-scrollbar { display: none; }
.thumbnail-list__item {
  flex-shrink: 0;
  width: 7rem;
  height: 7rem;
  border-radius: 6px;
  overflow: hidden;
  border: 2px solid transparent;
  transition: border-color 0.2s ease;
  cursor: pointer;
}
.thumbnail-list__item:hover,
.thumbnail-list__item[aria-current="true"],
.thumbnail-list__item.is-active {
  border-color: #e91e8c !important;
}
.thumbnail-list__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ============================================================
   FLECHAS A LOS COSTADOS DE LA IMAGEN PRINCIPAL DEL PRODUCTO
   ============================================================ */
media-gallery [id^="GalleryViewer"] { position: relative; }
.gym-gallery-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 4;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  padding: 0.8rem;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: opacity 0.2s ease;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,0.35));
}
.gym-gallery-arrow--prev { left: 0.4rem; }
.gym-gallery-arrow--next { right: 0.4rem; }
.gym-gallery-arrow svg {
  width: 3.6rem;
  height: 3.6rem;
  stroke: #e91e8c;
  stroke-width: 2.5;
  fill: none;
}
.gym-gallery-arrow:hover { opacity: 0.6; }
@media screen and (max-width: 749px) {
  .gym-gallery-arrow svg { width: 3rem; height: 3rem; }
}

/* Las flechas de las miniaturas se ocultan: ahora se navega con las de la imagen */
.thumbnail-slider .slider-button { display: none !important; }

/* Contador con flechas bajo la imagen principal (‹ 1 ›): se elimina,
   las flechas laterales ya cumplen esa función */
media-gallery [id^="GalleryViewer"] > .slider-buttons { display: none !important; }

/* ============================================================
   CARRUSELES SOBRE FONDO ROSADO (esquema 4)
   Las flechas y el contador pasan a blanco para que se vean
   ============================================================ */
.color-scheme-4 [class*="gym-arrow-"] svg { stroke: #ffffff !important; }
.color-scheme-4 [class*="gym-counter-"] { color: #ffffff !important; }
.color-scheme-4 .slider-button svg,
.color-scheme-4 .slider-button .svg-wrapper svg { stroke: #ffffff !important; }
.color-scheme-4 .slider-counter--current { color: #ffffff !important; }

/* ============================================================
   ESTRELLAS BAJO EL PRECIO — visibles aunque no haya reseñas
   (Judge.me las oculta con display:none cuando hay 0 reseñas;
   estos selectores son más específicos para ganarle)
   ============================================================ */
.gymspiderr-rating-badge.jdgm-preview-badge {
  display: block !important;
  margin: 0.6rem 0 1.4rem !important;
  cursor: pointer;
}
.gymspiderr-rating-badge.jdgm-preview-badge .jdgm-prev-badge,
.gymspiderr-rating-badge.jdgm-preview-badge .jdgm-prev-badge[data-average-rating] {
  display: flex !important;
  align-items: center;
  gap: 0.8rem;
}
.gymspiderr-rating-badge.jdgm-preview-badge .jdgm-prev-badge__text { visibility: visible !important; }
.gymspiderr-rating-badge .jdgm-prev-badge__stars .jdgm-star { font-size: 1.7rem; }
.gymspiderr-rating-badge .jdgm-prev-badge__text {
  font-size: 1.3rem;
  color: rgba(var(--color-foreground), 0.7);
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

/* ============================================================
   DESPLEGABLE "RESEÑAS" EN LA PÁGINA DE PRODUCTO
   ============================================================ */
.gym-reviews-accordion .accordion__content { padding-top: 0.4rem; }
.gym-reviews-accordion .jdgm-widget { margin: 0 !important; padding: 0 !important; }
.gym-reviews-accordion .icon-star { fill: currentColor; }
/* Botón "Escribir una reseña" del widget nuevo de Judge.me, en rosa */
.jm-button--primary,
.jdgm-widget .jm-button--primary {
  background-color: #e91e8c !important;
  border-color: #e91e8c !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
}
.jm-button--primary:hover { background-color: #c4177a !important; border-color: #c4177a !important; }

/* ============================================================
   JUDGE.ME (WIDGET NUEVO) — todo en rosa
   El color verde viene de variables que Judge.me pone en cada
   reseña; se sobrescriben aquí (estrellas, histograma, avatar)
   ============================================================ */
.jdgm-widget,
.jdgm-widget * {
  --jm-review-widget-star-and-histogram-color: #e91e8c !important;
  --jm-review-widget-button-color: #e91e8c !important;
}
/* Botones del formulario para escribir una reseña (Siguiente / Enviar / Cerrar) */
.jdgm-write-review-modal .jdgm-write-review-modal__nav-btn-next,
.jdgm-write-review-modal .jdgm-write-review-modal__nav-btn-close,
.jdgm-write-review-modal .jdgm-submit-rev {
  background-color: #e91e8c !important;
  border-color: #e91e8c !important;
  color: #ffffff !important;
}
.jdgm-write-review-modal .jdgm-write-review-modal__nav-btn-next:hover,
.jdgm-write-review-modal .jdgm-write-review-modal__nav-btn-close:hover,
.jdgm-write-review-modal .jdgm-submit-rev:hover {
  background-color: #c4177a !important;
  border-color: #c4177a !important;
}

/* ============================================================
   ESTRELLAS + COMPARTIR EN LA MISMA FILA, BAJO EL PRECIO
   ============================================================ */
.gym-rating-share-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem 2.8rem;
  margin: 0.6rem 0 1.6rem;
}
.gym-rating-share-row .gymspiderr-rating-badge.jdgm-preview-badge {
  width: auto;
  margin: 0 !important;
}
.gym-rating-share-row share-button.share-button {
  width: auto;
  margin: 0;
  position: relative;
}
.gym-rating-share-row .share-button__button {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.04rem;
  color: #e91e8c;
  min-height: auto;
  padding: 0.4rem 0;
  gap: 0.8rem;
  text-decoration: none;
}
.gym-rating-share-row .share-button__button:hover { opacity: 0.75; }
.gym-rating-share-row .share-button__button .svg-wrapper,
.gym-rating-share-row .share-button__button .icon-share {
  width: 2.2rem;
  height: 2.2rem;
  min-width: 2.2rem;
  margin: 0;
}