document.addEventListener('DOMContentLoaded', function() {
    // Initialize animations
    function initAnimations() {
        const animateElements = document.querySelectorAll('[data-animate]');
        animateElements.forEach(el => {
            const delay = el.dataset.delay || '0';
            el.style.transitionDelay = `${delay}ms`;
            setTimeout(() => {
                el.classList.add('animate');
            }, 100);
        });
    }
    // Set up scroll snapping with fade transitions
    function setupScrollSnap() {
        let isScrolling = false;
        let lastScrollTime = 0;
        let lastActiveSection = null;

        window.addEventListener('scroll', function() {
            const now = Date.now();
            if (isScrolling || now - lastScrollTime < 1000) return;

            const sections = document.querySelectorAll('section');
            let currentSection = null;
            let minDistance = Infinity;

            sections.forEach(section => {
                const rect = section.getBoundingClientRect();
                const distance = Math.abs(rect.top);

                if (distance < minDistance) {
                    minDistance = distance;
                    currentSection = section;
                }
            });

            if (currentSection && minDistance > 50) {
                isScrolling = true;
                
                // Update section states
                if (lastActiveSection) {
                    lastActiveSection.classList.remove('active');
                    lastActiveSection.classList.add('inactive');
                }
                
                currentSection.classList.remove('inactive');
                currentSection.classList.add('active');
                lastActiveSection = currentSection;

                currentSection.scrollIntoView({
                    behavior: 'smooth'
                });

                setTimeout(() => {
                    isScrolling = false;
                }, 1000);
            }

            lastScrollTime = now;
        });

        // Initialize first section as active
        const firstSection = document.querySelector('section');
        if (firstSection) {
            firstSection.classList.add('active');
            lastActiveSection = firstSection;
        }
    }
// Set background images
    function setBackgrounds() {
        const sections = document.querySelectorAll('section');
        const bgImages = [
            'http://static.photos/travel/1200x630/1',
            'http://static.photos/technology/1200x630/2',
            'http://static.photos/nature/1200x630/3',
            'http://static.photos/cityscape/1200x630/4',
            'http://static.photos/abstract/1200x630/5',
            'http://static.photos/adventure/1200x630/6'
        ];

        sections.forEach((section, index) => {
            if (bgImages[index]) {
                section.style.backgroundImage = `url(${bgImages[index]})`;
            }
        });
    }
    // Initialize everything
    setBackgrounds();
    initAnimations();
    setupScrollSnap();

    // Initialize all sections as inactive except first
    const sections = document.querySelectorAll('section');
    sections.forEach((section, index) => {
        if (index > 0) {
            section.classList.add('inactive');
        }
    });
// Handle navigation clicks
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function(e) {
            e.preventDefault();
            const target = document.querySelector(this.getAttribute('href'));
            if (target) {
                target.scrollIntoView({ behavior: 'smooth' });
            }
        });
    });
});