script.js

// Enhanced GSAP animations
document.addEventListener('DOMContentLoaded', () => {
    // Register GSAP plugins
    gsap.registerPlugin(ScrollTrigger);
    
    // Animate all elements with gsap-fade-in class
    gsap.utils.toArray('.gsap-fade-in').forEach(el => {
        gsap.from(el, {
            scrollTrigger: {
                trigger: el,
                start: "top 80%",
                toggleActions: "play none none none"
            },
            opacity: 0,
            y: 30,
            duration: 0.8,
            ease: "power3.out"
        });
    });

    // Animate all elements with gsap-scale-in class
    gsap.utils.toArray('.gsap-scale-in').forEach(el => {
        gsap.from(el, {
            scrollTrigger: {
                trigger: el,
                start: "top 80%",
                toggleActions: "play none none none"
            },
            opacity: 0,
            scale: 0.95,
            duration: 0.6,
            ease: "back.out(1.7)"
        });
    });

    // Hero section typing animation
    const heroText = "Marzool Technologies";
    const heroElement = document.querySelector('.hero-text-animate');
    if (heroElement) {
        let i = 0;
        const typing = setInterval(() => {
            heroElement.textContent += heroText[i];
            i++;
            if (i >= heroText.length) clearInterval(typing);
        }, 100);
    }
// Animate service cards on scroll
    gsap.utils.toArray('.portfolio-item').forEach((item, i) => {
        gsap.from(item, {
            scrollTrigger: {
                trigger: item,
                start: "top 80%",
                toggleActions: "play none none none"
            },
            opacity: 0,
            y: 50,
            duration: 0.8,
            delay: i * 0.1
        });
    });

    // Smooth scrolling for anchor links
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function (e) {
            e.preventDefault();
            const target = document.querySelector(this.getAttribute('href'));
            if (target) {
                window.scrollTo({
                    top: target.offsetTop - 80,
                    behavior: 'smooth'
                });
            }
        });
    });
});

// Simple testimonial slider
let currentTestimonial = 0;
const testimonials = [
    {
        name: "Sarah Johnson",
        role: "CEO, TechCorp",
        quote: "Marzool transformed our online presence with their innovative web solutions. Their team's expertise in AI integration was particularly impressive.",
        image: "https://static.photos/people/200x200/1"
    },
    {
        name: "Michael Chen",
        role: "CTO, FinTech Solutions",
        quote: "The AI-powered dashboard they developed has revolutionized our data analysis process. Highly recommend their services.",
        image: "https://static.photos/people/200x200/2"
    },
    {
        name: "Emma Rodriguez",
        role: "Marketing Director, RetailPlus",
        quote: "From concept to launch, Marzool exceeded our expectations at every stage. Their mobile app has significantly boosted our customer engagement.",
        image: "https://static.photos/people/200x200/3"
    }
];

function updateTestimonial() {
    const testimonial = testimonials[currentTestimonial];
    const slider = document.querySelector('.testimonial-slider');
    
    if (slider) {
        slider.innerHTML = `
            <div class="testimonial bg-gray-800 rounded-xl p-8 text-center">
                <div class="w-20 h-20 mx-auto mb-6 rounded-full overflow-hidden border-2 border-blue-500">
                    <img src="${testimonial.image}" alt="Client" class="w-full h-full object-cover">
                </div>
                <p class="text-lg italic mb-6">"${testimonial.quote}"</p>
                <h4 class="font-bold">${testimonial.name}</h4>
                <p class="text-gray-400">${testimonial.role}</p>
            </div>
        `;
        
        // Animate the new testimonial
        gsap.from('.testimonial', {
            opacity: 0,
            y: 20,
            duration: 0.8
        });
    }
}

// Rotate testimonials every 5 seconds
setInterval(() => {
    currentTestimonial = (currentTestimonial + 1) % testimonials.length;
    updateTestimonial();
}, 5000);

// Initialize first testimonial
updateTestimonial();