// anime par code START
gsap.registerPlugin(ScrollTrigger);

/* ==========================
   HERO ANIMATION
   ========================== */
document.querySelectorAll("[data-animation-wrap]").forEach((wrap) => {
  const secondEls = wrap.querySelectorAll("[data-second-el-appear]");
  const lineEls = wrap.querySelectorAll("[data-line-split-appear]");
  const opacityEls = wrap.querySelectorAll("[data-opacity-appear]");

  if (!secondEls.length && !lineEls.length && !opacityEls.length) return;

  // 👉 INIT opacity-only elements (critical for glow / canvas)
  if (opacityEls.length) {
    gsap.set(opacityEls, { opacity: 0 });
  }

  const tl = gsap.timeline({
    scrollTrigger: {
      trigger: wrap,
      start: "top 80%",
      toggleActions: "play none none none",
    },
  });

  // === TEXT / ITEMS (Y + OPACITY) ===
  if (secondEls.length) {
    tl.to(
      secondEls,
      {
        y: 0,
        opacity: 1,
        duration: 1,
        ease: "power2.out",
        stagger: 0.1,
        onStart() {
          secondEls.forEach((el) => el.classList.add("is-animated"));
        },
      },
      0
    );
  }

  // === OPACITY ONLY (GLOW / CARDS) ===
  if (opacityEls.length) {
    tl.to(
      opacityEls,
      {
        opacity: 1,
        duration: 3,
        ease: "power2.out",
        stagger: 0.12,
        onStart() {
          opacityEls.forEach((el) => el.classList.add("is-animated"));
        },
      },
      0
    );
  }

  // === LINES ===
  if (lineEls.length) {
    tl.to(
      lineEls,
      {
        scaleX: 1,
        duration: 0.8,
        ease: "power2.out",
        stagger: 0.1,
        onStart() {
          lineEls.forEach((el) => el.classList.add("is-animated"));
        },
      },
      0.4
    );
  }
});

/* ==========================
   GLOW PARALLAX
   ========================== */
const mm = gsap.matchMedia();

mm.add("(min-width: 992px)", () => {
  document.querySelectorAll(".section-fp").forEach((section) => {
    const glow = section.querySelector(".glow-animation");
    if (!glow) return;

    gsap.fromTo(
      glow,
      {
        x: -10,
        y: -10,
      },
      {
        x: 80,
        y: 400,
        ease: "none",
        scrollTrigger: {
          trigger: section,
          start: "top bottom",
          end: "bottom top",
          scrub: 2.2,
        },
      }
    );
  });
});
/* ==========================
      GLOW PARALLAX END
      ========================== */