GSAP scrollTrigger animations don't work anymore after I use taxonomy filter or if images were lazy loaded

Question

I have a Wordpress Website built with Elementor Pro. I made loop grid with flipboxes. For mobile and tablets I made rear container showing on scroll instead of hover. I used GSAP scrollTrigger. Here is my JS code:

 gsap.registerPlugin(ScrollTrigger);

  // Function to set up the flip effect
  function setupFlipEffect(element) {
    // Set up the timeline
    const tl = gsap.timeline({
      scrollTrigger: {
        trigger: element,
        start: "top center",
        end: "center center+=200",
        scrub: true,
      },
      ease: "power1.inOut",
    });

    // Set up the flip animations
    tl.to(element.querySelector(".eael-elements-flip-box-front-container"), { opacity: 0 })
      .to(element.querySelector(".eael-elements-flip-box-rear-container"), { opacity: 1 }, 0);

    // Ensure the rear container is visible during rotation
    gsap.set(element.querySelector(".eael-elements-flip-box-rear-container"), { visibility: "visible" });
  }

  // Check if the screen width is below 1024px
  function isMobileScreen() {
    return window.innerWidth < 1024;
  }

  // Apply the flip effect only if it's a mobile screen
  const flipBoxes = document.querySelectorAll(".eael-elements-flip-box-flip-card");
  if (isMobileScreen()) {
    flipBoxes.forEach((flipBox) => {
      setupFlipEffect(flipBox);
    });
  }

It works until I use filter (which is Elementor's Taxonomy Filter). I need to refresh page to make it work again. I tried to call ScrollTrigger.refresh(); at the end, but it doesn't solve the problem. If someone has any idea what I did wrong or forgot to write, please help.link to the website

 gsap.registerPlugin(ScrollTrigger);

  // Function to set up the flip effect
  function setupFlipEffect(element) {
    // Set up the timeline
    const tl = gsap.timeline({
      scrollTrigger: {
        trigger: element,
        start: "top center",
        end: "center center+=200",
        scrub: true,
      },
      ease: "power1.inOut",
    });

    // Set up the flip animations
    tl.to(element.querySelector(".eael-elements-flip-box-front-container"), { opacity: 0 })
      .to(element.querySelector(".eael-elements-flip-box-rear-container"), { opacity: 1 }, 0);

    // Ensure the rear container is visible during rotation
    gsap.set(element.querySelector(".eael-elements-flip-box-rear-container"), { visibility: "visible" });
  }

  // Check if the screen width is below 1024px
  function isMobileScreen() {
    return window.innerWidth < 1024;
  }

  // Apply the flip effect only if it's a mobile screen
  const flipBoxes = document.querySelectorAll(".eael-elements-flip-box-flip-card");
  if (isMobileScreen()) {
    flipBoxes.forEach((flipBox) => {
      setupFlipEffect(flipBox);
    });
  }

ScrollTrigger.refresh();