document.addEventListener("DOMContentLoaded", () => {
  // 1. Dynamic Year in Footer
  const yearSpan = document.getElementById("year");
  if (yearSpan) {
    yearSpan.textContent = new Date().getFullYear();
  }

  // 2. Navbar Scroll Effect
  const nav = document.getElementById("site-nav");
  window.addEventListener("scroll", () => {
    if (window.scrollY > 50) {
      nav.classList.remove("bg-transparent");
      nav.classList.add("bg-black/90", "backdrop-blur-xl", "border-b", "border-white/10");
    } else {
      nav.classList.add("bg-transparent");
      nav.classList.remove("bg-black/90", "backdrop-blur-xl", "border-b", "border-white/10");
    }
  });

  // 3. Mobile Menu Toggle
  const mobileBtn = document.getElementById("mobile-menu-button");
  const mobileMenu = document.getElementById("mobile-menu");
  
  if (mobileBtn && mobileMenu) {
    mobileBtn.addEventListener("click", () => {
      mobileMenu.classList.toggle("opacity-0");
      mobileMenu.classList.toggle("invisible");
      mobileMenu.classList.toggle("-translate-y-4");
    });

    // Close mobile menu when clicking a link
    const mobileLinks = mobileMenu.querySelectorAll("a");
    mobileLinks.forEach(link => {
      link.addEventListener("click", () => {
        mobileMenu.classList.add("opacity-0", "invisible", "-translate-y-4");
      });
    });
  }

  // 4. Scroll Reveal Intersection Observer
  const revealElements = document.querySelectorAll(".reveal");
  const revealObserver = new IntersectionObserver((entries, observer) => {
    entries.forEach((entry) => {
      if (entry.isIntersecting) {
        entry.target.classList.add("is-in");
        observer.unobserve(entry.target); // Stop observing once revealed
      }
    });
  }, {
    root: null,
    threshold: 0.15, // Trigger when 15% of the element is visible
    rootMargin: "0px 0px -50px 0px"
  });

  revealElements.forEach((el) => revealObserver.observe(el));

  // 5. Animated Number Counters
  const counters = document.querySelectorAll(".counter");
  const counterObserver = new IntersectionObserver((entries, observer) => {
    entries.forEach((entry) => {
      if (entry.isIntersecting) {
        const counter = entry.target;
        const target = +counter.getAttribute("data-target");
        const duration = 2000; // 2 seconds
        const increment = target / (duration / 16); // 60fps
        let current = 0;

        const updateCounter = () => {
          current += increment;
          if (current < target) {
            counter.innerText = Math.ceil(current);
            requestAnimationFrame(updateCounter);
          } else {
            counter.innerText = target;
          }
        };

        updateCounter();
        observer.unobserve(counter);
      }
    });
  }, { threshold: 0.5 });

  counters.forEach((counter) => counterObserver.observe(counter));

  // 6. Video Modal Logic
  const videoCards = document.querySelectorAll(".reel-card");
  const videoModal = document.getElementById("video-modal");
  const closeModal = document.getElementById("close-modal");
  const videoFrame = document.getElementById("video-frame");

  if (videoModal && closeModal && videoFrame) {
    videoCards.forEach((card) => {
      card.addEventListener("click", () => {
        const videoUrl = card.getAttribute("data-video");
        if (videoUrl) {
          videoFrame.src = videoUrl;
          videoModal.classList.remove("hidden");
          // Slight delay to allow display:block to apply before animating opacity
          setTimeout(() => {
            videoModal.classList.remove("opacity-0");
          }, 10);
          document.body.style.overflow = "hidden"; // Prevent background scrolling
        }
      });
    });

    const closeVideo = () => {
      videoModal.classList.add("opacity-0");
      setTimeout(() => {
        videoModal.classList.add("hidden");
        videoFrame.src = ""; // Stop video playback
        document.body.style.overflow = ""; // Restore scrolling
      }, 300);
    };

    closeModal.addEventListener("click", closeVideo);
    
    // Close on background click
    videoModal.addEventListener("click", (e) => {
      if (e.target === videoModal) {
        closeVideo();
      }
    });
    
    // Close on Escape key
    document.addEventListener("keydown", (e) => {
      if (e.key === "Escape" && !videoModal.classList.contains("hidden")) {
        closeVideo();
      }
    });
  }
});