function animateMenu() {
    gsap.from("#menu-left-images", {
      x: -500,
      duration: 1.5,
    });
  
    gsap.from("#menu-right-images", {
      x: 500,
      duration: 1.5,
    });
  
    gsap.from("#menu-center", {
      opacity: 0,
      scale: 0,
      duration: 1.5,
    });
  }
  
  const header = document.querySelector(".scroll-header");
  const headerLogo = document.querySelector(".header-logo");
  const headerMenu = document.querySelector(".header-menu");
  const headerStyle = document.querySelector(".header-style");
  const body = document.querySelector("body");
  
  window.addEventListener("scroll", () => {
    if (window.scrollY > 0) {
      header.classList.add("scrolled");
      headerMenu.src = "public/header_footer/menu-purple.webp";
      headerStyle.style.padding = "4px";
      body.style.paddingTop = "80px";
    } else {
      header.classList.remove("scrolled");
      headerMenu.src = "public/header_footer/menu.webp";
     
      body.style.paddingTop = "0px";
    }
  });
  
  const menuButton = document.getElementById("menu-button");
  const menu = document.getElementById("menu");
  const closeMenu = document.getElementById("closeMenu");
  
  menuButton.addEventListener("click", () => {
    menu.classList.add("active");
    body.classList.add("menu-open");
    animateMenu();
  });
  
  closeMenu.addEventListener("click", () => {
    menu.classList.remove("active");
    body.classList.remove("menu-open");
  });
  
  const navItems = document.querySelectorAll(".nav-item");
  
  navItems.forEach(item => {
    item.addEventListener("click", () => {
      navItems.forEach(i => i.classList.remove("active"));
      item.classList.add("active");
    });
  });
  
  function reveal() {
    var reveals = document.querySelectorAll(".reveal");
  
    for (var i = 0; i < reveals.length; i++) {
      var windowHeight = window.innerHeight;
      var elementTop = reveals[i].getBoundingClientRect().top;
      var elementVisible = 100;
  
      if (elementTop < windowHeight - elementVisible) {
        reveals[i].classList.add("active");
      } else {
        reveals[i].classList.remove("active");
      }
    }
  }
  
  window.addEventListener("scroll", reveal);