/* Hero de carrusel de imágenes sin texto, idéntico en todas las páginas */
.hero-carousel {
  width: 100%;
  overflow: hidden;
  background: #000; /* fondo neutro para evitar padding visual */
}
.hero-track {
  display: flex;
  transition: transform 0.6s ease;
  will-change: transform;
}
.hero-slide {
  min-width: 100%;
  box-sizing: border-box;
}
.hero-slide img {
  display: block;
  width: 100%;
  height: auto; /* mantiene proporción sin recortar */
}

/* Indicadores opcionales (no texto) */
.hero-indicators {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 12px;
  display: flex;
  gap: 6px;
}
.hero-indicators .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.6);
}
.hero-indicators .dot.active { background: #fff; }