/* Carrouséis infinitos / CSS-first: movimiento auténtico, independientemente de JavaScript. */
@keyframes liderazgo-giro-infinito {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(calc(-50% - var(--giro-mitad-gap)), 0, 0); }
}
.preview-carousel-window,.material-carousel-window { overflow:hidden !important; }
.preview-carousel-track,.material-carousel-track {
  display: flex !important;
  width: max-content !important;
  max-width:none !important;
  flex-wrap: nowrap !important;
  transform:translate3d(0,0,0);
  transition: none !important;
  animation-name:liderazgo-giro-infinito !important;
  animation-timing-function: linear !important;
  animation-iteration-count: infinite !important;
  animation-play-state: running !important;
  will-change:transform;
}
.preview-carousel-track {
  --giro-mitad-gap:8px;
  gap:16px !important;
  animation-duration:29s !important;
}
.material-carousel-track {
  --giro-mitad-gap:10px;
  gap:20px !important;
  animation-duration:27s !important;
}
/* Fixed card widths are essential: widths based on the track percentage would explode
   when its content is duplicated for a continuous, gapless loop. */
.preview-carousel-track > button {
  display:block;
  box-sizing:border-box;
  width:min(440px, 40vw) !important;
  min-width:0 !important;
  flex:0 0 min(440px, 40vw) !important;
}
.material-carousel-track > .material-carousel-slide {
  box-sizing:border-box;
  width:min(375px, calc((100vw - 110px)/3)) !important;
  min-width:0 !important;
  flex:0 0 min(375px, calc((100vw - 110px)/3)) !important;
}
/* Play/pause must override the previous stylesheet's autoplay rule. */
.preview-carousel[data-user-paused="true"] .preview-carousel-track,
.material-carousel[data-user-paused="true"] .material-carousel-track {
  animation-play-state:paused !important;
}
.carousel-play-toggle {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:40px;
  border:1px solid #cbdff4;
  background:#e9f3ff;
  border-radius:999px;
  padding:8px 14px;
  color:#114b86;
  font:700 12px Poppins, sans-serif;
  cursor:pointer;
}
.carousel-play-toggle:hover{background:#dbeeff;}
.carousel-play-toggle:focus-visible{outline:3px solid #34acff;outline-offset:2px;}
.preview-carousel-controls{flex-wrap:wrap;align-items:center;}
.material-carousel-controls{flex-wrap:wrap;}
.sale-price-benefits {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:13px;
}
.sale-price-benefits span {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  border-radius:999px;
  padding:7px 13px;
  color:#114c7a;
  background:#e1f1ff;
  border:1px solid #c8e2f7;
  font-family:Poppins,sans-serif;
  font-size:12px;
  font-weight:750;
}
.hero-price-teaser .hero-price-perks {
  color:#e1f2ff;
  width:100%;
  font-size:12px;
  font-weight:650;
  letter-spacing:.01em;
  text-align:center;
}
@media(max-width:900px){
  .preview-carousel-track > button {
    width:min(440px, 56vw) !important;
    flex-basis:min(440px, 56vw) !important;
  }
  .material-carousel-track > .material-carousel-slide {
    width:min(370px, calc((100vw - 80px)/2)) !important;
    flex-basis:min(370px, calc((100vw - 80px)/2)) !important;
  }
}
@media(max-width:640px){
  .preview-carousel-track > button {
    width:min(360px, 86vw) !important;
    flex-basis:min(360px, 86vw) !important;
  }
  .material-carousel-track > .material-carousel-slide {
    width:min(360px, 86vw) !important;
    flex-basis:min(360px, 86vw) !important;
  }
  .sale-price-benefits{gap:7px;}
  .sale-price-benefits span{font-size:11px;padding:7px 11px;}
}
