/* Bungkus banner agar punya padding kiri-kanan tanpa overflow */
.banner-wrapper {
  padding: 0 20px;         /* jarak kiri & kanan */
  box-sizing: border-box;  /* supaya padding dihitung di dalam lebar */
}

/* Slider itu sendiri */
.banner-slider {
  width: 100%;
  aspect-ratio: 16/9;      /* ubah sesuai rasio gambar Anda */
  overflow: hidden;
  border-radius: 24px;     /* lengkung sudut */
  position: relative;
}

/* Container untuk semua gambar */
.banner-slider .slides {
  position: relative;
  width: 100%;
  height: 100%;
}

/* Setiap gambar */
.banner-slider .slides img {
  position: absolute;
  inset: 0;                /* top:0; right:0; bottom:0; left:0; */
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1s ease-in-out;
  border-radius: inherit;  /* gunakan lengkung dari parent */
  cursor: default;
}

/* Tampilkan slide aktif */
.banner-slider .slides img.active {
  opacity: 1;
  z-index: 1;
}