<script>
document.addEventListener("DOMContentLoaded", function() {
  const header = document.querySelector("header");

  // Header fade on scroll
  window.addEventListener("scroll", () => {
    const scrollY = window.scrollY;
    if (scrollY > 20) { // fade after scrolling 20px
      header.style.opacity = "0";
      header.style.pointerEvents = "none";
    } else {
      header.style.opacity = "1";
      header.style.pointerEvents = "auto";
    }
  });

  // Optional: back-to-top button toggle
  const backBtn = document.querySelector('.back-to-top');
  window.addEventListener('scroll', () => {
    if (!backBtn) return;
    if (window.scrollY > 200) {
      document.body.classList.add('scrolled');
    } else {
      document.body.classList.remove('scrolled');
    }
  });
});
</script>