Untitled

// GSAP Timeline Animation
const tl = gsap.timeline({ onComplete: hideIntro });

// Initial setup (Intro panel is shown without animation)
gsap.set(".intro-wrapper", { opacity: 1 });

tl.from(".bg-panel", { color: "black", opacity: 0, duration: 1 });
tl.from(".svg", { opacity: 1, duration: 1.3 });

tl.from(".new-panel", { duration: 1, top: "100%", ease: "power4.out" }, "<")
  .to(
    ".new-panel",
    { duration: 0.8, opacity: 1, ease: "power4.inOut" },
    "-=0.2"
  )
  .to(
    ".new-panel",
    { duration: 0.8, opacity: 0, ease: "power4.inOut" },
    "+=0.8"
  );
tl.set(".bg-panel", { opacity: 0 }, "<");

// Function to hide the intro after the animation
function hideIntro() {
  gsap.to(".intro-wrapper", {
    duration: 0.1,
    opacity: 0,
    delay: 0.1, // Delay before the intro-wrapper fades out
    onComplete: function () {
      document.body.style.overflow = "auto"; // Restore scrolling after the intro
      gsap.set(".intro-wrapper", { display: "none" }); // Hide the intro-wrapper
    }
  });
}