/** Shopify CDN: Minification failed

Line 191:1 Expected "}" to go with "{"

**/
/* Estructura del Slider */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Flechas de navegación */
.prev, .next {
  cursor: pointer;
  position: absolute;
  bottom: -40px;
  width: auto;
  margin-top: -22px;
  padding: 10px;
  color: #000000;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 35px;
  user-select: none;
  background: #efefef;
}

.next {
  right: 10px;
  border-radius: 35px;
}

a.prev {
  right: 50px;
}
  
.prev:hover, .next:hover {
  background-color: #dedee3;
}

/* Numeración y Puntos */
.numbertext {
  color: #ffffff;
  font-size: 14px;
  padding: 3px 10px;
  position: absolute;
  top: 10px;
  right: 10px;
  background: #00000099;
  font-family: 'Inter' !important;
  letter-spacing: -1px;
  border-radius: 20px;
  z-index: 1;
}

.dot {
  cursor: pointer;
  height: 10px;
  width: 10px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Animación y utilidades */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

svg.s-w-\[1rem\].s-pointer-events-none {
  width: 1rem;
}

/* Tipografía adaptada a las clases de Uruguay */
.prose.text-left p, 
.prose.text-left strong, 
.prose.text-left li, 
.prose.text-left a {
  font-family: 'Inter' !important;
  font-size: 16px;
}

h2.dynamic-size-title {
  letter-spacing: 0px;
  font-size: 26px;
  line-height: 32px;
}

/* Layout para Desktop */
@media (min-width: 990px) {
  /* 1. Contenedor principal: 100% de ancho pero le devolvemos los 70px de aire a los costados */
  .slide-text-container.section-spacing {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 70px !important; /* Respiro de la izquierda */
    padding-right: 70px !important; /* Respiro de la derecha */
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  /* 2. Alineamos el contenedor flex explícitamente hacia el inicio con máxima autoridad */
  .shopify-section--image-with-text image-with-text.image-with-text {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important; /* ¡ACÁ MATAMOS EL GAP FANTASMA DE SHOPIFY! */ 
    margin: 0 !important; 
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* 3. La caja de la imagen: ocupa la mitad */
  .slide-container {
    flex: 0 0 50% !important; 
    max-width: 50% !important;
    margin-top: 40px !important;
    margin-bottom: 62px !important;
    margin-left: 0 !important; /* Queda en 0 porque el colchón ya lo da el padding del padre */
    margin-right: 0px !important; /* Respiro entre foto y texto */
  }

  .shopify-section--image-with-text image-with-text.image-with-text.image-with-text--reverse .slide-container {
    margin-left: 0px !important;
    margin-right: 0 !important; 
  }

  /* 4. Matamos el margin: auto del carrusel y lo clavamos a su lado */
  .slideshow-container {
    margin: 0 auto 0 0 !important; 
    width: 100% !important;
    text-align: left !important;
  }

  .shopify-section--image-with-text image-with-text.image-with-text.image-with-text--reverse .slideshow-container {
    margin: 0 0 0 auto !important; 
  }

  .slideshow-container img {
    margin: 0 auto 0 0 !important;
  }

/* 5. El texto: Una caja fija de 500px, igualito que en México */
  html body .shopify-section--image-with-text .slide-text-container image-with-text.image-with-text div.prose.text-left.sm\:text-start {
    flex: 1 1 auto !important;
    max-width: 500px !important;
    /* Al separar los lados le ganamos al shorthand, sumado al mega selector */
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 65px !important;
    padding-right: 100px !important;
    margin: 0 !important;
    text-align: left !important;
  }

/* Bloque REVERSE (Texto Izquierda / Imagen Derecha) */
/* 1. Forzamos a la sección a tener aire a los lados (esto mueve TODO el bloque) */
.shopify-section--image-with-text {
  padding-left: 70px !important;
  padding-right: 70px !important;
}

/* 2. Limpiamos los márgenes del bloque para que no choquen con el padre */
.shopify-section--image-with-text image-with-text[class*="--reverse"] {
  flex-direction: row-reverse !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  margin: 40px 0 30px 0 !important; /* Ponemos 0 en los costados porque el aire ya lo da el padre */
}

/* 3. Padding interno del texto (el "aire" entre el texto y la imagen) */
.shopify-section--image-with-text image-with-text[class*="--reverse"] .prose.text-center.sm\:text-start {
  padding-left: 0 !important; /* Reseteamos para que no se sume al aire del padre */
  padding-right: 80px !important; /* Este es el espacio entre el texto y la imagen */
  text-align: left !important;
}