.istaro-slider { position: relative; width: 100%; }
.istaro-slider__viewport { overflow: hidden; border-radius: 14px; }
.istaro-slider__track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.istaro-slider__track::-webkit-scrollbar { display: none; }

.istaro-slide { flex: 0 0 100%; scroll-snap-align: start; }
.istaro-slide__link { display:block; width:100%; height:100%; text-decoration:none; }
.istaro-slide__media { display:block; }
.istaro-slide__img {
  display:block;
  width:100%;
  height: clamp(260px, 42vw, 560px);
  object-fit: cover;
  background: #f2f2f2;
}

/* Buttons */
.istaro-slider__btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: rgba(0,0,0,.45);
  cursor: pointer;
}
.istaro-slider__btn--prev { left: 12px; }
.istaro-slider__btn--next { right: 12px; }
.istaro-slider__btn::before {
  content: "";
  display: block;
  width: 10px; height: 10px;
  margin: 0 auto;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(135deg);
}
.istaro-slider__btn--next::before { transform: rotate(-45deg); }

.istaro-slider__dots {
  position:absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  display:flex;
  gap: 8px;
  justify-content: center;
}
.istaro-slider__dot {
  width: 8px; height: 8px;
  border-radius: 999px;
  border: 0;
  background: rgba(255,255,255,.55);
  cursor: pointer;
}
.istaro-slider__dot[aria-current="true"] { background: rgba(255,255,255,.95); }

/* Hide slide by device flags */
@media (min-width: 992px) { .istaro-slide.hide-desktop { display:none; } }
@media (min-width: 576px) and (max-width: 991.98px) { .istaro-slide.hide-tablet { display:none; } }
@media (max-width: 575.98px) { .istaro-slide.hide-mobile { display:none; } }

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  .istaro-slider__track { scroll-behavior: auto; }
}