// ------- Osmo [https://osmo.supply/] ------- //

gsap.registerPlugin(SplitText, CustomEase)

CustomEase.create("osmo-ease","0.625, 0.05, 0, 1");

function initMaskedTextReveal() {
 const heading = document.querySelector('[data-split="heading"]');
 const buttons = document.querySelectorAll('[data-split="button"]');

 SplitText.create(heading, {
 type: "lines, words, chars",
 mask: "lines",
 linesClass: "line",
 wordsClass: "word",
 charsClass: "letter"
 });

 let currentTween, currentTargets;
 const config = {
 lines: { duration: 0.8, stagger: 0.08 },
 words: { duration: 0.6, stagger: 0.06 },
 letters: { duration: 0.4, stagger: 0.008 }
 };

 function animate(type) {
 if(currentTween){
 currentTween.kill();
 gsap.set(currentTargets, { yPercent: 0 });
 }
 const { duration, stagger } = config[type] || {};
 const className = type === "lines"
 ? "line"
 : type === "words"
 ? "word"
 : "letter";
 const targets = heading.querySelectorAll(`.${className}`);
 
 currentTargets = targets;
 currentTween = gsap.fromTo(
 targets,
 { yPercent: 110 },
 { yPercent: 0, duration, stagger, ease: "osmo-ease" }
 );
 
 }

 buttons.forEach(btn => {
 btn.addEventListener("click", () => {
 animate(btn.dataset.splitType);
 });
 });
}

// Initialize Masked Text Reveal
document.fonts.ready.then(function () {
 initMaskedTextReveal();
})