CustomEase.create("primary-ease", "M0,0 C0.15,0 0.15,1 1,1");

function checkPreloader() {
  $(window).scrollTop(0);
  if (sessionStorage.getItem("visited") !== null) {
  } else {
    runSplit();
  }
  sessionStorage.setItem("visited", "true");
}

let introDuration = 1.4;
let preloaderText = $(".preloader_text");
let textWrapper = $(".preloader_text_wrap");
let textDestination = $(".nav_logo_holder");

function moveText(element) {
  let state = Flip.getState(preloaderText);
  preloaderText.appendTo(element);
  Flip.from(state, {
    duration: 1.4,
    ease: "expo.inOut",
    scale: true,
  });
}

// LENIS OPEN
const isMobile = window.matchMedia("(max-width: 991px)").matches;
const lenis = new Lenis({
  syncTouch: !isMobile,
  syncTouchLerp: 0.075,
  touchInertiaExponent: 1.7,
  touchMultiplier: 1,
});

gsap.ticker.add((time) => {
  lenis.raf(time * 1000);
});

gsap.ticker.lagSmoothing(0);

lenis.on("scroll", ScrollTrigger.update);

let winW = window.innerWidth;

window.addEventListener("resize", () => {
  if (window.innerWidth !== winW) {
    winW = window.innerWidth;
    ScrollTrigger.refresh();
  }
});
//LENIS CLOSE
gsap.config({
  nullTargetWarn: false,
});


let defaultStagger = "0.13";
let loadSplit;
let loadSplitLine;

function runSplit() {
  // Destroy existing SplitText if it exists
  if (loadSplit) {
    loadSplit.revert();
  }

  loadSplit = new SplitText(".preloader_text, [split], .ghero-text", {
    type: "lines, words, chars",
    linesClass: "line",
    wordsClass: "word",
    charsClass: "char",
  });
}
runSplit();

function runSplitNoChars() {
  // Destroy existing SplitText if it exists
  if (loadSplitLine) {
    loadSplitLine.revert();
  }

  loadSplitLine = new SplitText("[splitline], [hero-split]", {
    type: "lines",
    linesClass: "line",
  });
}
runSplitNoChars();

function initScrollAnimations() {
  gsap.matchMedia().add("(min-width: 992px)", () => {
    const splits = [];
    // --- Lines Animation ---
    $("[scroll-animation=lines]").each(function () {
      const el = this;

      const split = SplitText.create(el, {
        type: "lines",
        mask: "lines",
        autoSplit: true,
        linesClass: "line",
        onSplit: function (instance) {
          const tl = gsap.timeline({
            scrollTrigger: {
              trigger: el,
              start: "top 85%",
              toggleActions: "play none none none",
            },
          });

          tl.fromTo(
            instance.lines,
            {
              yPercent: 100,
              clipPath: "polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%)",
            },
            {
              yPercent: 0,
              clipPath: "polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)",
              ease: "expo.out",
              duration: 2,
              stagger: { each: 0.2 },
            },
            0
          );

          return tl;
        },
      });

      splits.push(split);
    });

    // Cleanup: revert SplitText instances when breakpoint exits
    return () => splits.forEach((split) => split.revert());
  });
}
// Wait for fonts to load before splitting text
document.fonts.ready.then(() => {
  initScrollAnimations();
});

// Multiple HubSpot forms for specific containers

function loadHubSpotScript() {
  return new Promise((resolve) => {
    if (window.hsFormsLoaded) {
      resolve();
      return;
    }

    const script = document.createElement("script");
    script.src = "https://js.hsforms.net/forms/embed/20653391.js";
    script.defer = true;
    script.onload = () => {
      window.hsFormsLoaded = true;
      resolve();
    };
    document.head.appendChild(script);
  });
}

function createHubSpotForms() {
  // Clean up any existing forms first
  const existingForms = document.querySelectorAll(
    ".hs-form-frame, .hbspt-form"
  );
  existingForms.forEach((form) => form.remove());

  // Define form configurations
  const formConfigs = [
    {
      containerId: "contact-modal-aus",
      formId: "84aace22-80a7-40ef-bf52-543990fed018",
    },
    {
      containerId: "contact-page-aus",
      formId: "40352a85-cddd-4ccd-9dbc-ebfce009b586",
    },
    {
      containerId: "contact-modal-africa",
      formId: "deed7477-da0c-4973-a657-e4ec3a91663b",
    },
    {
      containerId: "contact-page-africa",
      formId: "15fd6b1d-1036-4e91-92db-20a342371d43",
    },
    {
      containerId: "curate-aus-modal-0",
      formId: "84aace22-80a7-40ef-bf52-543990fed018",
    },
    {
      containerId: "contact-aus-modal-0",
      formId: "84aace22-80a7-40ef-bf52-543990fed018",
    },
    {
      containerId: "contact-africa-modal-0",
      formId: "deed7477-da0c-4973-a657-e4ec3a91663b",
    },
    {
      containerId: "curate-africa-modal-0",
      formId: "deed7477-da0c-4973-a657-e4ec3a91663b",
    },
  ];

  let formsCreated = 0;

  // Loop through each form configuration
  formConfigs.forEach((config) => {
    const container = document.getElementById(config.containerId);

    if (container) {
      // Clear container
      container.innerHTML = "";

      // Create form frame with data attributes
      const formFrame = document.createElement("div");
      formFrame.className = "hs-form-frame";
      formFrame.setAttribute("data-region", "na1");
      formFrame.setAttribute("data-form-id", config.formId);
      formFrame.setAttribute("data-portal-id", "20653391");
      container.appendChild(formFrame);

      formsCreated++;

      // Monitor if form renders
      const observer = new MutationObserver((mutations, obs) => {
        if (
          container.querySelector("form") ||
          container.querySelector(".hbspt-form")
        ) {
          obs.disconnect();
          return;
        }

        // Fallback to old method if new method fails
        setTimeout(() => {
          if (
            !container.querySelector("form") &&
            window.hbspt &&
            window.hbspt.forms
          ) {
            formFrame.remove();

            window.hbspt.forms.create({
              region: "na1",
              portalId: "20653391",
              formId: config.formId,
              target: container,
            });
          }
          obs.disconnect();
        }, 2000);
      });

      observer.observe(container, {
        childList: true,
        subtree: true,
      });
    } else {
    }
  });

  if (formsCreated > 0) {
    // Trigger HubSpot's form scanner if available
    if (window.hbspt && window.hbspt.forms && window.hbspt.forms.scanForForms) {
      setTimeout(() => {
        window.hbspt.forms.scanForForms();
      }, 100);
    }
  } else {
  }
}

function initHubSpotForms() {
  loadHubSpotScript().then(() => {
    setTimeout(() => {
      createHubSpotForms();
    }, 300);
  });
}

// Compatibility functions
function loadHubSpotForm() {
  initHubSpotForms();
}

function createHubSpotForm() {
  createHubSpotForms();
}

// Load on first page
document.addEventListener("DOMContentLoaded", function () {
  setTimeout(initHubSpotForms, 1000);
});

function homeInitScroll() {
  // console.log("homeInitScroll");
  $(".reveal_section.home-reveal").each(function () {
    let homeRevealHolder = $(".expanding_visual_wrap.home");
    let homeRevealTrigger = $(".spacer.is-local");
    let homeRevealEyebrow = $("[homeeyebrow]");
    let homeRevealBtn = $("[homebtn]");
    let homeRevealOverlay = $(".reveal_overlay.home");
    let homeRevealSlider = $(".slider_top, .slider_bot_wrap, .slider_dot_wrap");
    let revealOverlayText = $(".overlay_heading_wrap");
    let homeRevealOverlayLines = revealOverlayText.find(".line");
    let homeRevealLogo = $(".home-reveal_logo.bot");
    let homeRevealLogoIcon = $(".section_2_svg_holder");
    let homeUp2 = $("[homeup2]");
    let homeDown = $("[homedown]");
    let homeDown2 = $("[homedown2]");
    let homeUp = $("[homeup]");
    let homeUpSet = homeUp.find(".char");
    let homeUp2Set = homeUp2.find(".char");
    let homeDownSet = homeDown.find(".char");
    let homeDown2Set = homeDown2.find(".char");

    gsap.set(homeUpSet, { y: "0vh" });
    gsap.set(homeUp2Set, { y: "0vh" });
    gsap.set(homeDownSet, { y: "0vh" });
    gsap.set(homeDown2Set, { y: "0vh" });

    gsap.matchMedia().add("(min-width: 767px)", () => {
      gsap.set(homeRevealOverlay, { opacity: 0 });
      //part 1
      let revealExpand = gsap.timeline({
        scrollTrigger: {
          trigger: homeRevealTrigger,
          start: "top bottom",
          end: "top top",
          scrub: 1.5,
        },
      });

      revealExpand.fromTo(
        homeRevealHolder,
        {
          height: "100%",
          width: "100%",
          clipPath:
            "polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%)",
        },
        {
          height: "100%",
          width: "100%",
          clipPath:
            "polygon(5% 25%, 0% 50%, 5% 75%, 25% 95%, 50% 100%, 75% 95%, 95% 75%, 100% 50%, 95% 25%, 75% 5%, 50% 0%, 25% 5%)",
        }
      );
      revealExpand.fromTo(
        homeRevealEyebrow,
        {
          y: "0vh",
        },
        {
          y: "-60vh",
        },
        "<"
      );
      revealExpand.fromTo(
        homeRevealBtn,
        {
          y: "0",
        },
        {
          y: "60vh",
        },
        "<"
      );
      revealExpand.to(
        homeRevealHolder,
        {
          yPercent: 0,
          clipPath:
            "polygon(0% 0%, 0% 50%, 0% 100%, 24% 100%, 50% 100%, 77% 100%, 100% 100%, 100% 50%, 100% 0%, 77% 0%, 50% 0%, 22% 0%)",
        },
        "95%"
      );
    });

    //part 2

    let homeRevealSliderTop = gsap.timeline({
      scrollTrigger: {
        trigger: homeRevealTrigger,
        start: "center bottom",
        end: "center bottom",
        toggleActions: "play none none none",
      },
    });

    gsap.matchMedia().add("(max-width: 766px)", () => {
      clipSwiper();
    });

    gsap.matchMedia().add("(min-width: 767px)", () => {

      homeRevealSliderTop.fromTo(
        homeRevealSlider,
        {
          opacity: 0,
        },
        {
          opacity: 1,
        }
      );
    });
    //
    let homeRevealClip = gsap.timeline({
      scrollTrigger: {
        trigger: homeRevealTrigger,
        start: "center bottom",
        end: "center top",
        scrub: true,
      },
    });
    gsap.matchMedia().add("(min-width: 767px)", () => {
      homeRevealClip.to(homeRevealOverlay, {
        opacity: 1,
      });
    });
    homeRevealClip.fromTo(
      homeRevealLogo,
      {
        opacity: 0,
      },
      {
        opacity: 1,
      }
    );
    gsap.matchMedia().add("(min-width: 767px)", () => {
      homeRevealClip.fromTo(
        homeRevealOverlayLines,
        {
          yPercent: 100,
          clipPath: "polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%)",
        },
        {
          yPercent: 0,
          clipPath: "polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)",
          ease: "power1.out",
          stagger: { each: 0.1 },
        },
        "<50%"
      );
    });
    gsap.matchMedia().add("(min-width: 767px)", () => {
      homeRevealClip.fromTo(
        homeRevealLogoIcon,
        {
          opacity: 0,
        },
        {
          opacity: 1,
          ease: "power1.out",
          stagger: { each: 0.1 },
        },
        "<50%"
      );
    });
    gsap.matchMedia().add("(max-width: 766px)", () => {
      homeRevealClip.fromTo(
        homeRevealOverlayLines,
        {
          yPercent: 100,
          clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
        },
        {
          yPercent: 100,
          clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
          ease: "power1.out",
          stagger: { each: 0.1 },
        },
        "<50%"
      );
    });

    gsap.matchMedia().add("(min-width: 767px)", () => {
      homeUp.each(function () {
        let homeTextUp = gsap.timeline({
          scrollTrigger: {
            trigger: homeRevealTrigger,
            start: "top bottom",
            end: "top top",
            scrub: 1.5,
          },
        });

        homeTextUp.to($(this).find(".char"), {
          y: "-100vh",
          stagger: {
            amount: 0.01,
            from: "center",
            grid: [null, 1],
            axis: "y",
            from: 0.5,
          },
        });
      });

      homeUp2.each(function () {
        let homeTextUp2 = gsap.timeline({
          scrollTrigger: {
            trigger: homeRevealTrigger,
            start: "top bottom",
            end: "top top",
            scrub: 1.5,
          },
        });

        homeTextUp2.to($(this).find(".char"), {
          y: "-100vh",
          stagger: {
            amount: 0.01,
            from: "center",
            grid: [null, 1],
            axis: "y",
            from: 0.5,
          },
        });
      });

      homeDown.each(function () {
        let homeTextDown = gsap.timeline({
          scrollTrigger: {
            trigger: homeRevealTrigger,
            start: "top bottom",
            end: "top top",
            scrub: 1.5,
          },
        });

        homeTextDown.to($(this).find(".char"), {
          y: "100vh",
          stagger: {
            amount: 0.01,
            from: "center",
            grid: [null, 1],
            axis: "y",
            from: 0.5,
          },
        });
      });
      homeDown2.each(function () {
        let homeTextDown2 = gsap.timeline({
          scrollTrigger: {
            trigger: homeRevealTrigger,
            start: "top bottom",
            end: "top top",
            scrub: 1.5,
          },
        });

        homeTextDown2.to($(this).find(".char"), {
          y: "100vh",
          stagger: {
            amount: 0.003,
            from: "center",
            grid: [null, 1],
            axis: "y",
            from: 0.5,
          },
        });
      });
    });
  });
}
homeInitScroll();

function aboutInitScroll() {
  $(".about-reveal").each(function () {
    let revealHolder = $(".expanding_visual_wrap");
    let revealTrigger = $(".spacer.is-local");
    let aboutRevealEyebrow = $(".reveal_eyebrow");
    let aboutRevealBtn = $(".reveal_btn_holder");
    let revealOverlay = $(".reveal_overlay");
    let revealOverlayText = $(".overlay_heading_wrap");
    let revealOverlayLines = revealOverlayText.find(".line");
    let revealLogo = $(".reveal_logo.bot");

    //part 1
    let revealExpand = gsap.timeline({
      scrollTrigger: {
        trigger: revealTrigger,
        start: "top bottom",
        end: "top top",
        scrub: 1.5,
      },
    });
    gsap.matchMedia().add("(min-width: 767px)", () => {
      revealExpand.fromTo(
        revealHolder,
        {
          height: "30%",
          width: "10%",
          clipPath:
            "polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%)",
        },
        {
          height: "60%",
          width: "50%",
          clipPath:
            "polygon(5% 25%, 0% 50%, 5% 75%, 25% 95%, 50% 100%, 75% 95%, 95% 75%, 100% 50%, 95% 25%, 75% 5%, 50% 0%, 25% 5%)",
        }
      );

      revealExpand.fromTo(
        aboutRevealEyebrow,
        {
          y: "0vh",
        },
        {
          y: "-60vh",
        },
        "<"
      );
      revealExpand.fromTo(
        aboutRevealBtn,
        {
          y: "0",
        },
        {
          y: "60vh",
        },
        "<"
      );
      revealExpand.to(
        revealHolder,
        {
          yPercent: 1,
          clipPath:
            "polygon(0% 0%, 2% 16%, 0% 100%, 20% 99%, 63% 98%, 84% 99%, 100% 100%, 99% 62%, 100% 0%, 78% 2%, 67% 1%, 38% 1%)",
        },
        "95%"
      );
    });
    //part 2
    let revealClip = gsap.timeline({
      scrollTrigger: {
        trigger: revealTrigger,
        start: "center bottom",
        end: "center top",
        scrub: true,
      },
    });
    gsap.matchMedia().add("(min-width: 767px)", () => {
      gsap.set(".revealOverlay", { opacity: 1 });
      revealClip.to(revealOverlay, {
        opacity: 1,
      });

      revealClip.fromTo(
        revealOverlayLines,
        {
          yPercent: 100,
          clipPath: "polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)",
        },
        {
          yPercent: 0,
          clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
          ease: "power1.out",
          stagger: { each: 0.1 },
        },
        "<50%"
      );
      revealClip.fromTo(
        revealLogo,
        {
          opacity: 0,
        },
        {
          opacity: 1,
        },
        "<80%"
      );
    });
    gsap.matchMedia().add("(min-width: 767px)", () => {
      let aboutUp = $("[aboutup]");

      aboutUp.each(function () {
        let aboutTextUp = gsap.timeline({
          scrollTrigger: {
            trigger: revealTrigger,
            start: "top bottom",
            end: "top top",
            scrub: 1.5,
          },
        });

        aboutTextUp.to($(this).find(".char"), {
          y: "-100vh",
          stagger: {
            amount: 0.02,
            from: "center",
            grid: [null, 1],
            axis: "y",
            from: 0.46,
          },
        });
      });
      let aboutDown = $("[aboutdown]");
      aboutDown.each(function () {
        let aboutTextDown = gsap.timeline({
          scrollTrigger: {
            trigger: revealTrigger,
            start: "top bottom",
            end: "top top",
            scrub: 1.5,
          },
        });

        aboutTextDown.to($(this), {
          y: "100vh",
        });
      });
    });
  });
}

function categoryInitScroll() {
  $(".category-reveal").each(function () {
    let revealHolder = $(".expanding_visual_wrap");
    let revealTrigger = $(".spacer.is-local");
    let revealEyebrow = $("[categoryeyebrow");
    let revealBtn = $("[categorybtn]");
    let revealOverlay = $(".reveal_overlay");
    let revealOverlayText = $(".overlay_heading_wrap");
    let revealOverlayLines = revealOverlayText.find(".line");
    let revealLogo = $(".reveal_logo.bot");

    gsap.matchMedia().add("(min-width: 767px)", () => {
      //part 1
      let revealExpand = gsap.timeline({
        scrollTrigger: {
          trigger: revealTrigger,
          start: "top bottom",
          end: "top top",
          scrub: 1.5,
        },
      });

      revealExpand.fromTo(
        revealHolder,
        {
          height: "30%",
          width: "30%",
          clipPath:
            "polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%)",
        },
        {
          height: "90%",
          width: "90%",
          clipPath:
            "polygon(5% 25%, 0% 50%, 5% 75%, 25% 95%, 50% 100%, 75% 95%, 95% 75%, 100% 50%, 95% 25%, 75% 5%, 50% 0%, 25% 5%)",
        }
      );
      revealExpand.fromTo(
        revealEyebrow,
        {
          y: "0vh",
        },
        {
          y: "-60vh",
        },
        "<"
      );
      revealExpand.fromTo(
        revealBtn,
        {
          y: "0",
        },
        {
          y: "60vh",
        },
        "<"
      );
      revealExpand.to(
        revealHolder,
        {
          yPercent: 1,
          height: "100%",
          width: "100%",
          clipPath:
            "polygon(0% 0%, 0% 50%, 0% 100%, 24% 100%, 50% 100%, 77% 100%, 100% 100%, 100% 50%, 100% 0%, 77% 0%, 50% 0%, 22% 0%)",
        },
        "95%"
      );
    });
    //part 2
    let revealClip = gsap.timeline({
      scrollTrigger: {
        trigger: revealTrigger,
        start: "center bottom",
        end: "center top",
        scrub: true,
      },
    });

    revealClip.to(revealOverlay, {
      opacity: 1,
    });

    revealClip.fromTo(
      revealOverlayLines,
      {
        yPercent: 100,
        clipPath: "polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)",
      },
      {
        yPercent: 0,
        clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
        ease: "power1.out",
        stagger: { each: 0.1 },
      },
      "<50%"
    );
    revealClip.fromTo(
      revealLogo,
      {
        opacity: 0,
      },
      {
        opacity: 1,
      },
      "<80%"
    );
    let categoryUp = $("[categoryup]");
    let categoryUp2 = $("[categoryup2]");
    let categoryDown = $("[categorydown]");
    let categoryDown2 = $("[categorydown2]");
  
    gsap.matchMedia().add("(min-width: 767px)", () => {
      categoryUp.each(function () {
        let categoryTextUp = gsap.timeline({
          scrollTrigger: {
            trigger: revealTrigger,
            start: "top bottom",
            end: "top top",
            scrub: 1.5,
          },
        });

        categoryTextUp.to($(this).find(".char"), {
          y: "-100vh",
          stagger: {
            amount: 0.005,
            from: "center",
            grid: [null, 1],
            axis: "y",
            from: 0.5,
          },
        });
      });

      categoryUp2.each(function () {
        let categoryTextUp2 = gsap.timeline({
          scrollTrigger: {
            trigger: revealTrigger,
            start: "top bottom",
            end: "top top",
            scrub: 1.5,
          },
        });

        categoryTextUp2.to($(this).find(".char"), {
          y: "-100vh",
          stagger: {
            amount: 0.005,
            from: "center",
            grid: [null, 1],
            axis: "y",
            from: 0.5,
          },
        });
      });
      categoryDown.each(function () {
        let categoryTextDown = gsap.timeline({
          scrollTrigger: {
            trigger: revealTrigger,
            start: "top bottom",
            end: "top top",
            scrub: 1.5,
          },
        });

        categoryTextDown.to($(this).find(".char"), {
          y: "100vh",
          stagger: {
            amount: 0.005,
            from: "center",
            grid: [null, 1],
            axis: "y",
            from: 0.5,
          },
        });
      });
      categoryDown2.each(function () {
        let categoryTextDown2 = gsap.timeline({
          scrollTrigger: {
            trigger: revealTrigger,
            start: "top bottom",
            end: "top top",
            scrub: 1.5,
          },
        });

        categoryTextDown2.to($(this).find(".char"), {
          y: "100vh",
          stagger: {
            amount: 0.005,
            from: "center",
            grid: [null, 1],
            axis: "y",
            from: 0.5,
          },
        });
      });
    });
  });
}

function heroTextLoad() {
  // console.log("herotextload");
  $("[std-text-load]").each(function () {
    let pageLoadText = gsap.timeline({
    });
    pageLoadText.fromTo(
      $(this).find(".line"),
      {
        yPercent: 100,
        clipPath: "polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%)",
      },
      {
        yPercent: 0,
        clipPath: "polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)",
        ease: "expo.out",
        duration: 2.3,
        stagger: { each: 0.2 },
      }
    );
    pageLoadText.to(
      "[intro-fade]",
      {
        opacity: 1,
        duration: 1,
      },
      "<+20%"
    );
  });

  function initLoadAnimations() {
      const splitsload = [];
      // --- Lines Animation ---
      $("[std-text-load]").each(function () {
        const elLoad = this;
  
        const splitload = SplitText.create(elLoad, {
          type: "lines",
          mask: "lines",
          autoSplit: true,
          linesClass: "line",
          onSplit: function (instanceload) {
            const load = gsap.timeline({
              scrollTrigger: {
                trigger: elLoad,
                start: "top 85%",
                toggleActions: "play none none none",
              },
            });
  
            load.fromTo(
              instanceload.lines,
              {
                yPercent: 100,
                clipPath: "polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%)",
              },
              {
                yPercent: 0,
                clipPath: "polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)",
                ease: "expo.out",
                duration: 2,
                stagger: { each: 0.2 },
              },
              0
            );
  
            return tl;
          },
        });
  
        splitsload.push(splitload);
      });
  
      // Cleanup: revert SplitText instances when breakpoint exits
      return () => splitsload.forEach((splitload) => splitload.revert());

    gsap.fromTo(
          "[intro-fade]",
          {
            opacity: 0,
            y: '15rem'
          },
          {
            opacity: 1,
            y: '0rem',
            duration: 0.8,
            ease: "expo.out"
          },
          "<+20%"
        );
  }
  // Wait for fonts to load before splitting text
  document.fonts.ready.then(() => {
    initLoadAnimations();
  });
}

function contactTextLoad() {
  $("[intro-fade]").each(function () {
    let contactLoadText = gsap.timeline({
      // heroTextLoad
      onComplete: () => {
        // lenis.start();
      },
    });
    contactLoadText.to(
      "[intro-fade]",
      {
        opacity: 1,
        duration: 1,
      },
      "<20%"
    );
  });
}

function clipHeroSwiper() {
  $(".hero_case_study_wrap").each(function () {
    let childArrow = $(this).find(".slider_btn");
    let childItems = $(this).find(".hero_case_study_item").hide();
    let childDots = $(this).find(".slider_nav_item");
    let totalSlides = childItems.length;
    let activeIndex = 0;

    childItems.first().css("display", "flex");
    childDots.css("width", "0.25rem");

    childDots.eq(0).addClass("active").css("width", "100%");
    gsap.set(childDots.eq(0).find(".slider_nav_line"), { x: "0%" });

    let tl2 = gsap.timeline({ repeat: -1 });
    childDots.each(function (index) {
      tl2.addLabel(`step${index}`);
      tl2.to($(this).find(".slider_nav_line"), {
        scaleX: "1.0",
        ease: "none",
        duration: 5,
        onComplete: () => {
          goNext(index + 1);
        },
      });
    });

    function moveSlide(nextIndex, forwards) {
      // Remove active class from current dot and reset width
      childDots.eq(activeIndex).removeClass("active").css("width", "0.25rem");

      // Add active class to next dot and set width
      childDots.eq(nextIndex).addClass("active").css("width", "80%");

      let tl3 = gsap.timeline();
      tl3.set(childDots.eq(nextIndex).find(".slider_nav_line"), {
        x: "0%",
      });
      tl3.fromTo(
        childDots.eq(activeIndex).find(".slider_nav_line"),
        { x: "0%" },
        { x: "100%" }
      );

      tl2.seek(`step${nextIndex}`);

      let titleFrom = -100;
      let titleDelay = "<";
      if (forwards) {
        titleFrom = 100;
        titleDelay = "<50%";
      }

      childItems.hide();
      let prevItem = childItems.eq(activeIndex).css("display", "flex");
      let nextItem = childItems.eq(nextIndex).css("display", "flex");
      let tl = gsap.timeline({
        defaults: { duration: 1, ease: "power2.inOut" },
      });
      if (forwards) {
        tl.fromTo(
          nextItem,
          { yPercent: 100, opacity: 0 },
          { yPercent: 0, opacity: 1 }
        );
        tl.to(prevItem, { yPercent: -50, opacity: 0, scale: 0.95 }, "<");
      } else {
        tl.fromTo(
          nextItem,
          { yPercent: -50, opacity: 0 },
          { yPercent: 0, opacity: 1 }
        );
        tl.to(prevItem, { yPercent: 100, opacity: 0, scale: 0.95 }, "<");
      }

      activeIndex = nextIndex;
    }

    function goNext(num) {
      let nextIndex = num;
      if (nextIndex > totalSlides - 1) nextIndex = 0;
      moveSlide(nextIndex, true);
    }

    childArrow.filter(".is-next").on("click", function () {
      goNext(activeIndex + 1);
    });

    childArrow.filter(".is-prev").on("click", function () {
      let nextIndex = activeIndex - 1;
      if (nextIndex < 0) nextIndex = totalSlides - 1;
      moveSlide(nextIndex, false);
    });

    childDots.on("click", function () {
      let dotIndex = $(this).index();
      if (activeIndex > dotIndex) {
        moveSlide(dotIndex, false);
      } else if (activeIndex < dotIndex) {
        moveSlide(dotIndex, true);
      }
    });
  });
}

function clipSwiper() {
  // console.log("clipSwiperStart");
  $(".slider_wrap").each(function () {
    let childArrow = $(this).find(".slider_btn");
    let childItems = $(this).find(".slider_cms_item").hide();
    let childDots = $(this).find(".slider_dot_item");
    let totalSlides = childItems.length;
    let activeIndex = 0;

    childItems.first().css("display", "flex");
    gsap.set(childDots.eq(0).find(".slider_dot_line"), { x: "0%" });

    let tl2 = gsap.timeline({ repeat: -1 });
    childDots.each(function (index) {
      tl2.addLabel(`step${index}`);
      tl2.to($(this).find(".slider_dot_line"), {
        scaleX: "1.0",
        ease: "none",
        duration: 5,
        onComplete: () => {
          goNext(index + 1);
        },
      });
    });
    function moveSlide(nextIndex, forwards) {
      let tl3 = gsap.timeline();
      tl3.set(childDots.eq(nextIndex).find(".slider_dot_line"), { x: "0%" });
      tl3.fromTo(
        childDots.eq(activeIndex).find(".slider_dot_line"),
        { x: "0%" },
        { x: "100%" }
      );

      tl2.seek(`step${nextIndex}`);

      let titleFrom = -100;
      let titleDelay = "<";
      if (forwards) {
        titleFrom = 100;
        titleDelay = "<50%";
      }
      //
      childItems.hide();
      let prevItem = childItems.eq(activeIndex).css("display", "flex");
      let nextItem = childItems.eq(nextIndex).css("display", "flex");
      let tl = gsap.timeline({
        defaults: { duration: 1, ease: "power2.inOut" },
      });
      if (forwards) {
        tl.fromTo(nextItem, { opacity: 0 }, { opacity: 1 });
        tl.fromTo(prevItem, { opacity: 1 }, { opacity: 0 }, "<");
      } else {
        tl.fromTo(nextItem, { opacity: 0 }, { opacity: 1 });
        tl.fromTo(prevItem, { opacity: 1 }, { opacity: 0 }, "<");
      }

      tl.fromTo(
        nextItem.find(".slider_eyebrow, .slider_copy_box, .slider_cms_title"),
        { opacity: 0 },
        { opacity: 1 },
        "<+0.2"
      );

      activeIndex = nextIndex;
    }
    function goNext(num) {
      let nextIndex = num;
      if (nextIndex > totalSlides - 1) nextIndex = 0;
      moveSlide(nextIndex, true);
    }
    childArrow.filter(".is-next").on("click", function () {
      goNext(activeIndex + 1);
    });
    childArrow.filter(".is-prev").on("click", function () {
      let nextIndex = activeIndex - 1;
      if (nextIndex < 0) nextIndex = totalSlides - 1;
      moveSlide(nextIndex, false);
    });

    childDots.on("click", function () {
      let dotIndex = $(this).index();
      if (activeIndex > dotIndex) {
        moveSlide(dotIndex, false);
      } else if (activeIndex < dotIndex) {
        moveSlide(dotIndex, true);
      }
    });
  });
 
}

function cursorColor() {
  //CURSORS
  const $cursorDot = $(".cursor_dot");
  const defaultColor = $cursorDot.css("background-color");
  const defaultText = $cursorDot.css("color");
  function changeCursorColor(colorVar) {
    $cursorDot.css("background-color", `var(${colorVar})`);
  }
  function changeTextColor(colorValue) {
    $cursorDot.css("color", colorValue);
  }
  $('[data-theme="blue"]')
    .on("mouseenter", function () {
      changeCursorColor("--swatch--african-lily");
      changeTextColor("var(--swatch--little-devil)");
    })
    .on("mouseleave", function () {
      $cursorDot.css("background-color", defaultColor);
      $cursorDot.css("color", defaultText);
    });

  $('[data-theme="brown"]')
    .on("mouseenter", function () {
      changeCursorColor("--swatch--brand");
      changeTextColor("var(--swatch--secondary-dark)");
    })
    .on("mouseleave", function () {
      $cursorDot.css("background-color", defaultColor);
      $cursorDot.css("color", defaultText);
    });

  $('[data-theme="green"]')
    .on("mouseenter", function () {
      changeCursorColor("--swatch--budgie-green");
      changeTextColor("var(--swatch--eucalyptus)");
    })
    .on("mouseleave", function () {
      $cursorDot.css("background-color", defaultColor);
      $cursorDot.css("color", defaultText);
    });

  $('[data-theme="orange"]')
    .on("mouseenter", function () {
      changeCursorColor("--swatch--lions-tail");
      changeTextColor("var(--swatch--rich-bark)");
    })
    .on("mouseleave", function () {
      $cursorDot.css("background-color", defaultColor);
      $cursorDot.css("color", defaultText);
    });

  $('[data-theme="lightbrown"]')
    .on("mouseenter", function () {
      changeCursorColor("--swatch--primary-light");
      changeTextColor("var(--swatch--secondary-mid)");
    })
    .on("mouseleave", function () {
      $cursorDot.css("background-color", defaultColor);
      $cursorDot.css("color", defaultText);
    });

  $('[data-theme="red"]')
    .on("mouseenter", function () {
      changeCursorColor("--swatch--waratah-red");
      changeTextColor("var(--swatch--deep-dahlia)");
    })
    .on("mouseleave", function () {
      $cursorDot.css("background-color", defaultColor);
      $cursorDot.css("color", defaultText);
    });

  $('[data-theme="brand"]')
    .on("mouseenter", function () {
      changeCursorColor("--swatch--brand)");
      changeTextColor("var(--swatch--secondary-dark)");
    })
    .on("mouseleave", function () {
      $cursorDot.css("background-color", defaultColor);
      $cursorDot.css("color", defaultText);
    });

  $('[data-theme="emerald"]')
    .on("mouseenter", function () {
      changeCursorColor("--swatch--ammaroo-turquoise)");
      changeTextColor("var(--swatch--ammaroo-turquoise)");
    })
    .on("mouseleave", function () {
      $cursorDot.css("background-color", defaultColor);
      $cursorDot.css("color", defaultText);
    });
}
$(document).ready(function () {
  cursorColor();
});
// global text reveal
function globalReveal() {
  gsap.matchMedia().add("(min-width: 767px)", () => {
    $("[global-reveal]").each(function () {
      let reveal = $(this);
      let globalRevealLines = reveal.find(".line");

      let textPlay = gsap.timeline({
        scrollTrigger: {
          trigger: reveal,
          start: "clamp(top 80%)",
          end: "clamp(bottom 20%)",
          toggleActions: "play none play reverse",
        },
      });

      textPlay.fromTo(
        globalRevealLines,
        {
          yPercent: 100,
          clipPath: "polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%)",
        },
        {
          yPercent: 0,
          clipPath: "polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)",
          ease: "expo.out",
          duration: 2,
          stagger: { each: 0.2 },
        }
      );
    });

    $("[global-show]").each(function () {
      let show = $(this);
      let showPlay = gsap.timeline({
        scrollTrigger: {
          trigger: show,
          start: "top bottom",
          end: "top 85%",
          scrub: true,
        },
      });

      showPlay.fromTo(
        show,
        {
          opacity: 0,
        },
        {
          opacity: 1,
        }
      );
    });
  });
}

//globalScripts
function globalScript() {

  gsap.to(".jump_comp", {
    opacity: 1,
    ease: "none",
    scrollTrigger: {
      trigger: ".nav_trigger",
      start: "center -30%",
      scrub: true,
    },
  });

  gsap.matchMedia().add("(min-width: 767px)", () => {
    $(".page_main").each(function () {
      let pageMain = $(this);
      pageMain.find(".sticky_card").each(function () {
        let stickyCard = $(this);
        ScrollTrigger.create({
          trigger: stickyCard,
          start: "top top",
          endTrigger: ".sticky_end",
          end: "bottom bottom",
          pin: stickyCard[0],
          pinSpacing: false,
          scrub: true,
        });
      });
    });
    $(".page_main").each(function () {
      let pageMain2 = $(this);
      pageMain2.find(".sticky_bottom").each(function () {
        let stickyBot = $(this);
        ScrollTrigger.create({
          trigger: stickyBot,
          start: "bottom bottom",
          endTrigger: ".sticky_end",
          end: "bottom bottom",
          pin: stickyBot[0],
          pinSpacing: false,
          scrub: true,
        });
      });
    });
  });

  $(".copy_link").on("click", function () {
    const $this = $(this);
    const url = window.location.href;

    navigator.clipboard.writeText(url).then(() => {
      $this.text("Copied");
      setTimeout(() => {
        $this.text("Copy Link");
      }, 2000);

      gsap.to(this, { scale: 1.1, duration: 0.2, yoyo: true, repeat: 1 });
    });
  });

  gsap.matchMedia().add("(min-width: 767px)", () => {
    $(".reveal_section.home-reveal").each(function () {
      let swiperTrigger = $(this).find(".spacer.is-local");

      let swiperStartTl = gsap.timeline({
        scrollTrigger: {
          trigger: swiperTrigger[0],
          start: "center bottom",
          end: "center bottom",
          toggleActions: "play none none none",
        },
      });

      swiperStartTl.call(clipSwiper);
    });
  });

  function initNavScroll() {
    let lastScrollTop = 0;
    const nav = document.querySelector(".nav_component");

    function handleScroll() {
      const scrollTop =
        window.pageYOffset || document.documentElement.scrollTop;

      if (scrollTop <= 0) {
        gsap.to(nav, { yPercent: 0, duration: 0.4 });
      } else if (scrollTop > lastScrollTop) {
        gsap.to(nav, { yPercent: -100, duration: 0.4 });
      } else {
        gsap.to(nav, { yPercent: 0, duration: 0.4 });
      }

      lastScrollTop = scrollTop;
    }

    window.addEventListener("scroll", handleScroll);
  }
  initNavScroll();

  // On page load, check if the .nav_page_overlay has the .show class and remove it if so
  if ($(".nav_page_overlay").hasClass("show")) {
    $(".nav_page_overlay").removeClass("show");
  }

  $(".nav_dropdown").on("mouseenter", function () {
    $(".nav_page_overlay").addClass("show");
  });

  $(".nav_dropdown").on("mouseleave", function () {
    $(".nav_page_overlay").removeClass("show");
  });

  function updateNavComponent() {
    const navComponent = document.querySelector(".nav_component");
    const btnMainWrap = navComponent.querySelector(".btn_main_wrap");
    const menuBtn = document.querySelector(".menu_btn");
    const navLinks = navComponent.querySelectorAll("a:not(.menu_btn)");
    const originalButtonStyle = btnMainWrap
      ? btnMainWrap.getAttribute("data-button-style")
      : "";
    const originalNavTextColor =
      navComponent.getAttribute("nav-text-color") || "";
    const originalBackgroundColor =
      window.getComputedStyle(navComponent).backgroundColor;
    let isMenuOpen = false;
    ScrollTrigger.create({
      trigger: ".nav_trigger",
      start: "top top",
      end: "top top",
      toggleClass: {
        targets: navComponent,
        className: "nav-scrolled",
      },
      onEnter: () => updateStyles(true),
      onLeaveBack: () => updateStyles(false),
    });
    function updateStyles(isScrolled) {
      if (isScrolled) {
        gsap.to(navComponent, {
          duration: 0.0001,
          attr: { "nav-text-color": "brown" },
          backgroundColor: "#F5F2ED",
        });
        if (btnMainWrap) {
          btnMainWrap.setAttribute("data-button-style", "4");
        }
      } else {
        gsap.to(navComponent, {
          duration: 0.0001,
          attr: { "nav-text-color": originalNavTextColor },
          backgroundColor: originalBackgroundColor,
        });
        if (btnMainWrap) {
          btnMainWrap.setAttribute("data-button-style", originalButtonStyle);
        }
      }
    }
    $(".nav_component").hover(
      function () {
        // Store the original value in a data attribute
        const $btn = $(this).find(".btn_main_wrap");
        $btn.data("original-style", $btn.attr("data-button-style"));
        // Set data-button-style to "4" on hover
        $btn.attr("data-button-style", "4");
      },
      function () {
        // Retrieve the original value and reset it on mouseleave
        const $btn = $(this).find(".btn_main_wrap");
        $btn.attr("data-button-style", $btn.data("original-style"));
      }
    );
    $(".nav_dropdown").each(function () {
      const $dropdown = $(this);
      // Show only the first .dropdown_img_item by default within this .nav_dropdown
      $dropdown.find(".dropdown_img_item").css("opacity", 0);
      $dropdown.find(".dropdown_img_item").first().css("opacity", 1);
      // Hover event for .nav_dropdown_link_item within this .nav_dropdown
      $dropdown.find(".nav_dropdown_link_item").each(function (index) {
        $(this).hover(
          function () {
            // Reset opacity for all .dropdown_img_item within this .nav_dropdown
            $dropdown.find(".dropdown_img_item").css("opacity", 0);
            // Show the corresponding .dropdown_img_item by index
            $dropdown.find(".dropdown_img_item").eq(index).css("opacity", 1);
          },
          function () {
            // Optionally, revert to showing only the first .dropdown_img_item when hover ends
            $dropdown.find(".dropdown_img_item").css("opacity", 0);
            $dropdown.find(".dropdown_img_item").first().css("opacity", 1);
          }
        );
      });
    });
  
    $(".ev_img_bot1").appendTo(".nav_ev_imglist");
    ScrollTrigger.create({
      trigger: ".nav_trigger",
      start: "top top",
      onEnter: () => $(".menu_line").css("background-color", "white"),
      onLeaveBack: () => $(".menu_line").css("background-color", ""),
    });
    function toggleMenu() {
      isMenuOpen = !isMenuOpen;
      // Add/remove .bg_white class on .menu_line
      $(".menu_line").toggleClass("bg_white", isMenuOpen);
      if (isMenuOpen) {
        // Menu opened: set transparent nav + brown text
        navComponent.setAttribute("nav-text-color", "brown");
        gsap.to(navComponent, {
          duration: 0.3,
          backgroundColor: "transparent",
        });
      } else {
        // Menu closed: determine scroll position
        const pastTrigger =
          window.scrollY > document.querySelector(".nav_trigger").offsetTop;
        if (pastTrigger) {
          // Keep scrolled styles
          navComponent.setAttribute("nav-text-color", "brown");
          gsap.to(navComponent, {
            duration: 0.3,
            backgroundColor: "#F5F2ED",
          });
        } else {
          // Restore original styles
          navComponent.setAttribute("nav-text-color", originalNavTextColor);
          gsap.to(navComponent, {
            duration: 0.3,
            backgroundColor: originalBackgroundColor,
          });
        }
      }
    }
    menuBtn.addEventListener("click", toggleMenu);
    navLinks.forEach((link) => {
      link.addEventListener("click", () => {
        if (isMenuOpen) {
          toggleMenu();
        }
      });
    });
  }
  updateNavComponent();

  gsap.set(".cursor_dot", { xPercent: -50, yPercent: -50 });

  let cursor = Observer.create({
    onMove: (self) => {
      let mouseX = self.x;
      let mouseY = self.y;

      let velocityX = self.velocityX;

      let rotation = velocityX > 0 ? 20 : -20;

      gsap.to(".cursor_dot", {
        x: mouseX,
        y: mouseY,
        rotation: rotation,
        duration: 0.3,
        ease: "power1.out",
        onComplete: () => {
          gsap.to(".cursor_dot", { rotation: 0, duration: 0.2 });
        },
      });
    },
  });

  $(document)
    .mousedown(function () {
      $(".cursor_dot").addClass("clip_2");
    })
    .mouseup(function () {
      $(".cursor_dot").removeClass("clip_2");
    });

  $("[hover-el]").each(function (index) {
    let hoverText = $(this).attr("hover-el");
    $(this).on("mouseenter", function () {
      $(".cursor_text").text(hoverText);

      gsap.to(".cursor_dot", {
        width: "5rem",
        height: "5rem",
        ease: "power1.out",
        duration: 0.8,
      });
      gsap.to(".cursor_text_holder", {
        opacity: 1,
        ease: "power1.out",
        delay: 0.3,
        duration: 0.8,
      });
    });

    $(this).on("mouseleave", function () {
      $(".cursor_text").text("");

      gsap.to(".cursor_dot", {
        width: "1.125rem",
        height: "1.125rem",
        ease: "power1.out",
        duration: 0.8,
      });
      gsap.to(".cursor_text_holder", {
        opacity: 0,
        ease: "power1.out",
        duration: 0.8,
      });
    });
  });

  function attr(defaultVal, attrVal) {
    const defaultValType = typeof defaultVal;
    if (typeof attrVal !== "string" || attrVal.trim() === "") return defaultVal;
    if (attrVal === "true" && defaultValType === "boolean") return true;
    if (attrVal === "false" && defaultValType === "boolean") return false;
    if (isNaN(attrVal) && defaultValType === "string") return attrVal;
    if (!isNaN(attrVal) && defaultValType === "number") return +attrVal;
    return defaultVal;
  }
  // marquee component
  $("[tr-marquee-element='component']").each(function (index) {
    let componentEl = $(this),
      panelEl = componentEl.find("[tr-marquee-element='panel']"),
      speedSetting = attr(100, componentEl.attr("tr-marquee-speed")),
      verticalSetting = attr(false, componentEl.attr("tr-marquee-vertical")),
      reverseSetting = attr(false, componentEl.attr("tr-marquee-reverse")),
      moveDistanceSetting = -100;
    if (reverseSetting) moveDistanceSetting = 100;
    let marqueeTimeline = gsap.timeline({
      repeat: -1,
      onReverseComplete: () => marqueeTimeline.progress(1),
    });
    if (verticalSetting) {
      speedSetting = panelEl.first().height() / speedSetting;
      marqueeTimeline.fromTo(
        panelEl,
        { yPercent: 0 },
        {
          yPercent: moveDistanceSetting,
          ease: "none",
          duration: speedSetting,
        }
      );
    } else {
      speedSetting = panelEl.first().width() / speedSetting;
      marqueeTimeline.fromTo(
        panelEl,
        { xPercent: 0 },
        {
          xPercent: moveDistanceSetting,
          ease: "none",
          duration: speedSetting,
        }
      );
    }
  });

  $(".link_test").on("mouseenter mouseleave", function () {
    $(".link_layer").toggleClass("clipped");
  });

  function globalFooterReveal() {
    gsap.matchMedia().add("(min-width: 767px)", () => {
      $(".footer_wrapper").each(function () {
        let footerText = $(this).find(".footer_logo_text");
        let footerOverlay = $(this).find(".footer_overlay");
        let footerTextChar = footerText.find(".char");

        let footerTrigger = $(this);
        let textReveal = gsap.timeline({
          scrollTrigger: {
            trigger: footerTrigger,
            start: "top top",
            end: "bottom bottom",
            scrub: 2,
          },
        });

        textReveal.fromTo(
          footerTextChar,
          {
            yPercent: 150,
          },
          {
            duration: 1.4,
            yPercent: 0,
            stagger: 0.05,
            ease: "expo.out",
          }
        );

        let footerLighten = gsap.timeline({
          scrollTrigger: {
            trigger: footerTrigger,
            start: "top 60%",
            end: "top top",
            scrub: true,
          },
        });

        footerLighten.fromTo(
          footerOverlay,
          {
            opacity: 1,
          },
          {
            opacity: 0,
          }
        );
      });
    });
  }

  $(document).ready(function () {
    globalFooterReveal();
  });

  $("[yparallax]").each(function () {
    let yImgHolder = $(this);
    let yImg = $(this).find(".g_visual_wrap");
    let yParallax = gsap.timeline({
      scrollTrigger: {
        trigger: yImgHolder,
        start: "top bottom",
        end: "bottom top",
        scrub: true,
      },
    });

    yParallax.fromTo(
      yImgHolder,
      {
        yPercent: 20,
      },
      {
        yPercent: -20,
      }
    );
    yParallax.fromTo(
      yImg,
      {
        yPercent: -10,
      },
      {
        yPercent: 10,
      },
      "<"
    );
  });

  gsap.matchMedia().add("(min-width: 767px)", () => {
    $("[create-parallax]").each(function () {
      let createImgHolder = $(this);
      let createImg = $(this).find(".g_visual_wrap");
      let createParallax = gsap.timeline({
        scrollTrigger: {
          trigger: createImgHolder,
          start: "clamp(top bottom)",
          end: "clamp(bottom top)",
          scrub: true,
        },
      });

      createParallax.fromTo(
        createImgHolder,
        {
          yPercent: 20,
        },
        {
          yPercent: -20,
        }
      );
      createParallax.fromTo(
        createImg,
        {
          yPercent: -10,
        },
        {
          yPercent: 10,
        },
        "<"
      );
    });
  });

  $("[scroll='y-parallax']").each(function () {
    let parallaxImgWrap = $(this);
    let parallaxImg = parallaxImgWrap.find("video");
    const imgScrollTimeline = gsap.timeline({
      scrollTrigger: {
        trigger: $(this),
        start: "clamp(top bottom)",
        end: "clamp(bottom top)",
        scrub: true,
      },
    });

    imgScrollTimeline.fromTo(
      parallaxImg,
      { yPercent: 0, scale: 1.1 },
      { yPercent: 20, scale: 1.1, ease: "linear" }
    );
  });
  //curate MODAL

  $(".page_main").each(function (index) {
    let curateHeader = $(this).find("[curate-header]");
    let curateLines = curateHeader.find(".line");
    let teamLeftOpacity = $(this).find("[team-modal-opacity]");
    let popupTlCurate = gsap.timeline({ paused: true });

    popupTlCurate.set("[popup-wrapper-curate]", {
      display: "flex",
    });

    popupTlCurate.fromTo(
      ".modal_overlay.curate",
      { opacity: 0 },
      {
        opacity: 1,
        duration: 0.4,
        ease: "power3.out",
        onStart: () => $(".create_modal_right").scrollTop(0),
      }
    );

    popupTlCurate.fromTo(
      ".create_modal_right.curate",
      { xPercent: 100 },
      { xPercent: 0, duration: 0.8, ease: "power3.out" },
      "<"
    );
    popupTlCurate.fromTo(
      ".create_modal_right.curate",
      {
        clipPath:
          "polygon(100% 0%, 55% 0%, 61% 19%, 54% 45%, 62% 65%, 56% 79%, 56% 100%, 100% 100%)",
      },
      {
        clipPath:
          "polygon(100% 0%, 0% 0%, 0% 21%, 0% 40%, 0% 69%, 0% 89%, 0% 100%, 100% 100%)",
        duration: 1,
        ease: "power3.out",
      },
      "<"
    );
    popupTlCurate.fromTo(
      curateLines,
      {
        clipPath: "polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)",
      },
      {
        clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
        ease: "expo.out",
        duration: 0.8,
        stagger: { each: 0.2 },
      },
      "<"
    );

    popupTlCurate.fromTo(
      teamLeftOpacity,
      {
        opacity: 0,
      },
      {
        opacity: 1,
        duration: 0.4,
        ease: "power3.out",
      },
      "<0.2"
    );

    $("[popup-trigger-curate]").on("click", function () {
      popupTlCurate.restart();
      if (typeof lenis !== "undefined") lenis.stop();
      $("[popup-wrapper-curate]").css("display", "flex");
    });

    $(".modal_overlay.curate, [curate-close]").on("click", function () {
      // console.log("modalclose");
      // $("[cms-close]").trigger("click");
      popupTlCurate
        // .timeScale(1.5)
        .reverse()
        .eventCallback("onReverseComplete", () => {
          $("[popup-wrapper-curate]").css("display", "none");
          if (typeof lenis !== "undefined") lenis.start();
        });
    });
  });

  //CONTACT MODAL

  $(".page_main").each(function (index) {
    let contactHeader = $(this).find("[contact-header]");
    let contactLines = contactHeader.find(".line");
    let teamLeftOpacity = $(this).find("[team-modal-opacity]");
    let popupTlContact = gsap.timeline({ paused: true });

    popupTlContact.set("[popup-wrapper-contact]", {
      display: "flex",
    });

    popupTlContact.fromTo(
      ".modal_overlay.contact",
      { opacity: 0 },
      {
        opacity: 1,
        duration: 0.4,
        ease: "power3.out",
        onStart: () => $(".create_modal_right").scrollTop(0),
      }
    );

    popupTlContact.fromTo(
      ".create_modal_right.contact",
      { xPercent: 100 },
      { xPercent: 0, duration: 0.8, ease: "power3.out" },

      "<"
    );
    popupTlContact.fromTo(
      ".create_modal_right.contact",
      {
        clipPath:
          "polygon(100% 0%, 55% 0%, 61% 19%, 54% 45%, 62% 65%, 56% 79%, 56% 100%, 100% 100%)",
      },
      {
        clipPath:
          "polygon(100% 0%, 0% 0%, 0% 21%, 0% 40%, 0% 69%, 0% 89%, 0% 100%, 100% 100%)",
        duration: 1,
        ease: "power3.out",
      },
      "<"
    );
    popupTlContact.fromTo(
      contactLines,
      {
        clipPath: "polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)",
      },
      {
        clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
        ease: "expo.out",
        duration: 0.8,
        stagger: { each: 0.2 },
      },
      "<"
    );

    popupTlContact.fromTo(
      teamLeftOpacity,
      {
        opacity: 0,
      },
      {
        opacity: 1,
        duration: 1,
        ease: "power3.out",
      },
      "<0.2"
    );

    $("[popup-trigger-contact]").on("click", function () {
      popupTlContact.restart(); // Restart the timeline
      if (typeof lenis !== "undefined") lenis.stop();
      $("[popup-wrapper-contact]").css("display", "flex");
    });

    $(".modal_close.contact, .modal_overlay.contact").on("click", function () {
      popupTlContact.reverse().eventCallback("onReverseComplete", () => {
        $("[popup-wrapper-contact]").css("display", "none");
        if (typeof lenis !== "undefined") lenis.start();
      });
    });
  });

  //MENU

  // Cache jQuery selections for better performance
  const $menuBtn = $(".menu_btn");
  const $menuComp = $(".menu_comp");
  const $menuLinks = $("[menu-link] .line");
  const $menuDropdownLink = $(".menu_dropdown_link");
  const $menuBack = $(".menu_back");

  // Track menu state
  let isMenuOpen = false;

  // Initialize menu animation timeline
  function menuOpen() {
    // console.log("menu");

    // Set initial states
    gsap.set($menuComp, { display: "none" });
    gsap.set($menuLinks, { opacity: 0 });

    let menuOpenTimeline = gsap.timeline({
      paused: true,
      onStart: () => lenis.stop(),
    });

    menuOpenTimeline.set($menuComp, { display: "flex" });

    menuOpenTimeline.fromTo(
      $menuComp,
      {
        height: "0",
        opacity: 0,
      },
      {
        height: "auto",
        opacity: 1,
        ease: "expo.inOut",
        duration: 0.8,
      }
    );

    menuOpenTimeline.fromTo(
      $menuLinks,
      {
        opacity: 0,
      },
      {
        opacity: 1,
        ease: "expo.out",
        duration: 0.8,
        stagger: { each: 0.1 },
        ease: "power1.out",
      },
      "<+0.6" 
    );

    return menuOpenTimeline;
  }

  let menuOpenTimeline = menuOpen();

  // Handle menu button clicks
  $menuBtn.on("click", function () {
    // Reset dropdown state immediately
    $menuDropdownLink.removeClass("is-active");
    $menuBack.css("transform", "translateX(100%)");

    if (!isMenuOpen) {
      menuOpenTimeline.timeScale(1).play();
      isMenuOpen = true;
    } else {
      isMenuOpen = false;
      menuOpenTimeline.timeScale(2).reverse();
      // Reset immediately instead of waiting for animation
      gsap.set($menuComp, { display: "none" });
      gsap.set($menuLinks, { opacity: 0 });
      lenis.start();
    }
  });

  // Handle dropdown menu interactions
  $menuDropdownLink.on("click", function () {
    $(this).addClass("is-active");
    $menuBack.css(
      "transform",
      $(this).hasClass("is-active") ? "translateX(0%)" : "translateX(100%)"
    );
  });

  // Handle back button in dropdown
  $(".menu_back_holder").on("click", function () {
    $menuDropdownLink.removeClass("is-active");
    $menuBack.css("transform", "translateX(100%)");
  });

  //CHECKBOX
  function observeCheckbox(checkbox) {
    const observer = new MutationObserver(function (mutations) {
      mutations.forEach(function (mutation) {
        if ($(checkbox).hasClass("w--redirected-checked")) {
          $(checkbox).closest(".checkbox_holder").addClass("is-active");
        } else {
          $(checkbox).closest(".checkbox_holder").removeClass("is-active");
        }
      });
    });

    observer.observe(checkbox, {
      attributes: true,
      attributeFilter: ["class"],
    });
  }
  $(".curate_checkbox").each(function () {
    observeCheckbox(this);
  });

  let seenTexts = {};

  $("[popup-component]").each(function (index) {
    let popupEl = $(this).find("[popup-wrapper]");
    let popupTrig = $(this).find("[popup-trigger]");
    let popupBg = $(this).find(".team_overlay");
    let popupClose = $(this).find(".modal_close_team");
    let popupContent = $(this).find(".team_hero_right");
    let popupLeft = $(this).find(".team_hero_left");
    let teamLeftOpacity = $(this).find("[team-modal-opacity]");
    let teamHeader = $(this).find("[team-header]");
    let teamHeaderLines = teamHeader.find(".line");
    let popupTl = gsap.timeline({ paused: true });
    popupTl.set(popupEl, {
      display: "flex",
    });

    popupTl.fromTo(
      popupBg,
      {
        opacity: 0,
      },
      {
        opacity: 1,
        duration: 0.4,
        ease: "power3.out",
        onStart: () => $(".team_modal_right").scrollTop(0),
      }
    );
    popupTl.fromTo(
      popupContent,
      {
        xPercent: 100,
      },
      {
        xPercent: 0,
        duration: 0.8,
        ease: "power3.out",
      },
      "<"
    );

    popupTl.fromTo(
      popupContent,
      {
        clipPath:
          "polygon(100% 0%, 55% 0%, 61% 19%, 54% 45%, 62% 65%, 56% 79%, 56% 100%, 100% 100%)",
      },
      {
        clipPath:
          "polygon(100% 0%, 0% 0%, 0% 21%, 0% 40%, 0% 69%, 0% 89%, 0% 100%, 100% 100%)",
        duration: 0.8,
        ease: "power3.out",
      },
      "<"
    );
    popupTl.fromTo(
      popupLeft,
      {
        xPercent: 60,
        clipPath: "polygon(100% 0%, 100% 100%, 100% 100%, 100% 0%)",
      },
      {
        xPercent: 0,
        clipPath: "polygon(0% 0%, 0% 100%, 100% 100%, 100% 0%)",
        duration: 1,
        ease: "power3.out",
      },
      "<+0.3"
    );

    popupTl.fromTo(
      teamLeftOpacity,
      {
        opacity: 0,
      },
      {
        opacity: 1,
        duration: 1,
        ease: "power3.out",
      },
      "<+0.2"
    );

    popupTrig.on("click", function () {
      popupTl.play();
      lenis.stop();
    });

    popupClose.on("click", function () {
      popupTl.timeScale(2).reverse();
      lenis.start();
    });

    popupBg.on("click", function () {
      popupTl.timeScale(2).reverse();
      lenis.start();
    });
  });
  // gsap.matchMedia().add("(min-width: 767px)", () => {
  $(".nav_component").each(function () {
    let originalBgColor = $(this).css("backgroundColor");

    gsap.set($(this), { backgroundColor: "transparent" });

    let navBgChange = gsap.timeline({
      scrollTrigger: {
        trigger: ".nav_trigger",
        start: "top top",
        end: "top top",
        scrub: true,
      },
    });

    navBgChange.fromTo(
      $(this),
      { backgroundColor: "transparent" },
      {
        backgroundColor: originalBgColor,
        duration: 1,
        ease: "power2.out",
      }
    );
  });
  // });
  gsap.matchMedia().add("(max-width: 766px)", () => {
    $(".nav_component").each(function () {
      let menuLine = $(this).css("backgroundColor");

      gsap.set($(this), { backgroundColor: "transparent" });

      let menuBgChange = gsap.timeline({
        scrollTrigger: {
          trigger: ".nav_trigger",
          start: "top top",
          end: "top top",
          scrub: true,
        },
      });

      menuBgChange.fromTo(
        $(this),
        { backgroundColor: "transparent" },
        {
          backgroundColor: "#FFF",
          duration: 1,
          ease: "power2.out",
        }
      );
    });
  });

  $("[popup-component]").each(function (index) {
    let popupEl = $(this).find("[popup-wrapper]");
    let popupTrig = $(this).find("[popup-trigger]");
    let popupBg = $(this).find(".modal_overlay");
    let popupClose = $(this).find(".modal_close, [curate-close]");
    let popupContent = $(this).find(".create_modal_right");
    let teamLeftOpacity = $(this).find("[modal-opacity]");
    let modalHeader = $(this).find("[modal-header]");
    let modalHeroImg = $(this).find(".mhero_img_holder");
    let modalHeaderLines = modalHeader.find(".line");
    let popupTl = gsap.timeline({ paused: true });
    popupTl.fromTo(
      popupEl,
      {
        display: "none",
      },
      {
        display: "flex",
      }
    );

    popupTl.fromTo(
      popupBg,
      {
        opacity: 0,
      },
      {
        opacity: 1,
        duration: 0.4,
        ease: "power3.out",
        onStart: () => $(".create_modal_right").scrollTop(0),
      }
    );
    popupTl.fromTo(
      popupContent,
      {
        xPercent: 100,
      },
      {
        xPercent: 0,
        duration: 1,
        ease: "power3.out",
      },
      "<"
    );

    popupTl.fromTo(
      popupContent,
      {
        clipPath:
          "polygon(100% 0%, 55% 0%, 61% 19%, 54% 45%, 62% 65%, 56% 79%, 56% 100%, 100% 100%)",
      },
      {
        clipPath:
          "polygon(100% 0%, 0% 0%, 0% 21%, 0% 40%, 0% 69%, 0% 89%, 0% 100%, 100% 100%)",
        duration: 1,
        ease: "power3.out",
      },
      "<"
    );

    popupTl.fromTo(
      modalHeaderLines,
      {
        clipPath: "polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)",
      },
      {
        clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
        ease: "expo.out",
        duration: 1,
        stagger: { each: 0.2 },
      },
      "<"
    );
    popupTl.fromTo(
      modalHeroImg,
      {
        clipPath: "polygon(100% 0%, 100% 0%, 0% 0%, 0% 0%)",
      },
      {
        clipPath: "polygon(100% 100%, 100% 0%, 0% 0%, 0% 100%)",
        duration: 1.2,
        ease: "power3.out",
      },
      "<"
    );
    popupTl.fromTo(
      teamLeftOpacity,
      {
        opacity: 0,
      },
      {
        opacity: 1,
        duration: 1,
        ease: "power3.out",
      },
      "<+0.8"
    );

    popupTrig.on("click", function () {
      popupTl.play();
      lenis.stop();
    });

    popupClose.on("click", function () {
      popupTl.reverse();
      lenis.start();
    });

    popupBg.on("click", function () {
      popupTl.reverse();
      lenis.start();
    });

    $("[curate-close]").on("click", function () {
      $("[popup-wrapper]").css("display", "none");
      popupTl.reverse(1.5);
    });
  });

  //journal item modal
  function normalizeText(text) {
    return text
      .trim()
      .toLowerCase()
      .replace(/\s+/g, " ")
      .replace(/[^\w\s]/g, "");
  }

  function findBestMatch(clickedText, modalHeaders) {
    const normalizedClicked = normalizeText(clickedText);

    for (let i = 0; i < modalHeaders.length; i++) {
      const normalizedHeader = normalizeText(modalHeaders[i].text);
      if (normalizedHeader === normalizedClicked) {
        return modalHeaders[i];
      }
    }

    for (let i = 0; i < modalHeaders.length; i++) {
      const normalizedHeader = normalizeText(modalHeaders[i].text);
      if (normalizedHeader.endsWith(normalizedClicked)) {
        // console.log(
        //   `Found suffix match: "${normalizedHeader}" ends with "${normalizedClicked}"`
        // );
        return modalHeaders[i];
      }
    }

    for (let i = 0; i < modalHeaders.length; i++) {
      const normalizedHeader = normalizeText(modalHeaders[i].text);
      if (normalizedHeader.includes(normalizedClicked)) {
        // console.log(
        //   `Found partial match: "${normalizedHeader}" contains "${normalizedClicked}"`
        // );
        return modalHeaders[i];
      }
    }

    return null;
  }

  function normalizeText(text) {
    return text
      .trim()
      .toLowerCase()
      .replace(/\s+/g, " ") 
      .replace(/[^\w\s]/g, "");
  }

  function findBestMatch(clickedText, modalHeaders) {
    const normalizedClicked = normalizeText(clickedText);

    // First try exact match after normalization
    for (let i = 0; i < modalHeaders.length; i++) {
      const normalizedHeader = normalizeText(modalHeaders[i].text);
      if (normalizedHeader === normalizedClicked) {
        return modalHeaders[i];
      }
    }

    // If no exact match, try suffix matching (header ends with clicked text)
    for (let i = 0; i < modalHeaders.length; i++) {
      const normalizedHeader = normalizeText(modalHeaders[i].text);
      if (normalizedHeader.endsWith(normalizedClicked)) {
        // console.log(
        //   `Found suffix match: "${normalizedHeader}" ends with "${normalizedClicked}"`
        // );
        return modalHeaders[i];
      }
    }

    // If no suffix match, try partial matching (clicked text is contained in header)
    for (let i = 0; i < modalHeaders.length; i++) {
      const normalizedHeader = normalizeText(modalHeaders[i].text);
      if (normalizedHeader.includes(normalizedClicked)) {
        // console.log(
        //   `Found partial match: "${normalizedHeader}" contains "${normalizedClicked}"`
        // );
        return modalHeaders[i];
      }
    }

    return null;
  }

  function triggerModal(clickedText) {
    // console.log("Triggering modal for:", clickedText);
    // console.log("Clicked text length:", clickedText.length);

    // Enhanced debugging
    // console.log("Raw clicked text:", JSON.stringify(clickedText));
    // console.log(
    //   "Normalized clicked text:",
    //   JSON.stringify(normalizeText(clickedText))
    // );

    $(".create_modal_wrapper").css("display", "flex");

    let found = false;

    // Collect all modal headers first
    const modalHeaders = [];
    $(".create_modal_item").each(function () {
      const $popup = $(this);
      const headerText = $popup.find("[modal-header]").text().trim();
      modalHeaders.push({
        text: headerText,
        element: $popup,
      });
    });

    // Find the best match using flexible matching
    const matchedModal = findBestMatch(clickedText, modalHeaders);

    if (matchedModal) {
      const $popup = matchedModal.element;
      // console.log("Match found. Opening modal.");
      // console.log("Matched header:", JSON.stringify(matchedModal.text));

      $popup.css("display", "flex");

      let modalBg = $popup.find(".modal_overlay");
      let modalClose = $popup.find(".modal_close, [curate-close]");
      let modalContent = $popup.find(".create_modal_right");
      let modalOpacity = $popup.find("[modal-opacity]");
      let modalHeader = $popup.find("[modal-header]");
      let modalHeaderLines = modalHeader.find(".line");
      let modalImg = $popup.find(".mhero_img_holder");

      const tl = gsap.timeline();

      tl.fromTo(modalBg, { opacity: 0 }, { opacity: 1, duration: 0.4 })
        .fromTo(
          modalContent,
          { xPercent: 100 },
          {
            xPercent: 0,
            duration: 1.5,
            ease: "power3.out",
          },
          "<"
        )
        .fromTo(
          modalContent,
          {
            clipPath:
              "polygon(100% 0%, 55% 0%, 61% 19%, 54% 45%, 62% 65%, 56% 79%, 56% 100%, 100% 100%)",
          },
          {
            clipPath:
              "polygon(100% 0%, 0% 0%, 0% 21%, 0% 40%, 0% 69%, 0% 89%, 0% 100%, 100% 100%)",
            duration: 1.6,
            ease: "power3.out",
          },
          "<"
        )
        .fromTo(
          modalHeaderLines,
          {
            clipPath: "polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)",
          },
          {
            clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
            ease: "expo.out",
            duration: 1.6,
            stagger: { each: 0.2 },
          },
          "<"
        )
        .fromTo(
          modalImg,
          {
            clipPath: "polygon(100% 0%, 100% 0%, 0% 0%, 0% 0%)",
          },
          {
            clipPath: "polygon(100% 100%, 100% 0%, 0% 0%, 0% 100%)",
            duration: 2.5,
            ease: "power3.out",
          },
          "<0.3"
        )
        .fromTo(
          modalOpacity,
          { opacity: 0 },
          {
            opacity: 1,
            duration: 1.6,
            ease: "power3.out",
          },
          "<+0.8"
        );

      found = true;

      // Remove any existing event listeners to prevent multiple bindings
      modalClose.off("click.modalTrigger");
      modalBg.off("click.modalTrigger");

      modalClose.on("click.modalTrigger", function () {
        tl.reverse();
        if (typeof lenis !== "undefined") {
          lenis.start();
        }
        tl.eventCallback("onReverseComplete", () => {
          $popup.css("display", "none");
          $(".create_modal_wrapper").css("display", "none");
        });
      });

      modalBg.on("click.modalTrigger", function () {
        tl.reverse();
        tl.eventCallback("onReverseComplete", () => {
          $popup.css("display", "none");
          $(".create_modal_wrapper").css("display", "none");
        });
      });
    }

    if (!found) {
      // console.warn("No matching modal found for:", clickedText);
      // console.warn("Available modal headers:");
      modalHeaders.forEach((header, index) => {
        // console.warn(`${index + 1}. Raw:`, JSON.stringify(header.text));
        // console.warn(
        //   `${index + 1}. Normalized:`,
        //   JSON.stringify(normalizeText(header.text))
        // );
      });
      $(".create_modal_wrapper").css("display", "none");
    }
  }

  // Remove any existing event listeners and add new ones
  $(".journal_rich a")
    .off("click.modalTrigger")
    .on("click.modalTrigger", function (e) {
      e.preventDefault();
      if (typeof lenis !== "undefined") {
        lenis.stop();
      }
      const clickedText = $(this).text().trim();
      // console.log("Journal rich link clicked text:", clickedText);
      triggerModal(clickedText);
    });

  $(".journal_banner")
    .off("click.modalTrigger")
    .on("click.modalTrigger", function () {
      if (typeof lenis !== "undefined") {
        lenis.stop();
      }
      const $bannerHeadingEl = $(this).find("[banner-heading]");
      const clickedText = $bannerHeadingEl.text().trim() || "";
      // console.log("Journal banner clicked text:", clickedText);

      if (clickedText) {
        triggerModal(clickedText);
      } else {
        // console.warn("No banner-heading text found or it's empty");
        // console.warn("Banner element:", this);
        // console.warn("Banner heading element:", $bannerHeadingEl[0]);
      }
    });

  // Optional: Add a function to refresh modal bindings if CMS content is dynamically loaded
  function refreshModalBindings() {
    // console.log("Refreshing modal bindings...");

    // Re-bind events
    $(".journal_rich a")
      .off("click.modalTrigger")
      .on("click.modalTrigger", function (e) {
        e.preventDefault();
        if (typeof lenis !== "undefined") {
          lenis.stop();
        }
        const clickedText = $(this).text().trim();
        // console.log("Journal rich link clicked text:", clickedText);
        triggerModal(clickedText);
      });

    $(".journal_banner")
      .off("click.modalTrigger")
      .on("click.modalTrigger", function () {
        if (typeof lenis !== "undefined") {
          lenis.stop();
        }
        const $bannerHeadingEl = $(this).find("[banner-heading]");
        const clickedText = $bannerHeadingEl.text().trim() || "";
        // console.log("Journal banner clicked text:", clickedText);

        if (clickedText) {
          triggerModal(clickedText);
        } else {
          // console.warn("No banner-heading text found or it's empty");
        }
      });

    // console.log("Modal bindings refreshed.");
  }

  $(".menu_btn").on("click", function () {
    $(this).toggleClass("is-active");
  });

  $("form").each(function () {
    $(this)
      .find("[id]")
      .each(function (index) {
        var originalId = $(this).attr("id");
        var newId = originalId + "-" + index; // Append index to create a unique ID
        $(this).attr("id", newId);
      });
  });

  $("[global-show-late]").each(function () {
    let showLate = $(this);

    let showPlayLate = gsap.timeline({
      delay: 0.8,
    });

    showPlayLate.fromTo(
      showLate,
      {
        opacity: 0,
      },
      {
        opacity: 1,
        duration: 0.8,
        ease: "power2.out",
      }
    );
  });

  $("[bio-clip]").each(function () {
    let bioOpacity = $(this);

    gsap.to(bioOpacity, {
      opacity: 1,
      duration: 0.8,
      delay: 0.1,
      ease: "power2.out",
    });

    let bioClip = $(this);

    gsap.fromTo(
      bioClip,
      {
        clipPath:
          "polygon(0% 50%, 11% 50%, 22% 50%, 33% 50%, 44% 50%, 55% 50%, 66% 50%, 77% 50%, 88% 50%, 100% 50%)",
      },
      {
        clipPath:
          "polygon(0% 0%, 0.5% 41%, 0% 100%, 72% 99%, 100% 100%, 99% 80%, 99% 0%, 85% 0%, 70% 1%, 16% 0%)",
        duration: 1.4,
        ease: "expo.out",
      }
    );
  });

}

globalScript();

function globalContactScript() {

  gsap.to(".nav_link_holder.global", { opacity: 1, duration: 0.5 });
  // console.log("globalcontact");
  $("#AFRICA-2-0").prop("checked", true);
  setTimeout(() => {
    $(".toggle_wrapper_text").text("AFRICA");
  }, 320);
  $(".toggle_wrapper2").css("transform", "translateX(0%)");

  $("#AFRICA-2-0").change(function () {
    if ($(this).is(":checked")) {
      setTimeout(() => {
        $(".toggle_wrapper_text").text("AFRICA");
      }, 320);
      $(".toggle_wrapper2").css("transform", "translateX(0%)");
    }
  });
  $("#AUS-2-1").change(function () {
    if ($(this).is(":checked")) {
      setTimeout(() => {
        $(".toggle_wrapper_text").text("AUSTRALIA");
      }, 320);
      $(".toggle_wrapper2").css("transform", "translateX(100%)");
    }
  });
  $(document).ready(function () {
    $(".contact_content.sa").css("display", "grid");
    $(".contact_content.aus").css("display", "grid");

    const animDuration = 0.5;

    gsap.set(".contact_content.sa", { yPercent: 0 });

    $('.price_toggle_holder input[type="radio"]').on("change", function () {
      const radioIndex = $(this).parent().index();
      if (radioIndex === 0) {
        gsap.to(".contact_content.sa", {
          yPercent: 0,
          opacity: 1,
          pointerEvents: "auto",
          duration: animDuration,
          ease: "power1.out",
        });
        gsap.to(".contact_content.aus", {
          yPercent: 0,
          opacity: 0,
          pointerEvents: "none",
          duration: animDuration,
          ease: "power1.out",
        });
      } else if (radioIndex === 1) {
        gsap.to(".contact_content.sa", {
          yPercent: 0,
          opacity: 0,
          pointerEvents: "none",
          duration: animDuration,
          ease: "power1.out",
        });
        gsap.to(".contact_content.aus", {
          yPercent: 0,
          opacity: 1,
          pointerEvents: "auto",
          duration: animDuration,
          ease: "power1.out",
        });
      }
    });
  });
}

function homeScripts() {
  $(".local_hero_wrap").each(function () {
    let homeHero = $(this);
    let homePinEl = homeHero.find(".hero_visual_wrap.local");
    let homeHeroTrigger = homeHero.find(".local_hero_spacer");
    let heroMid = homeHero.find(".hero_mid");
    ScrollTrigger.create({
      trigger: homeHeroTrigger,
      start: "top top",
      end: "bottom top",
      pin: homePinEl,
      pinSpacing: false,
      scrub: true,
    });

    let localHeroOverlay = document.querySelector(".hero_overlay.home");
    let localOverlayPlay = gsap.timeline({
      scrollTrigger: {
        trigger: ".local_hero_spacer",
        start: "top top",
        end: "bottom top",
        scrub: true,
      },
    });

    localOverlayPlay.fromTo(
      localHeroOverlay,
      {
        opacity: 0,
      },
      {
        opacity: 1,
      }
    );
  });

  let heroTrigger = document.querySelector(".hero_visual_wrap.local");
  let heroOverlay = document.querySelector(".hero_overlay.home");
  let heroParallax = gsap.timeline({
    scrollTrigger: {
      trigger: heroTrigger,
      start: "top top",
      end: "bottom top",
      scrub: true,
    },
  });

  heroParallax.fromTo(
    heroTrigger,
    {
      yPercent: 0,
    },
    {
      yPercent: 10,
    }
  );
  heroParallax.fromTo(
    heroOverlay,
    {
      opacity: 0,
    },
    {
      opacity: 1,
    },
    "<"
  );

  let heroBottom = gsap.timeline({
    scrollTrigger: {
      trigger: ".hero_bottom",
      start: "top center",
      endTrigger: ".section_1",
      end: "top top",
      scrub: true,
    },
  });

  heroBottom.fromTo(
    ".hero_bottom",
    {
      yPercent: 0,
    },
    {
      yPercent: 30,
    }
  );

  let heroPathLocal = gsap.timeline({
    scrollTrigger: {
      trigger: ".hero_bottom",
      start: "top bottom",
      end: "bottom bottom",
      scrub: 2,
    },
  });

  heroPathLocal.to(".hero_path", {
    opacity: 1,
    duration: 0.01,
  });

  heroPathLocal.fromTo(
    ".hero_bottom path",
    {
      drawSVG: "0% 0%",
    },
    {
      drawSVG: "100% 0%",
      duration: 1.5,
      ease: "expo.Out",
    }
  );

  let heroPath = gsap.timeline({
    scrollTrigger: {
      trigger: ".hero_bottom",
      start: "top 80%",
      end: "top 80%",
      toggleActions: "play none reverse none",
      duration: 1.5,
    },
  });

  heroPath.fromTo(
    ".svg_logo",
    {
      opacity: 0,
    },
    {
      opacity: 1,
    }
  );

  $("[local-copy]").each(function () {
    let categoryReveal = $(this);

    let textPlay = gsap.timeline({
      scrollTrigger: {
        trigger: ".hero_bottom",
        start: "top 80%",
        end: "top 80%",
        toggleActions: "play none reverse none",
      },
    });

    textPlay.fromTo(
      categoryReveal,
      {
        opacity: 0,
      },
      {
        opacity: 1,
        ease: "expo.out",
        duration: 1,
      }
    );
  });

  gsap.matchMedia().add("(min-width: 767px)", () => {
    $(".local_sticky_svg_holder").each(function () {
      let maskImgHolder = $(this);
      let stickyMaskPlay = gsap.timeline({
        scrollTrigger: {
          trigger: this,
          start: "top 70%",
          end: "end 70%",
          scrub: 2,
        },
      });

      stickyMaskPlay.fromTo(
        maskImgHolder,
        {
          clipPath: "polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)",
        },
        {
          clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
        }
      );
    });

    $(".local_marquee_img_holder").each(function () {
      let stickyImgScale = $(this);

      let imgScale = gsap.timeline({
        scrollTrigger: {
          trigger: stickyImgScale,
          start: "top bottom",
          end: "top 80%",
          scrub: 2,
        },
      });

      imgScale.fromTo(
        stickyImgScale,
        {
          scale: 0.9,
        },
        {
          scale: 1,
        }
      );
    });

    const overlays = gsap.utils.toArray(".sticky_card_overlay");

    overlays.forEach((overlay) => {
      gsap.fromTo(
        overlay,
        { opacity: 0 },
        {
          opacity: 1,
          scrollTrigger: {
            trigger: overlay,
            start: "bottom bottom",
            end: "bottom top",
            scrub: true,
          },
        }
      );
    });

    $(".local_sticky_card").each(function () {
      let stickyCard = $(this);

      gsap.to(stickyCard, {
        scrollTrigger: {
          trigger: stickyCard,
          start: "top top",
          endTrigger: ".reveal_section",
          end: "top top",
          pin: true,
          pinSpacing: false,
          scrub: true,
        },
      });
    });

    const stickyCards = document.querySelectorAll(".local_sticky_card_holder");

    stickyCards.forEach((card) => {
      const marqueePanel = card.querySelector(".marquee_panel_main");

      if (!marqueePanel) return;

      ScrollTrigger.create({
        trigger: card,
        start: "top bottom",
        end: "bottom 40%",
        scrub: 1,

        onUpdate: (self) => {
          gsap.to(marqueePanel, {
            y: `${self.progress * -60}vh`,
            duration: 0.5,
            ease: "power1.out",
          });
        },
      });
    });
  });
}

function caseStudiesScripts() {
  $(".cs_filter_btn").on("click", function () {
    const filterText = $(this).text().trim().toLowerCase();

    $(".cs_filter_btn").removeClass("is-active");
    $(this).addClass("is-active");

    $(".cs_item").each(function () {
      const tagText = $(this).find("[cs-tag]").text().trim().toLowerCase();
      if (filterText === "all" || tagText === filterText) {
        $(this).show();
      } else {
        $(this).hide();
      }
    });
    ScrollTrigger.refresh();
  });

}

function globalHomeScripts() {
  function initializeCountryCardAnimations() {
    function animateCard(card) {
      logoExpand(card);
      breakUpText(card);
      breakDownText(card);
    }

    function countryCardParallax() {
      $(".country_card").each(function () {
        let ccParallax = gsap.timeline({
          scrollTrigger: {
            trigger: $(this),
            start: "top bottom",
            end: "bottom top",
            scrub: true,
          },
        });
        ccParallax.fromTo(
          $(this).find(".country_card_parallax"),
          {
            yPercent: -20,
          },
          {
            yPercent: 0,
          }
        );
      });
    }
    function countryContentParallax() {
      $(".country_card").each(function () {
        let cconParallax = gsap.timeline({
          scrollTrigger: {
            trigger: $(this),
            start: "top bottom",
            end: "bottom top",
            scrub: true,
          },
        });
        cconParallax.fromTo(
          $(this).find(".country_card_content"),
          {
            yPercent: 0,
          },
          {
            yPercent: -20,
          }
        );
      });
    }
    function logoExpand(card) {
      let logoHolder = $(card).find(".countrycard_image_holder");
      gsap.timeline().fromTo(
        logoHolder,
        {
          scale: 0,
        },
        {
          scale: 0.8,
          duration: 2.5,
          ease: "power3.out",
        }
      );
    }

    function breakUpText(card) {
      let chars = $(card).find("[split-up] .char");
      gsap.timeline().to(
        chars,
        {
          yPercent: -240,
          stagger: {
            each: 0.04,
            from: "center",
          },
          ease: "power3.out",
          duration: 2,
        },
        "<"
      );
    }

    function breakDownText(card) {
      let chars = $(card).find("[split-down] .char");
      gsap.timeline().to(
        chars,
        {
          yPercent: 240,
          stagger: {
            each: 0.04,
            from: "center",
          },
          ease: "power3.out",
          duration: 2,
        },
        "<"
      );
    }

    $(".country_card").each(function () {
      let card = this;
      ScrollTrigger.create({
        trigger: $(card),
        start: "center 80%",
        onEnter: () => animateCard(card),
        once: true,
      });
    });

    countryCardParallax();
    countryContentParallax();

    $(".country_card").each(function () {
      let ccLine = gsap.timeline({
        scrollTrigger: {
          trigger: this,
          start: "top center",
          toggleActions: "play none none none",
        },
      });
      gsap.matchMedia().add("(min-width: 992px)", () => {
      ccLine.fromTo(
        $(this).find(".country_card_line"),
        {
          height: "0rem",
        },
        {
          height: "4rem",
          duration: 0.6,
          ease: "power1.out",
        }
      );
    });
   
      ccLine.to(
        $(this).find(".country_card_bottom .btn_main_wrap"),
        {
          opacity: 1,
          duration: 0.6,
          ease: "power1.out",
        },
        "<"
      );
    });

    $(".country_card").each(function () {
      let ccBot = gsap.timeline({
        scrollTrigger: {
          trigger: this,
          start: "top 200%",
          end: "top center",
          scrub: true,
        },
      });
      ccBot.fromTo(
        $(this).find(".country_card_bottom"),
        {
          yPercent: 100,
        },
        {
          yPercent: 10,
          duration: 0.6,
          ease: "power3.out",
        }
      );
    });
  }
  initializeCountryCardAnimations();
}

function journalScripts() {
  let journalItem = $("[data-guides]").find(".journal_item");
  journalItem.hide();
  journalItem.slice(0, 8).show();
  $("[data-load-more-guides]").click(function () {
    var hiddenItems = $("[data-guides]")
      .find(".journal_item:hidden")
      .slice(0, 4);
    hiddenItems.show();
    if ($("[data-guides]").find(".journal_item:hidden").length == 0) {
      $(this).hide();
    }
  });

  let journalItem2 = $("[data-journals]").find(".journal_item");
  journalItem2.hide();
  journalItem2.slice(0, 6).show();
  $("[data-load-more-journals]").click(function () {
    var hiddenItems = $("[data-journals]")
      .find(".journal_item:hidden")
      .slice(0, 3);
    hiddenItems.show();
    if ($("[data-journals]").find(".journal_item:hidden").length == 0) {
      $(this).hide();
    }
  });
}

function aboutScript() {
  lenis.start();
  gsap.to(".toggle", { opacity: 1, duration: 0.5 });
  gsap.to(".nav_link_holder.global", { opacity: 1, duration: 0.5 });

  $(".page_main").each(function () {
    let abouthero = $(this);
    let aboutTrigger = $(this).find(".about_hero_spacer");
    let sectionInset = $(this).find(".section_inset");
    let aboutVidHolder = $(this).find(".about_vid_holder");
    let aboutOverlay = $(this).find(".about_vid_overlay");

    let aboutClipImg = gsap.timeline({
      scrollTrigger: {
        trigger: aboutTrigger,
        start: "top bottom",
        end: "bottom bottom",
        scrub: true,
      },
    });

    aboutClipImg.to(aboutVidHolder, {
      clipPath:
        "polygon(0% 0%, 0% 30%, 0% 38%, 0% 48%, 0% 58%, 0% 78%, 0% 100%, 44% 100%, 100% 100%, 100% 52%, 100% 0%, 51% 0%)",
    });

    let aboutMove = gsap.timeline({
      scrollTrigger: {
        trigger: sectionInset,
        start: "top 80%",
        end: "top top",
        scrub: true,
      },
    });

    aboutMove.to(aboutVidHolder, {
      yPercent: 0,
    });

    let aboutDarken = gsap.timeline({
      scrollTrigger: {
        trigger: sectionInset,
        start: "top 80%",
        end: "bottom top",
        scrub: true,
      },
    });
    aboutDarken.fromTo(
      aboutOverlay,
      {
        opacity: 0,
      },
      {
        opacity: 1,
      }
    );
  });

  $(".about_slider_section").each(function (index) {
    let swiperEl = $(this).find(".swiper.is_about");
    let swiperNext = $(this).find(".about-next");
    let swiperPrev = $(this).find(".about-prev");
    let aboutSwiper = new Swiper(swiperEl[0], {
      autoplay: {
        delay: 800,
        disableOnInteraction: false,
      },
      freeMode: false,
      // slidesPerView: 3.5,
      speed: 1000,
      spaceBetween: 40,
      centeredSlides: true,
      loop: true,
      slideActiveClass: "is-active",
      breakpoints: {
        // when window width is >= 320px
        320: {
          slidesPerView: 2.5,
          spaceBetween: 20,
        },
        // when window width is >= 480px
        480: {
          slidesPerView: 2.5,
          spaceBetween: 30,
        },
        // when window width is >= 640px
        640: {
          slidesPerView: 3.5,
          spaceBetween: 40,
        },
      },
      navigation: {
        nextEl: swiperNext[0],
        prevEl: swiperPrev[0],
      },
    });
  });
}

function aboutTeamStack() {
  $(".team_flip_section").each(function () {
    let teamSection = $(this);
    let teamCard = $(this).find(".team_flipped_item");

    let teamStack = gsap.timeline({
      scrollTrigger: {
        trigger: teamCard,
        start: "top bottom",
        end: "top bottom",
        toggleActions: "play none reverse none",
      },
    });

    teamStack.fromTo(
      teamCard,
      {
        opacity: 0,
        yPercent: 30,
      },
      {
        opacity: 1,
        yPercent: 0,
        ease: "power3.out",
        duration: 1.5,
        stagger: { each: 0.1 },
        clearProps: "all",
      }
    );
  });
}

function statsSection() {
  $(".meaning_section").each(function () {
    let meaningEl = $(this);
    let aboutStatImg = meaningEl.find(".meaning_img_holder");
    let meaningStats = meaningEl.find(".stats_wrap");
    let statLine = meaningEl.find(".stats_line");

    gsap.matchMedia().add("(min-width: 767px)", () => {
      let aboutStatClip = gsap.timeline({
        scrollTrigger: {
          trigger: meaningEl,
          start: "top bottom",
          endTrigger: meaningStats,
          end: "top 10%",
          scrub: true,
        },
      });

      aboutStatClip.fromTo(
        aboutStatImg,
        {
          clipPath:
            "polygon(32% 25%, 25% 32%, 15% 40%, 27% 56%, 20% 84%, 47% 85%, 75% 84%, 79% 62%, 75% 13%, 72% 25%, 63% 18%, 45% 35%)",
        },
        {
          clipPath:
            "polygon(0% 0%, 0% 29%, 0% 49%, 0% 73%, 0% 100%, 47% 100%, 100% 100%, 100% 63%, 100% 0%, 76% 0%, 50% 0%, 23% 0%)",
        }
      );
    });

    gsap.utils.toArray(".stat_final").forEach((stat) => {
      const finalNumber = parseFloat(stat.textContent.replace(/,/g, ""));

      gsap.fromTo(
        stat,
        { innerText: 0 },
        {
          innerText: finalNumber,
          duration: 1,
          ease: "power1.out",
          scrollTrigger: {
            trigger: stat,
            scrub: true,
            start: "top bottom",
            endTrigger: ".stats_wrap",
            end: "top 10%",
            onUpdate: (self) => {
              let currentNumber = self.progress * finalNumber;
              if (finalNumber % 1 !== 0) {
                stat.innerText = currentNumber.toFixed(1).toLocaleString();
              } else {
                stat.innerText = Math.floor(currentNumber).toLocaleString();
              }
            },
          },
        }
      );

      let statLinePlay = gsap.timeline({
        scrollTrigger: {
          trigger: statLine,
          start: "top bottom",
          endTrigger: ".stats_wrap",
          end: "top 10%",
          scrub: true,
        },
      });

      statLinePlay.fromTo(
        statLine,
        {
          width: "0%",
        },
        {
          width: "100%",
        }
      );
    });
  });

  $(".approach_img_holder").each(function () {
    let approachImg = $(this);
    let approachImgPlay = gsap.timeline({
      scrollTrigger: {
        trigger: ".approachimg_wrap",
        start: "top bottom",
        end: "bottom top",
        scrub: true,
      },
    });

    approachImgPlay.fromTo(
      approachImg,
      {
        yPercent: -20,
      },
      {
        yPercent: 0,
      }
    );
  });
}

function categoryScript() {
  if ($(".turnkey_list").children().length > 6) {
    $(".btn-trig").show();
  } else {
    $(".btn-trig").hide();
  }

  $(".location_card").hover(
    function () {
      $(this).find(".btn_main_wrap").addClass("location-hover");
    },
    function () {
      $(this).find(".btn_main_wrap").removeClass("location-hover");
    }
  );
  $(".location_card").on("mouseenter mouseleave", function () {
    $(this).toggleClass("is-active");
    $(this)
      .find(".btn_main_wrap")
      .attr("data-button-style", function (_, attr) {
        return attr === "3" ? null : "3";
      });
  });
  $(".page_main").each(function (index) {
    let discoverSwiperNext = $(this).find(".discover_next");
    let discoverSwiperPrev = $(this).find(".discover_prev");
    let discoverSwiperEl = $(this).find(".swiper.discover");
    let discoverSwiper = new Swiper(discoverSwiperEl[0], {
      speed: 1000,
      // loop: true,
      draggable: true,
      spaceBetween: 20,
      centeredSlides: false,
      // slideActiveClass: "is-active",
      breakpoints: {
        // when window width is >= 320px
        320: {
          slidesPerView: 1.2,
          slidesOffsetBefore: 20,
        },
        // when window width is >= 480px
        480: {
          slidesPerView: 1.2,
          slidesOffsetBefore: 20,
        },
        // when window width is >= 640px
        640: {
          slidesPerView: 3.5,
        },
      },
      navigation: {
        nextEl: discoverSwiperNext[0],
        prevEl: discoverSwiperPrev[0],
      },
    });
  });

  $("[data-load-wrapper]").each(function () {
    const $wrapper = $(this);
    const $items = $wrapper.find("[data-load-item]");
    const $button = $("[data-load-button]");
    const itemsToShow = 6;
    const itemsPerClick = 3;

    $items.hide();
    $items.slice(0, itemsToShow).show();

    $button.on("click", function () {
      const visibleItems = $items.filter(":visible").length;
      $items.slice(visibleItems, visibleItems + itemsPerClick).slideDown();

      if (visibleItems + itemsPerClick >= $items.length) {
        $button.hide();
      }
    });
  });

  //eventsdetailswiper
  $(".experiences_swiper_wrap").each(function (index) {
    let swiperNext = $(this).find(".experiences_swiper_next");
    let swiperPrev = $(this).find(".experiences_swiper_prev");
    let swiperEl = $(this).find(".swiper");
    let experiencesSwiper = new Swiper(swiperEl[0], {
      speed: 1000,
      loop: false,
      slidesOffsetAfter: 60,
      slideActiveClass: "is-active",
      breakpoints: {
        // when window width is >= 320px
        320: {
          slidesPerView: 1.1,
        },
        // when window width is >= 480px
        480: {
          slidesPerView: 1.1,
        },
        // when window width is >= 640px
        640: {
          slidesPerView: 3.25,
        },
      },
      navigation: {
        nextEl: swiperNext[0],
        prevEl: swiperPrev[0],
      },
    });
  });

  var clipPaths = [
    "polygon(50% 0%, 25% 0%, 15% 20%, 4% 42%, 0% 50%, 8% 70%, 17% 86%, 25% 100%, 50% 100%, 75% 100%, 88% 77%, 96% 61%, 100% 50%, 93% 33%, 84% 17%, 75% 0%)",
    "polygon(50% 10%, 21% 12%, 21% 12%, 5% 28%, 0% 50%, 5% 72%, 21% 88%, 21% 88%, 50% 90%, 79% 88%, 79% 88%, 95% 72%, 100% 50%, 95% 28%, 74% 12%, 74% 12%)",
    "polygon(50% 0%, 23% 4%, 7% 16%, 0% 36%, 5% 50%, 0% 64%, 7% 84%, 23% 96%, 50% 100%, 77% 96%, 93% 84%, 100% 64%, 95% 50%, 100% 36%, 93% 16%, 77% 4%)",
    "polygon(50% 0%, 32% 8%, 18% 17%, 5% 28%, 5% 44%, 5% 72%, 17% 83%, 33% 91%, 50% 100%, 67% 90%, 83% 80%, 95% 72%, 95% 46%, 95% 30%, 79% 16%, 69% 9%)",
  ];

  $(".turnkey_list .turnkey_img_holder").each(function (index) {
    $(this).css("clip-path", clipPaths[index % clipPaths.length]);
  });

  //hero
  $(".detail_hero_comp").each(function () {
    let deetEl = $(this);
    let deetVisual = deetEl.find(".detail_visual_holder");
    let catSpacer = deetEl.find(".category_spacer");
    let deetContent = deetEl.find(".detail_hero_content");
    let deetBottom = deetEl.find(".hero_bottom.detail");
    let deetBottomPathEl = deetEl.find(".hero_path");
    let deetBottomPath = deetEl.find("path");
    let deetOverlay = deetEl.find(".detail_hero_overlay");

    let detailHeroPath = gsap.timeline({
      scrollTrigger: {
        trigger: deetVisual,
        start: "top 50%",
        end: "top top",
        scrub: 2,
      },
    });

    detailHeroPath.to(deetBottomPathEl, {
      opacity: 1,
      duration: 0.01,
    });

    detailHeroPath.fromTo(
      deetBottomPath,
      {
        drawSVG: "0% 0%",
      },
      {
        drawSVG: "100% 0%",
        duration: 1.5,
        ease: "expo.Out",
      }
    );

    let detailHeroMove = gsap.timeline({
      scrollTrigger: {
        trigger: deetVisual,
        start: "top 45%",
        end: "top top",
        scrub: true,
      },
    });

    detailHeroMove.to(
      deetVisual,

      {
        clipPath:
          "polygon(0% 0%, 12% 0%, 33% 0%, 47% 0%, 60% 0%, 72% 0%, 82% 0%, 100% 0%, 100% 39%, 100% 56%, 100% 66%, 100% 80%, 100% 91%, 100% 100%, 83% 100%, 50% 100%, 34% 100%, 14% 100%, 0% 100%, 0% 94%, 0% 78%, 0% 63%, 0% 50%, 0% 40%, 0% 31%, 0% 17%)",
      }
    );

    let detailHeroY = gsap.timeline({
      scrollTrigger: {
        trigger: deetVisual,
        start: "top 75%",
        end: "bottom top",
        scrub: true,
      },
    });

    detailHeroY.fromTo(
      deetVisual,
      {
        yPercent: 0,
      },
      {
        yPercent: 10,
      }
    );

    let detailBotY = gsap.timeline({
      scrollTrigger: {
        trigger: deetBottom,
        start: "top center",
        endTrigger: deetVisual,
        end: "bottom top",
        scrub: true,
      },
    });

    detailBotY.fromTo(
      deetBottom,
      {
        yPercent: 0,
      },
      {
        yPercent: 30,
      }
    );

    let detailHeroOverlay = gsap.timeline({
      scrollTrigger: {
        trigger: deetOverlay,
        start: "top center",
        end: "bottom top",
        scrub: true,
      },
    });

    detailHeroOverlay.fromTo(
      deetOverlay,
      {
        opacity: 0,
      },
      {
        opacity: 0.8,
      }
    );
  });
  
  gsap.matchMedia().add("(min-width: 767px)", () => {
    $(".sticky_card").each(function () {
      let stickyImg = gsap.timeline({
        scrollTrigger: {
          trigger: this,
          start: "top bottom",
          end: "center 40%",
          scrub: true,
        },
      });

      stickyImg.fromTo(
        $(this).find(".g_visual_wrap"),
        {
          clipPath: "polygon(0% 100%, 100% 100%, 100% 20%, 0% 20%)",
        },
        {
          clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
        },
        "<"
      );
    });
  });

  let cardStack = $(".event_card");

  let cardStag = gsap.timeline({
    scrollTrigger: {
      trigger: cardStack,
      start: "top bottom",
      end: "top bottom",
      toggleActions: "play none reverse none",
    },
  });

  cardStag.fromTo(
    cardStack,
    {
      opacity: 0,
      yPercent: 30,
    },
    {
      opacity: 1,
      yPercent: 0,
      ease: "power3.out",
      duration: 1.5,
      stagger: { each: 0.1 },
    }
  );
  $(document).on("click", function (e) {
    $(".download_component").each(function () {
      var $component = $(this);
      var $holder = $component.find(".download_logo_holder");
      if ($holder.is(e.target) || $holder.has(e.target).length) {
        $component.toggleClass("is-active");
      } else if (!$component.is(e.target) && !$component.has(e.target).length) {
        $component.removeClass("is-active");
      }
    });
  });
}

function biolinkScript() {
  // console.log("bioLink");
}

function storyScript() {
  // console.log("story");

  $(".cmodal_section").each(function () {
    const swiperEl = $(this).find(".swiper.is_modal");
    if (!swiperEl.hasClass("swiper-initialized")) {
      swiperEl.addClass("swiper-initialized");

      new Swiper(swiperEl[0], {
        autoplay: {
          delay: 1000,
          disableOnInteraction: false,
        },
        speed: 1000,
        centeredSlides: true,
        loop: true,
        slidesPerView: 3.5,
        spaceBetween: 80,
        slideActiveClass: "is-active",
        breakpoints: {
          320: {
            slidesPerView: 1.5,
            spaceBetween: 20,
          },
          640: {
            slidesPerView: 3.5,
            spaceBetween: 80,
          },
        },
        navigation: {
          nextEl: $(this).find(".modal_btn_next")[0],
          prevEl: $(this).find(".modal_btn_prev")[0],
        },
      });
    }
  });

  var clipPaths = [
    "polygon(50% 0%, 25% 0%, 15% 20%, 4% 42%, 0% 50%, 8% 70%, 17% 86%, 25% 100%, 50% 100%, 75% 100%, 88% 77%, 96% 61%, 100% 50%, 93% 33%, 84% 17%, 75% 0%)",
    "polygon(50% 10%, 21% 12%, 21% 12%, 5% 28%, 0% 50%, 5% 72%, 21% 88%, 21% 88%, 50% 90%, 79% 88%, 79% 88%, 95% 72%, 100% 50%, 95% 28%, 74% 12%, 74% 12%)",
    "polygon(50% 0%, 23% 4%, 7% 16%, 0% 36%, 5% 50%, 0% 64%, 7% 84%, 23% 96%, 50% 100%, 77% 96%, 93% 84%, 100% 64%, 95% 50%, 100% 36%, 93% 16%, 77% 4%)",
    "polygon(50% 0%, 32% 8%, 18% 17%, 5% 28%, 5% 44%, 5% 72%, 17% 83%, 33% 91%, 50% 100%, 67% 90%, 83% 80%, 95% 72%, 95% 46%, 95% 30%, 79% 16%, 69% 9%)",
  ];

  $(".turnkey_list .turnkey_img_holder").each(function (index) {
    $(this).css("clip-path", clipPaths[index % clipPaths.length]);
  });

  //hero
  $(".detail_hero_comp").each(function () {
    let deetEl = $(this);
    let deetVisual = deetEl.find(".detail_visual_holder");
    let catSpacer = deetEl.find(".category_spacer");
    let deetContent = deetEl.find(".detail_hero_content");
    let deetBottom = deetEl.find(".hero_bottom.detail");
    let deetBottomPathEl = deetEl.find(".hero_path");
    let deetBottomPath = deetEl.find("path");
    let deetOverlay = deetEl.find(".detail_hero_overlay");

    let detailHeroPath = gsap.timeline({
      scrollTrigger: {
        trigger: deetVisual,
        start: "top 50%",
        end: "top top",
        scrub: 2,
      },
    });

    detailHeroPath.to(deetBottomPathEl, {
      opacity: 1,
      duration: 0.01,
    });

    detailHeroPath.fromTo(
      deetBottomPath,
      {
        drawSVG: "0% 0%",
      },
      {
        drawSVG: "100% 0%",
        duration: 1.5,
        ease: "expo.Out",
      }
    );

    let detailHeroMove = gsap.timeline({
      scrollTrigger: {
        trigger: deetVisual,
        start: "top 45%",
        end: "top top",
        scrub: true,
      },
    });

    detailHeroMove.to(
      deetVisual,

      {
        clipPath:
          "polygon(0% 0%, 12% 0%, 33% 0%, 47% 0%, 60% 0%, 72% 0%, 82% 0%, 100% 0%, 100% 39%, 100% 56%, 100% 66%, 100% 80%, 100% 91%, 100% 100%, 83% 100%, 50% 100%, 34% 100%, 14% 100%, 0% 100%, 0% 94%, 0% 78%, 0% 63%, 0% 50%, 0% 40%, 0% 31%, 0% 17%)",
      }
    );

    let detailHeroY = gsap.timeline({
      scrollTrigger: {
        trigger: deetVisual,
        start: "top 75%",
        end: "bottom top",
        scrub: true,
      },
    });

    detailHeroY.fromTo(
      deetVisual,
      {
        yPercent: 0,
      },
      {
        yPercent: 10,
      }
    );

    let detailBotY = gsap.timeline({
      scrollTrigger: {
        trigger: deetBottom,
        start: "top center",
        endTrigger: deetVisual,
        end: "bottom top",
        scrub: true,
      },
    });

    detailBotY.fromTo(
      deetBottom,
      {
        yPercent: 0,
      },
      {
        yPercent: 30,
      }
    );

    let detailHeroOverlay = gsap.timeline({
      scrollTrigger: {
        trigger: deetOverlay,
        start: "top center",
        end: "bottom top",
        scrub: true,
      },
    });

    detailHeroOverlay.fromTo(
      deetOverlay,
      {
        opacity: 0,
      },
      {
        opacity: 0.8,
      }
    );
  });

  //STORY MODAL
  // Step 1 - relocate modals out of swiper
  $("[popup-wrapper-story]").each(function () {
    $(this).appendTo("[modal-story-portal]");
  });

  // Step 2 - swiper init
  $(".experiences_swiper_wrap").each(function (index) {
    let swiperNext = $(this).find(".experiences_swiper_next");
    let swiperPrev = $(this).find(".experiences_swiper_prev");
    let swiperEl = $(this).find(".swiper");
    let experiencesSwiper = new Swiper(swiperEl[0], {
      speed: 1000,
      loop: false,
      slidesOffsetAfter: 60,
      slideActiveClass: "is-active",
      breakpoints: {
        320: { slidesPerView: 1.1 },
        480: { slidesPerView: 1.1 },
        640: { slidesPerView: 3.25 },
      },
      navigation: {
        nextEl: swiperNext[0],
        prevEl: swiperPrev[0],
      },
    });
  });

  // Step 3 - modal init
  let storyTimelines = [];

  $("[popup-component-story]").each(function (index) {
    let popupTrig = $(this).find("[popup-trigger-story]");
    let popupEl = $("[popup-wrapper-story]").eq(index);
    let popupBg = popupEl.find(".modal_overlay");
    let popupClose = popupEl.find(".modal_close_team, [cms-close]");
    let popupContent = popupEl.find(".create_modal_right");
    let popupLeft = popupEl.find(".team_hero_left");
    let teamLeftOpacity = popupEl.find("[team-modal-opacity]");
    let teamHeader = popupEl.find("[team-header]");
    let teamHeaderLines = teamHeader.find(".line");

    let popupTlStory = gsap.timeline({ paused: true });
    storyTimelines[index] = popupTlStory;

    popupTlStory.set(popupEl, { display: "flex" });

    popupTlStory.fromTo(
      popupBg,
      { opacity: 0 },
      {
        opacity: 1,
        duration: 0.4,
        ease: "power3.out",
        onStart: () => popupEl.find(".create_modal_right").scrollTop(0),
      }
    );

    popupTlStory.fromTo(
      popupContent,
      { xPercent: 100 },
      { xPercent: 0, duration: 0.8, ease: "power3.out" },
      "<"
    );

    popupTlStory.fromTo(
      popupContent,
      {
        clipPath:
          "polygon(100% 0%, 55% 0%, 61% 19%, 54% 45%, 62% 65%, 56% 79%, 56% 100%, 100% 100%)",
      },
      {
        clipPath:
          "polygon(100% 0%, 0% 0%, 0% 21%, 0% 40%, 0% 69%, 0% 89%, 0% 100%, 100% 100%)",
        duration: 0.8,
        ease: "power3.out",
        easeReverse: "expo.in"
      },
      "<"
    );

    popupTlStory.fromTo(
      teamHeaderLines,
      { clipPath: "polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)" },
      {
        clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
        ease: "expo.out",
        duration: 1.6,
        stagger: { each: 0.2 },
      },
      "<"
    );

    popupTlStory.fromTo(
      popupLeft,
      {
        xPercent: 60,
        clipPath: "polygon(100% 0%, 100% 100%, 100% 100%, 100% 0%)",
      },
      {
        xPercent: 0,
        clipPath: "polygon(0% 0%, 0% 100%, 100% 100%, 100% 0%)",
        duration: 0.1,
        ease: "power3.out",
        easeReverse: "expo.in"
      },
      "<+0.1"
    );

    popupTlStory.fromTo(
      teamLeftOpacity,
      { opacity: 0 },
      { opacity: 1, duration: 1.6, ease: "power3.out" },
      "<+0.2"
    );

    popupTrig.on("click", function () {
      popupTlStory.play();
      lenis.stop();
    });

    popupClose.on("click", function () {
      popupTlStory.reverse();
      lenis.start();
    });

    popupBg.on("click", function () {
      popupTlStory.reverse();
      lenis.start();
    });
  });

  // Global close button - outside each()
  $(".modal_close").on("click", function () {
    $("[popup-wrapper-story]").each(function (index) {
      if ($(this).css("display") !== "none") {
        storyTimelines[index].reverse();
        lenis.start();
      }
    });
  });
}

function detailRadio() {
  // $(document).off("click.detailRadio");
  // $(document).off("change.detailRadio");
  // $(document).off("ready.detailRadio");

  // if (window.detailRadioMatchMedia) {
  //   window.detailRadioMatchMedia.forEach((mm) => mm.kill());
  // }
  // window.detailRadioMatchMedia = [];

  // const mm1 = gsap.matchMedia();
  // window.detailRadioMatchMedia.push(mm1);

  // mm1.add("(min-width: 767px)", () => {
  //   $(document).on(
  //     "click.detailRadio",
  //     ".create_filter_top .u-text-small",
  //     function () {
  //       $(".create_filter_bot").toggleClass("show");
  //     }
  //   );

  //   $(document).on("click.detailRadio", ".mobile_filter_btn", function () {
  //     $(".create_filter_bot").removeClass("show");
  //   });

  //   $(document).on("click.detailRadio", ".filter_svg", function () {
  //     $(".create_item").css("display", "grid");

  //     setTimeout(() => {
  //       ScrollTrigger.refresh();
  //       // if (window.lenis) window.lenis.resize();
  //     }, 100);

  //     $(".create_item").css("display", "flex");

  //     $('.create_btn_field input[type="radio"]').each(function () {
  //       $(this).prop("checked", false);
  //       $(this)
  //         .siblings(".create_filter_radio")
  //         .removeClass("w--redirected-checked");
  //     });

  //     $(".create_filter_list .create_btn_field").val("");
  //     $(".create_filter_list .create_filter_radio").prop("checked", false);
  //     $(".create_filter_list .w-radio-input").removeClass(
  //       "w--redirected-checked"
  //     );

  //     const allRadio = $(".create_btn_field .create_field_name")
  //       .filter((_, el) => $(el).text().trim().toLowerCase() === "all")
  //       .closest(".create_btn_field")
  //       .find('input[type="radio"]');

  //     if (allRadio.length) {
  //       allRadio.prop("checked", true).trigger("change");
  //       allRadio
  //         .siblings(".create_filter_radio")
  //         .addClass("w--redirected-checked");
  //     } else {
  //       $(".create_item, .turnkey_item").css("display", "");

  //       gsap.matchMedia().add("(min-width: 992px)", () => {
  //         $(".create_item, .turnkey_item").css("display", "grid");
  //       });
  //       gsap.matchMedia().add("(max-width: 991px)", () => {
  //         $(".create_item, .turnkey_item").css("display", "flex");
  //       });
  //     }
  //   });
  // });

  // const mm2 = gsap.matchMedia();
  // window.detailRadioMatchMedia.push(mm2);

  // mm2.add("(max-width: 991px)", () => {
  //   $(document).on("click.detailRadio", ".filter_svg", function () {
  //     $(".create_item").css("display", "");

  //     $('.create_btn_field input[type="radio"]').each(function () {
  //       $(this).prop("checked", false);
  //       $(this)
  //         .siblings(".create_filter_radio")
  //         .removeClass("w--redirected-checked");
  //     });

  //     $(".create_filter_list .create_btn_field").val("");
  //     $(".create_filter_list .create_filter_radio").prop("checked", false);
  //     $(".create_filter_list .w-radio-input").removeClass(
  //       "w--redirected-checked"
  //     );

  //     const allRadio = $(".create_btn_field .create_field_name")
  //       .filter((_, el) => $(el).text().trim().toLowerCase() === "all")
  //       .closest(".create_btn_field")
  //       .find('input[type="radio"]');

  //     if (allRadio.length) {
  //       allRadio.prop("checked", true).trigger("change");
  //       allRadio
  //         .siblings(".create_filter_radio")
  //         .addClass("w--redirected-checked");
  //     } else {
  //       $(".create_item, .turnkey_item").css("display", "");

  //       gsap.matchMedia().add("(min-width: 992px)", () => {
  //         $(".create_item, .turnkey_item").css("display", "grid");
  //       });
  //       gsap.matchMedia().add("(max-width: 991px)", () => {
  //         $(".create_item, .turnkey_item").css("display", "flex");
  //       });
  //     }
  //   });

  //   $(".create_item").css("display", "flex");
  // });

  // const mm3 = gsap.matchMedia();
  // window.detailRadioMatchMedia.push(mm3);

  // mm3.add("(max-width: 766px)", () => {
  //   $(document).on(
  //     "click.detailRadio",
  //     ".create_filter_top .u-text-small",
  //     function () {
  //       $(".create_filter_bot").toggleClass("show");
  //     }
  //   );

  //   $(document).on("click.detailRadio", ".mobile_filter_btn", function () {
  //     $(".create_filter_bot").addClass("show");
  //   });
  // });

  // $(document).on(
  //   "change.detailRadio",
  //   '.create_btn_field input[type="radio"]',
  //   function () {
  //     const $clickedRadio = $(this);
  //     const selectedText = $clickedRadio
  //       .closest(".create_btn_field")
  //       .find(".create_field_name")
  //       .text()
  //       .trim();

  //     $('.create_btn_field input[type="radio"]')
  //       .not($clickedRadio)
  //       .each(function () {
  //         $(this).prop("checked", false);
  //         $(this)
  //           .siblings(".create_filter_radio")
  //           .removeClass("w--redirected-checked");
  //       });

  //     $clickedRadio.prop("checked", true);
  //     $clickedRadio
  //       .siblings(".create_filter_radio")
  //       .addClass("w--redirected-checked");

  //     if (selectedText.toLowerCase() === "all") {
  //       gsap.matchMedia().add("(min-width: 992px)", () => {
  //         $(".create_item").css("display", "grid");
  //       });
  //       gsap.matchMedia().add("(max-width: 991px)", () => {
  //         $(".create_item").css("display", "flex");
  //       });

  //       gsap.matchMedia().add("(min-width: 992px)", () => {
  //         $(".turnkey_item").css("display", "grid");
  //       });
  //       gsap.matchMedia().add("(max-width: 991px)", () => {
  //         $(".turnkey_item").css("display", "flex");
  //       });
  //     } else {
  //       gsap.matchMedia().add("(min-width: 992px)", () => {
  //         $(".create_item").each(function () {
  //           const itemText = $(this).find(".filter_location").text().trim();
  //           $(this).css("display", itemText === selectedText ? "grid" : "none");
  //         });
  //       });
  //       gsap.matchMedia().add("(max-width: 991px)", () => {
  //         $(".create_item").each(function () {
  //           const itemText = $(this).find(".filter_location").text().trim();
  //           $(this).css("display", itemText === selectedText ? "flex" : "none");
  //         });
  //       });

  //       gsap.matchMedia().add("(min-width: 992px)", () => {
  //         $(".turnkey_item").each(function () {
  //           const itemText = $(this)
  //             .find(".turnkey_card_eyebrow")
  //             .text()
  //             .trim();
  //           $(this).css("display", itemText === selectedText ? "grid" : "none");
  //         });
  //       });
  //       gsap.matchMedia().add("(max-width: 991px)", () => {
  //         $(".turnkey_item").each(function () {
  //           const itemText = $(this)
  //             .find(".turnkey_card_eyebrow")
  //             .text()
  //             .trim();
  //           $(this).css("display", itemText === selectedText ? "flex" : "none");
  //         });
  //       });
  //     }

  //     setTimeout(() => {
  //       ScrollTrigger.refresh();
  //       // if (window.lenis) window.lenis.resize();
  //     }, 100);
  //   }
  // );

  // let seen = new Set();
  // $(".create_filter_item").each(function () {
  //   let text = $(this).find(".create_field_name").text().trim();
  //   if (seen.has(text)) {
  //     $(this).remove();
  //   } else {
  //     seen.add(text);
  //   }
  // });

  // setTimeout(() => {
  //   const firstField = $(".create_btn_field").first();
  //   const firstRadio = firstField.find('input[type="radio"]');
  //   if (firstRadio.length) {
  //     firstRadio.prop("checked", true).trigger("change");
  //     firstField.find(".create_filter_radio").addClass("w--redirected-checked");
  //   }
  // }, 50);
}

function detailScript() {
  // console.log("detailScript");

  $(".detail_hero_comp").each(function () {
    let deetEl = $(this);
    let deetVisual = deetEl.find(".detail_visual_holder");
    let catSpacer = deetEl.find(".category_spacer");
    let deetContent = deetEl.find(".detail_hero_content");
    let deetBottom = deetEl.find(".hero_bottom.detail");
    let deetBottomPathEl = deetEl.find(".hero_path");
    let deetBottomPath = deetEl.find("path");
    let deetOverlay = deetEl.find(".detail_hero_overlay");

    let detailHeroPath = gsap.timeline({
      scrollTrigger: {
        trigger: deetVisual,
        start: "top 50%",
        end: "top top",
        scrub: 2,
      },
    });

    detailHeroPath.to(deetBottomPathEl, {
      opacity: 1,
      duration: 0.01,
    });

    detailHeroPath.fromTo(
      deetBottomPath,
      {
        drawSVG: "0% 0%",
      },
      {
        drawSVG: "100% 0%",
        duration: 1.5,
        ease: "expo.Out",
      }
    );

    let detailHeroMove = gsap.timeline({
      scrollTrigger: {
        trigger: deetVisual,
        start: "top 45%",
        end: "top top",
        scrub: true,
      },
    });

    detailHeroMove.to(
      deetVisual,

      {
        clipPath:
          "polygon(0% 0%, 12% 0%, 33% 0%, 47% 0%, 60% 0%, 72% 0%, 82% 0%, 100% 0%, 100% 39%, 100% 56%, 100% 66%, 100% 80%, 100% 91%, 100% 100%, 83% 100%, 50% 100%, 34% 100%, 14% 100%, 0% 100%, 0% 94%, 0% 78%, 0% 63%, 0% 50%, 0% 40%, 0% 31%, 0% 17%)",
      }
    );

    let detailHeroY = gsap.timeline({
      scrollTrigger: {
        trigger: deetVisual,
        start: "top 75%",
        end: "bottom top",
        scrub: true,
      },
    });

    detailHeroY.fromTo(
      deetVisual,
      {
        yPercent: 0,
      },
      {
        yPercent: 10,
      }
    );

    let detailBotY = gsap.timeline({
      scrollTrigger: {
        trigger: deetBottom,
        start: "top center",
        endTrigger: deetVisual,
        end: "bottom top",
        scrub: true,
      },
    });

    detailBotY.fromTo(
      deetBottom,
      {
        yPercent: 0,
      },
      {
        yPercent: 30,
      }
    );

    let detailHeroOverlay = gsap.timeline({
      scrollTrigger: {
        trigger: deetOverlay,
        start: "top center",
        end: "bottom top",
        scrub: true,
      },
    });

    detailHeroOverlay.fromTo(
      deetOverlay,
      {
        opacity: 0,
      },
      {
        opacity: 0.8,
      }
    );
  });

  let cardStack = $(".event_card");

  let cardStag = gsap.timeline({
    scrollTrigger: {
      trigger: cardStack,
      start: "top bottom",
      end: "top bottom",
      toggleActions: "play none play reverse",
    },
  });

  cardStag.fromTo(
    cardStack,
    {
      opacity: 0,
      yPercent: 30,
    },
    {
      opacity: 1,
      yPercent: 0,
      ease: "power3.out",
      duration: 1.5,
      stagger: { each: 0.1 },
    }
  );

  var clipPaths = [
    "polygon(50% 0%, 25% 0%, 15% 20%, 4% 42%, 0% 50%, 8% 70%, 17% 86%, 25% 100%, 50% 100%, 75% 100%, 88% 77%, 96% 61%, 100% 50%, 93% 33%, 84% 17%, 75% 0%)",
    "polygon(50% 10%, 21% 12%, 21% 12%, 5% 28%, 0% 50%, 5% 72%, 21% 88%, 21% 88%, 50% 90%, 79% 88%, 79% 88%, 95% 72%, 100% 50%, 95% 28%, 74% 12%, 74% 12%)",
    "polygon(50% 0%, 23% 4%, 7% 16%, 0% 36%, 5% 50%, 0% 64%, 7% 84%, 23% 96%, 50% 100%, 77% 96%, 93% 84%, 100% 64%, 95% 50%, 100% 36%, 93% 16%, 77% 4%)",
    "polygon(50% 0%, 32% 8%, 18% 17%, 5% 28%, 5% 44%, 5% 72%, 17% 83%, 33% 91%, 50% 100%, 67% 90%, 83% 80%, 95% 72%, 95% 46%, 95% 30%, 79% 16%, 69% 9%)",
  ];

  $(".turnkey_list .turnkey_img_holder").each(function (index) {
    $(this).css("clip-path", clipPaths[index % clipPaths.length]);
  });

  $(".cmodal_section").each(function () {
    const swiperEl = $(this).find(".swiper.is_modal");
    if (!swiperEl.hasClass("swiper-initialized")) {
      swiperEl.addClass("swiper-initialized");

      new Swiper(swiperEl[0], {
        autoplay: {
          delay: 1000,
          disableOnInteraction: false,
        },
        speed: 1000,
        centeredSlides: true,
        loop: true,
        slidesPerView: 3.5,
        spaceBetween: 80,
        slideActiveClass: "is-active",
        breakpoints: {
          320: {
            slidesPerView: 1.5,
            spaceBetween: 20,
          },
          640: {
            slidesPerView: 3.5,
            spaceBetween: 80,
          },
        },
        navigation: {
          nextEl: $(this).find(".modal_btn_next")[0],
          prevEl: $(this).find(".modal_btn_prev")[0],
        },
      });
    }
  });

  $(".dual_card_wrap").each(function () {
    // console.log("checking");
    if ($(this).find(".dual_card").length === 2) {
      $(this).removeClass("u-grid-column-3").addClass("u-grid-column-2");
    }
  });
}

function fbnScript() {
  $(".framed-by-nature_fixed-cta_wrap").each(function () {
    // console.log("fbn");
    let el = $(this);
    let elBtn = el.find("[data-fbn-button]");
    let tl = gsap.timeline({
      scrollTrigger: {
        trigger: "[fbn-scroll-trigger]",
        start: "clamp(top bottom)",
        end: "clamp(top center)",
        scrub: true,
      },
    });
    tl.fromTo(
      elBtn,
      {
        opacity: 0,
        yPercent: 100,
      },
      {
        opacity: 1,
        yPercent: 0,
        ease: "none",
      }
    );
  });
}

//DRAW PATH

function initSwiperWithMorph() {
  const paths = [
    "M 0.5 0 L 0.25 0.05 L 0.05 0.25 L 0 0.5 L 0.05 0.75 L 0.25 0.95 L 0.5 0.996 L 0.75 0.95 L 0.95 0.75 L 1 0.5 L 0.95 0.25 L 0.75 0.05 Z", // circle
    "M 0.5 0 L 0.258 0.012 L 0.001 0.007 L 0.025 0.493 L 0.013 0.748 L 0.013 1.005 L 0.5 0.996 L 1 0.99 L 0.994 0.787 L 0.976 0.469 L 0.996 0.007 L 0.718 0.018 Z", // sqaure
    "M 0.5 0 L 0.35 0 L 0.15 0.2 L 0.05 0.5 L 0.15 0.8 L 0.35 1 L 0.507 1 L 0.65 1 L 0.85 0.8 L 0.95 0.5 L 0.85 0.2 L 0.65 0 Z", // diamond
    "M 0.5 0 L 0.293 0.009 L 0.006 0.003 L 0.027 0.504 L 0.006 0.981 L 0.229 0.981 L 0.507 1 L 0.679 0.972 L 1 0.99 L 0.95 0.5 L 0.99 0.006 L 0.707 0.033 Z", // sqaure 2
  ];

  let morphSwiper = new Swiper(".swiper.test", {
    autoplay: {
      delay: 99000,
      disableOnInteraction: false,
    },
    autoHeight: false,
    freeMode: false,
    loopedSlides: 1,
    slidesPerView: 1,
    speed: 500,
    effect: "fade",
    fadeEffect: { crossFade: true },
    loop: true,
    slideActiveClass: "is-active",
    navigation: {
      nextEl: ".btn_main_wrap.homepage_btn_next",
      prevEl: ".btn_main_wrap.homepage_btn_prev",
    },
    on: {
      slideChange: function (swiperInstance) {
        let currentSlideIndex = swiperInstance.realIndex;
        let shapeIndex = currentSlideIndex % paths.length;

        gsap.to("#morph-path", {
          attr: { d: paths[shapeIndex] },
          duration: 1,
          ease: "primary-ease",
        });
      },
    },
  });
}

let tl = gsap.timeline();

function homeMid() {
  $(".local_hero_wrap").each(function () {
    let homeMidWrap = $(this).find(".hero_mid");
    let homeMidLine = $(this).find(".hero-text .line");

    gsap.fromTo(
      homeMidLine,
      {
        yPercent: 110,
        clipPath: "polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)",
      },
      {
        yPercent: 0,
        clipPath: "polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%)",
        ease: "expo.out",
        duration: 1.6,
        onComplete: function () {
          // lenis.start();
        },
      },
      "<"
    );
  });
}

function journalDetailSlider() {
  $(".cmodal_section").each(function () {
    const swiperEl = $(this).find(".swiper.is_modal");
    if (!swiperEl.hasClass("swiper-initialized")) {
      swiperEl.addClass("swiper-initialized");

      new Swiper(swiperEl[0], {
        autoplay: {
          delay: 1000,
          disableOnInteraction: false,
        },
        speed: 1000,
        centeredSlides: true,
        loop: true,
        slidesPerView: 3.5,
        spaceBetween: 80,
        slideActiveClass: "is-active",
        breakpoints: {
          320: {
            slidesPerView: 1.5,
            spaceBetween: 20,
          },
          640: {
            slidesPerView: 3.5,
            spaceBetween: 80,
          },
        },
        navigation: {
          nextEl: $(this).find(".modal_btn_next")[0],
          prevEl: $(this).find(".modal_btn_prev")[0],
        },
      });
    }
  });
}


 
  function initFilters() {
    function dedupeFilters() {
      const seen = new Set();
      document.querySelectorAll('.fe_filter_item').forEach(item => {
        const text = item.textContent.trim();
        if (seen.has(text)) {
          item.remove();
        } else {
          seen.add(text);
        }
      });
    }
  
    function applyFilter(filterText) {
      document.querySelectorAll('.create_list .create_item').forEach(item => {
        if (item.querySelector('[various-regions]')) {
          item.style.display = '';
          return;
        }
        if (!filterText) {
          item.style.display = '';
          return;
        }
        const locationEl   = item.querySelector('[filter-this]');
        const locationText = locationEl ? locationEl.textContent.trim() : '';
        item.style.display = (locationText === filterText) ? '' : 'none';
      });
    }
  
    function bindFilters() {
      const allField = document.querySelector('.fe_field[all]');
  
      allField?.addEventListener('click', () => {
        document.querySelectorAll('.fe_filter_item .fe_field').forEach(f => f.classList.remove('is-active'));
        allField.classList.add('is-active');
        applyFilter(null);
      });
  
      document.querySelectorAll('.fe_filter_item .fe_field').forEach(field => {
        field.addEventListener('click', () => {
          document.querySelectorAll('.fe_filter_item .fe_field').forEach(f => f.classList.remove('is-active'));
          allField?.classList.remove('is-active');
          field.classList.add('is-active');
          applyFilter(field.textContent.trim());
        });
      });
  
      const initialActive = document.querySelector('.fe_filter_item .fe_field.is-active');
      initialActive ? applyFilter(initialActive.textContent.trim()) : applyFilter(null);
    }
  
    const filterList = document.querySelector('.fe_filter_list');
    if (!filterList) return; // not on a page with filters
  
    if (document.querySelectorAll('.fe_filter_item').length > 0) {
      dedupeFilters();
      bindFilters();
      return;
    }
  
    const observer = new MutationObserver(() => {
      if (document.querySelectorAll('.fe_filter_item').length > 0) {
        observer.disconnect();
        dedupeFilters();
        bindFilters();
      }
    });
  
    observer.observe(filterList, { childList: true, subtree: true });
  }
  
  // Initial load
  document.addEventListener('DOMContentLoaded', initFilters);

function jumpTo() {
  $(".jump_comp").on("click", function (e) {
    e.preventDefault();
    gsap.to(window, { duration: 1, scrollTo: 0, ease: "power2.out" });
  });
}

function formDropdowns() {

  $("[corporate-enquiry]").on("click", function () {
    $(".contact_init").removeClass("hide");
    $(".company_holder").removeClass("hide");
  });
  $("[leisure-enquiry]").on("click", function () {
    $(".contact_init").removeClass("hide");
    $(".company_holder").addClass("hide");
  });
  $("[general-enquiry]").on("click", function () {
    $(".contact_init").addClass("hide");
    $(".company_holder").addClass("hide");
  });

  $(".form_block").each(function () {
    let subjectHeading = $(this).find(".subject_field");
    let subjectDropdown = $(this).find(".dropdown_field");
    let subjectFieldText = $(this).find(".subject_field .u-text-large");

    subjectHeading.on("click", function () {
      subjectDropdown.toggleClass("show");
    });

    subjectDropdown.on("click", ".contact_radio_field", function (e) {
      const text = $(this).text().trim();
      subjectFieldText.text(text);

      // Ensure the radio button inside is checked before toggling the class
      $(this).find(".contact_radio_btn").prop("checked", true);

      subjectDropdown.removeClass("show"); // Close dropdown
    });
  });

  let modalRadioFunc = (location) => {
    $(`[${location}-radio]`).on("click", function () {
      $(".dropdown_field").each(function () {
        $(this).removeClass("show");
      });
      $(`[${location}-dropdown]`).addClass("show");
    });
  };

  modalRadioFunc("brisbane");
  modalRadioFunc("byron-bay-tweed-valley");
  modalRadioFunc("tamborine-scenic-rim");
  modalRadioFunc("gold-coast");

  $("[cape-town-radio]").on("click", function () {
    $(".dropdown_field").each(function () {
      $(this).removeClass("show");
    });
    $("[cape-town-dropdown]").addClass("show");
  });

  $("[stellenbosch-radio]").on("click", function () {
    $(".dropdown_field").each(function () {
      $(this).removeClass("show");
    });
    $("[stellenbosch-dropdown]").addClass("show");
  });

  $("[kruger-radio]").on("click", function () {
    $(".dropdown_field").each(function () {
      $(this).removeClass("show");
    });
    $("[kruger-dropdown]").addClass("show");
  });

  $("[garden-route-radio]").on("click", function () {
    $(".dropdown_field").each(function () {
      $(this).removeClass("show");
    });
    $("[garden-route-dropdown]").addClass("show");
  });

  $("[hermanus-radio]").on("click", function () {
    $(".dropdown_field").each(function () {
      $(this).removeClass("show");
    });
    $("[hermanus-dropdown]").addClass("show");
  });

  $("[western-cape-radio]").on("click", function () {
    $(".dropdown_field").each(function () {
      $(this).removeClass("show");
    });
    $("[western-cape-dropdown]").addClass("show");
  });

  $(".form_block_signature").each(function () {
    let subjectHeading = $(this).find(".subject_field");
    let subjectDropdown = $(this).find(".dropdown_container");
    let subjectFieldText = $(this).find(".subject_field .u-text-large");

    subjectHeading.on("click", function () {
      subjectDropdown.toggleClass("show");
    });

    subjectDropdown.on("click", ".contact_radio_field", function () {
      const text = $(this).text();
      subjectFieldText.text(text);
      subjectDropdown.toggleClass("show");
    });
  });

  $(".form_block").each(function () {
    let $formBlock = $(this);

    $formBlock.find(".contact_drop").each(function () {
      let $contactDrop = $(this);
      let dateHeading = $contactDrop.find(".subject_field_date");
      let dateDropdown = $contactDrop.find(".dropdown_field_date");
      let dateFieldText = $contactDrop.find(
        ".subject_field_date .u-text-large"
      );

      dateHeading.on("click", function () {
        dateDropdown.toggleClass("show");
      });

      dateDropdown.on("click", ".contact_radio_field", function () {
        const text = $(this).text();
        // Update only the text within this specific contact_drop
        $contactDrop.find(".subject_field_date .u-text-large").text(text);
        dateDropdown.removeClass("show");
      });
    });

    $("[corporate-enquiry]").on("click", function () {
      $(".contact_init_event").removeClass("hide");
      $(".contact_init_locations").removeClass("hide");
      $(".company_holder").removeClass("hide");
      $(".contact_init_experience").addClass("hide");
      $(".form_block_signature").addClass("hide");
      $(".contact_page_form .checkbox_holder").removeClass("is-active");
      $("[corporate-hide]").each(function () {
        $(this).addClass("hide");
      });
      $("[leisure-hide]").each(function () {
        $(this).removeClass("hide");
      });
    });
    $("[leisure-enquiry]").on("click", function () {
      $(".contact_init_event").addClass("hide");
      $(".contact_init_experience").removeClass("hide");
      $(".contact_init_locations").removeClass("hide");
      $(".form_block_signature").addClass("hide");
      $(".company_holder").addClass("hide");
      $(".contact_page_form .checkbox_holder").removeClass("is-active");
      $("[corporate-hide]").each(function () {
        $(this).removeClass("hide");
      });
      $("[leisure-hide]").each(function () {
        $(this).addClass("hide");
      });
    });
    $("[general-enquiry]").on("click", function () {
      $(".contact_init").addClass("hide");
      $(".company_holder").addClass("hide");
      $(".contact_init_event").addClass("hide");
      $(".contact_init_experience").addClass("hide");
      $(".contact_init_locations").addClass("hide");
      $(".form_block_signature").addClass("hide");
      $(".contact_page_form .checkbox_holder").removeClass("is-active");
      $("[corporate-hide]").each(function () {
        $(this).removeClass("hide");
      });
      $("[leisure-hide]").each(function () {
        $(this).removeClass("hide");
      });
    });

    $(".contact_init_experience .checkbox_holder").on("click", function () {
      $(".contact_init_experience .checkbox_holder").removeClass("is-active");
      $(this).addClass("is-active");
      $(this).find('input[type="radio"]').prop("checked", true);
      $(this).find('input[type="radio"]').prop("checked", true);
      $("[signature-package]").on("click", function () {
        $(".form_block_signature").removeClass("hide");
      });
      $("[not-signature]").on("click", function () {
        $(".form_block_signature").addClass("hide");
      });
    });

    $(".contact_init_event .checkbox_holder").on("click", function () {
      $(".contact_init_event .checkbox_holder").removeClass("is-active");
      $(this).addClass("is-active");
      $(this).find('input[type="radio"]').prop("checked", true);

      $("[signature-package]").on("click", function () {
        $(".form_block_signature").removeClass("hide");
      });

      $("[not-signature]").on("click", function () {
        $(".form_block_signature").addClass("hide");
      });
    });

    $(".contact_init_locations .checkbox_holder").on("click", function () {
      $(".contact_init_locations .checkbox_holder").removeClass("is-active");
      $(this).addClass("is-active");
      $(this).find('input[type="radio"]').prop("checked", true);
    });
  });
}

$(".dropdown-toggle").click(function () {
  $(".dropdown-menu").not($(this).siblings(".dropdown-menu")).hide();
  $(this).siblings(".dropdown-menu").toggle();
});

$(".dropdown-item").click(function () {
  const selectedValue = $(this).text();
  $(this).closest(".dropdown").find(".dropdown-toggle").text(selectedValue);
  $(this).closest(".dropdown-menu").hide();
});

$(document).click(function (event) {
  if (!$(event.target).closest(".dropdown").length) {
    $(".dropdown-menu").hide();
  }
});

$(document).mousemove(function (e) {
  let mouseX = e.pageX,
    mouseY = e.pageY;

  $(".local_marquee_img_holder").each(function () {
    let $this = $(this),
      offset = $this.offset(),
      centerX = offset.left + $this.width() / 4,
      centerY = offset.top + $this.height() / 4,
      moveX = (centerX - mouseX) / 10,
      moveY = (centerY - mouseY) / 10;

    gsap.to($this, {
      x: moveX,
      y: moveY,
      duration: 0.2,
      ease: "power2.out",
    });
  });
});

// console.log("Before refresh:", ScrollTrigger.getAll());
ScrollTrigger.refresh();
// console.log("After refresh:", ScrollTrigger.getAll());
//ENTER ANIMATION

const homeIntroAnimation = (container) => {
  // $(container).addClass("fixed");
  $(".preloader_text").appendTo(".preloader_text_wrap");
  let homeIntroTl = gsap.timeline({
    onComplete: () => {
      $(container).removeClass("fixed");
    },
  });

  gsap.set($(container).find(".preloader_text"), {
    perspective: 2000,
  });
  homeIntroTl.set($(container).find(".hero_visual_wrap.local"), {
    clipPath:
      "polygon(39% 45%, 38% 54%, 39% 62%, 49% 63%, 61% 62%, 69% 63%, 70% 55%, 69% 44%, 68% 35%, 51% 33%, 39% 35%)",
  });
  homeIntroTl.to(
    $(container).find(".nav_component, .nav_dropdown, .g_visual_wrap"),
    {
      opacity: 1,
    }
  );

  homeIntroTl.to($(container).find(".hero_mid"), {
    opacity: 1,
  });

  homeIntroTl.fromTo(
    $(container).find(".preloader_text .char"),
    {
      yPercent: 110,
      scale: 0.3,
      z: -5000,
    },
    {
      xPercent: 0,
      yPercent: 0,
      scale: 1,
      x: 0,
      z: 0,
      stagger: {
        each: 0.02,
        from: "center",
      },
      ease: "back.out",
      duration: 2.5,
    }
  );
  homeIntroTl.add(() => moveText(textDestination), "<+2.8");

  homeIntroTl.fromTo(
    $(container).find(".hero_visual_wrap.local"),
    {
      opacity: 0,
    },
    {
      opacity: 1,
      ease: "expo.inOut",
    },
    "<"
  );

  homeIntroTl.fromTo(
    $(container).find(".hero_visual_wrap.local"),
    {
      clipPath:
        "polygon(39% 45%, 38% 54%, 39% 62%, 49% 63%, 61% 62%, 69% 63%, 70% 55%, 69% 44%, 68% 35%, 51% 33%, 39% 35%)",
    },
    {
      clipPath:
        "polygon(0% 40%, 0% 69%, 0% 100%, 33% 100%, 64% 100%, 100% 100%, 100% 65%, 100% 31%, 100% 0%, 49% 0%, 0% 0%)",
      ease: "expo.inOut",
      duration: 1.5,
      onComplete: function () {
        gsap.set(".nav_logo_holder", { pointerEvents: "auto" });
      },
    },
    "<"
  );
  homeIntroTl.fromTo(
    $(container).find(".hero-text .line"),
    {
      yPercent: 100,
      clipPath: "polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%)",
    },
    {
      yPercent: 0,
      clipPath: "polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)",
      ease: "expo.out",
      duration: 1.6,
      stagger: { each: 0.1 },
      onComplete: function () {
        gsap.to(".toggle", { opacity: 1, duration: 1 });
        gsap.to(".nav_link_holder.global", {
          opacity: 1,
          duration: 1,
        });
        lenis.start();
      },
    },
    "<+0.7"
  );

  homeIntroTl.to($(container).find(".hero_wrap"), {
    backgroundColor: "#f5f2ed",
    duration: 0.001,
    onComplete: function () {
      // lenis.start();
    },
  });

  return homeIntroTl;
};

const leaveAnimation = (container) => {
  const leaveTl = gsap.timeline({
    defaults: {
      ease: "power3.in",
      duration: 1,
    },
  });

  leaveTl.fromTo(
    ".transition_overlay",
    {
      opacity: 0,
    },
    {
      opacity: 1,
      duration: 1,
      ease: "sine.out",
    }
  );
  leaveTl.set($(container), {
    opacity: 0,
  });

  return leaveTl;
};

const enterAnimation = (container) => {
  $(container).addClass("fixed");
  const enterTl = gsap.timeline({
    defaults: {
      ease: "power3.inOut",
      duration: 1,
    },
  });
  enterTl.set($(container), {
    opacity: 0,
  });

  enterTl.set(".transition_comp", {
    display: "flex",
    yPercent: 0,
  });

  enterTl.fromTo(
    ".transition-holder",
    {
      yPercent: 120,
    },
    {
      yPercent: 0,
      duration: 0.8,
      ease: "expo.out",
      onComplete: () => {
        runSplit();
        runSplitNoChars();
      },
    },
    "<"
  );
  enterTl.fromTo(
    ".transition_top",
    {
      clipPath:
        "polygon(9% 65%, 0% 88%, 0% 100%, 100% 100%, 100% 73%, 93% 92%, 80% 70%, 65% 95%, 64% 80%, 57% 64%, 34% 69%, 14% 80%)",
    },
    {
      clipPath:
        "polygon(9% 0%, 0% 0%, 0% 100%, 100% 100%, 100% 0%, 87% 0%, 75% 0%, 64% 0%, 56% 0%, 45% 0%, 34% 0%, 20% 0%)",
      duration: 0.4,
      ease: "expo.out",
    },
    "<"
  );
  enterTl.fromTo(
    "path",
    {
      drawSVG: "0% 0%",
    },
    {
      drawSVG: "100% 0%",
      duration: 0.6,
      ease:"expo.inOut"
    },"<60%"
  );

  enterTl.set("path", { drawSVG: "100% 0%" });

  enterTl.set($(container), {
    opacity: 1,
  });

  enterTl.to(".transition-holder", {
    yPercent: -120,
    duration: 0.8,
    ease: "expo.out",
    onStart: () => {
      heroTextLoad();
    },
  });
  enterTl.fromTo(
    ".transition_bot",
    {
      clipPath:
        "polygon(0% 15%, 0% 0%, 100% 0%, 100% 26%, 97% 18%, 78% 25%, 65% 16%, 54% 20%, 42% 44%, 31% 37%, 28% 17%, 14% 19%, 0% 36%)",
    },
    {
      clipPath:
        "polygon(0% 15%, 0% 0%, 100% 0%, 100% 100%, 83% 100%, 71% 100%, 61% 100%, 52% 100%, 41% 100%, 29% 100%, 22% 100%, 12% 100%, 0% 100%)",
      duration: 0.7,
      ease: "expo.out",
    },
    "<"
  );
  enterTl.to(
    ".transition_overlay",
    {
      opacity: 0,
    },
    "<"
  );

  enterTl.set(".transition_comp", {
    display: "none",
    onComplete: () => {
      // lenis.start();
    },
  });

  return enterTl;
};

function resetWebflow(data) {
  let parser = new DOMParser();
  let dom = parser.parseFromString(data.next.html, "text/html");
  let webflowPageId = $(dom).find("html").attr("data-wf-page");
  $("html").attr("data-wf-page", webflowPageId);

  if (window.Webflow) {
    window.Webflow.destroy();
    window.Webflow.ready();

    // Ensure ix2 is available before calling init
    let ix2 = window.Webflow.require("ix2");
    if (ix2) {
      ix2.init();
    } else {
      // console.warn("Webflow IX2 is not available.");
    }
  }
}

barba.hooks.beforeEnter((data) => {
  checkPreloader();
  lenis.resize();
  balanceText("[scroll-animation='lines']");
  runSplit();
  runSplitNoChars();
  initScrollAnimations();
  globalReveal();
});
barba.hooks.beforeLeave(() => {
});

barba.hooks.leave(() => {
  // console.log("Killing all ScrollTriggers");
  ScrollTrigger.killAll(true);
  lenis.resize();
});

barba.hooks.afterLeave(() => {
});

barba.hooks.after((data) => {
  $(data.next.container).removeClass("fixed");
  if (!window.location.hash) {
    window.scrollTo({ top: 0, behavior: "auto" });
  }
  lenis.resize();
  globalScript();
  initScrollAnimations();
  globalReveal();
  formDropdowns();
  cursorColor();
  homeInitScroll();
  detailRadio();
  initFilters();
  resetWebflow(data);
  ScrollTrigger.refresh(true);
  jumpTo();
  setTimeout(initHubSpotForms, 800);

  if (document.querySelector(".page_main.is-home")) {
    ScrollTrigger.refresh();
  }
  if (document.querySelector("[data-barba-namespace='global-home-page']")) {
    gsap.set(".page_main", { opacity: 1 });
    gsap.to(".toggle", { opacity: 1, duration: 1, delay: 2 });
    gsap.to(".nav_link_holder.global", {
      opacity: 1,
      duration: 0.5,
      delay: 2,
    });
    lenis.start();
    ScrollTrigger.refresh();
  }
  if (document.querySelector("[data-barba-namespace='about']")) {
    lenis.start();
    ScrollTrigger.refresh();
    aboutInitScroll();
    statsSection();
  }
  if (document.querySelector("[data-barba-namespace='case-studies']")) {
  }
  if (
    document.querySelector("[data-barba-namespace='case-studies-template']")
  ) {
  }
  if (document.querySelector("[data-barba-namespace='journal']")) {
  }
  if (document.querySelector("[data-barba-namespace='journal-template']")) {
  }
  if (document.querySelector("[data-barba-namespace='detail-page']")) {
  }
  if (document.querySelector("[data-barba-namespace='category-page']")) {
  }

  if (document.querySelector("[data-barba-namespace='contact-page']")) {
    globalContactScript();
  }
});

barba.init({
  preventRunning: true,
  timeout: 900000,
  debug: true,
  views: [
    {
      namespace: "home-page",
      beforeEnter(data) {
      },
      afterEnter(data) {
        homeScripts();
        lenis.start();
        initSwiperWithMorph();
        clipHeroSwiper();
      },
    },
    {
      namespace: "global-home-page",
      beforeEnter(data) {
        lenis.stop();
      },
      afterEnter(data) {
        lenis.stop();

        globalHomeScripts();
        homeScripts();
        initSwiperWithMorph();
      },
    },
    {
      namespace: "story-page",
      beforeEnter(data) {
      },
      afterEnter(data) {
        lenis.start();
        initSwiperWithMorph();
        storyScript();
      },
    },
    {
      namespace: "case-studies",
      beforeEnter(data) {
        function resetJournalItems() {
          $(".journal_item").hide();
          $(".journal_item").slice(0, 6).show();
        }
        resetJournalItems();
        // ScrollTrigger.refresh();
      },
      afterEnter(data) {
        caseStudiesScripts();
        lenis.start();
        initSwiperWithMorph();
      },
    },
    {
      namespace: "case-studies-template",
      beforeEnter(data) {
      },
      afterEnter(data) {
        lenis.start();
        initSwiperWithMorph();
      },
    },
    {
      namespace: "journal",
      beforeEnter(data) {
      },
      afterEnter(data) {
        journalScripts();
        lenis.start();
        initSwiperWithMorph();
      },
    },
    {
      namespace: "biolink",
      beforeEnter(data) {
      },
      afterEnter(data) {
        biolinkScript();
        lenis.start();
        gsap.to(".page_main", { opacity: 1 });
      },
    },
    {
      namespace: "journal-template",
      beforeEnter(data) {
      },
      afterEnter(data) {
        lenis.start();
        initSwiperWithMorph();
        journalDetailSlider();
      },
    },
    {
      namespace: "about",
      beforeEnter(data) {},
      afterEnter(data) {
        gsap.to(".toggle", { opacity: 1, duration: 0.5 });
        gsap.to(".nav_link_holder.global", { opacity: 1, duration: 0.5 });
        aboutScript();
        initSwiperWithMorph();
        aboutTeamStack();
      },
    },
    {
      namespace: "detail-page",
      beforeEnter(data) {
        ScrollTrigger.refresh();
        lenis.resize();
      },
      afterEnter(data) {
        ScrollTrigger.refresh();
        lenis.resize();
        detailScript();
        lenis.start();
        clipSwiper();
        initSwiperWithMorph();
        fbnScript();
      },
      beforeLeave(data) {
      },
    },
    {
      namespace: "build-detail-page",
      beforeEnter(data) {},
      afterEnter(data) {
        detailScript();
        lenis.start();
        clipSwiper();
        initSwiperWithMorph();
      },
    },
    {
      namespace: "legal-page-tc",
      afterEnter(data) {
        globalScript();
        lenis.start();
      },
    },
    {
      namespace: "legal-page-pp",
      afterEnter(data) {
        globalScript();
        lenis.start();
      },
    },
    {
      namespace: "legal-page-cp",
      afterEnter(data) {
        globalScript();
        lenis.start();
      },
    },
    {
      namespace: "contact-page",
      beforeEnter(data) {
        gsap.set(".contact_content.aus", {
          yPercent: 0,
          opacity: 0,
          pointerEvents: "none",
        });
      },
      afterEnter(data) {
        globalContactScript();
        lenis.start();
      },
    },
  ],
  transitions: [
    {
      name: "page-reload",
      once: (data) => {
        jumpTo();
        if (document.querySelector(".page_main.is-global")) {
          $(window).scrollTop(0);
          gsap.set(".page_main", { opacity: 1 });
          homeIntroAnimation(data.next.container);
          globalHomeScripts();
          homeInitScroll();
          heroTextLoad();
          formDropdowns();
          contactTextLoad();
        }
        if (document.querySelector(".page_main.is-home")) {
          formDropdowns();
          heroTextLoad();
          lenis.start();
          contactTextLoad();
          homeInitScroll();
        }
        if (document.querySelector("[data-barba-namespace='about']")) {
          heroTextLoad();
          aboutInitScroll();
          formDropdowns();
          statsSection();
        }
        if (document.querySelector("[data-barba-namespace='story-page']")) {
          heroTextLoad();
          clipSwiper();
          formDropdowns();
        }
        if (document.querySelector("[data-barba-namespace='biolink']")) {
          heroTextLoad();
        }
        if (document.querySelector("[data-barba-namespace='detail-page']")) {
          heroTextLoad();
          clipSwiper();
          formDropdowns();
          detailRadio();
          fbnScript();
        }
        if (
          document.querySelector("[data-barba-namespace='build-detail-page']")
        ) {
          heroTextLoad();
          clipSwiper();
          formDropdowns();
        }
        if (document.querySelector("[data-barba-namespace='case-studies']")) {
          heroTextLoad();
          formDropdowns();
          caseStudiesScripts();
        }
        if (
          document.querySelector(
            "[data-barba-namespace='case-studies-template']"
          )
        ) {
          heroTextLoad();
          formDropdowns();
        }
        if (document.querySelector("[data-barba-namespace='journal']")) {
          heroTextLoad();
          formDropdowns();
          journalScripts();
        }
        if (
          document.querySelector("[data-barba-namespace='journal-template']")
        ) {
          heroTextLoad();
          formDropdowns();
        }
        if (document.querySelector("[data-barba-namespace='legal-page']")) {
          heroTextLoad();
          formDropdowns();
        }

        if (document.querySelector("[data-barba-namespace='contact-page']")) {
          heroTextLoad();
          contactTextLoad();
          formDropdowns();
        }
      },
    },
    {
      name: "basic-transition",
      name: "basic-transition",
      sync: true,
      leave: (data) => leaveAnimation(data.current.container),
      enter: (data) => enterAnimation(data.next.container),
    },
  ],
});