// Registra o plugin de Scroll da biblioteca GSAP
gsap.registerPlugin(ScrollTrigger);

// 1. Animação de Entrada (Hero Section)
// Faz os textos da primeira dobra subirem e aparecerem suavemente quando o site carrega
const heroElements = document.querySelectorAll('.gs-reveal');
gsap.from(heroElements, {
    y: 50,
    opacity: 0,
    duration: 1.5,
    stagger: 0.2, // Um elemento aparece depois do outro
    ease: "power4.out",
    delay: 0.2
});

// 2. Efeito Paralaxe na imagem de fundo do Início
gsap.to(".parallax-bg", {
    yPercent: 30, // Move a imagem 30% para baixo
    ease: "none",
    scrollTrigger: {
        trigger: "#home",
        start: "top top", // Começa quando o topo da seção toca o topo da tela
        end: "bottom top", // Termina quando o fundo da seção toca o topo da tela
        scrub: true // Faz a animação seguir exatamente o movimento do mouse/dedo
    }
});

// 3. Revelar Seções ao rolar a página (Scroll Animation)
const revealSections = document.querySelectorAll('.reveal-section');

revealSections.forEach((section) => {
    gsap.from(section, {
        opacity: 0,
        y: 80, // Vem de baixo para cima
        duration: 1.2,
        ease: "power3.out",
        scrollTrigger: {
            trigger: section,
            start: "top 85%", // Dispara quando a seção chega a 85% da altura da tela
            toggleActions: "play none none reverse" // Anima na ida e na volta
        }
    });
});

// 4. Animação especial para os cards de projeto (surgindo em cascata)
gsap.from(".project-card", {
    opacity: 0,
    y: 50,
    duration: 1,
    stagger: 0.2,
    scrollTrigger: {
        trigger: ".projects-grid",
        start: "top 80%"
    }
});