document.addEventListener('DOMContentLoaded', function () {
  const slider = document.querySelector('.hero-slider');
  if (!slider) return;
  const slides = Array.from(slider.querySelectorAll('.slide'));
  const dots = Array.from(slider.querySelectorAll('.slider-dot'));
  if (slides.length < 2) return;
  let current = 0;
  function showSlide(index) {
    slides.forEach((slide, i) => slide.classList.toggle('is-active', i === index));
    dots.forEach((dot, i) => dot.classList.toggle('is-active', i === index));
    current = index;
  }
  dots.forEach((dot) => dot.addEventListener('click', function () {
    showSlide(Number(this.getAttribute('data-slide')));
  }));
  setInterval(function () {
    showSlide((current + 1) % slides.length);
  }, 5000);
});