script.js

// Parallax Effect Avançado
let ticking = false;

window.addEventListener('scroll', () => {
    if (!ticking) {
        window.requestAnimationFrame(() => {
            const scrolled = window.pageYOffset;
            
            // Hero Parallax
            const layerBg = document.querySelector('.layer-bg');
            const layerOverlay = document.querySelector('.layer-overlay');
            
            if (layerBg) {
                layerBg.style.transform = `translateY(${scrolled * 0.5}px)`;
            }
            if (layerOverlay) {
                layerOverlay.style.transform = `translateY(${scrolled * 0.3}px)`;
            }
            
            // About Parallax
            const aboutParallax = document.querySelector('.about-parallax');
            if (aboutParallax) {
                const aboutSection = document.querySelector('.about');
                const aboutTop = aboutSection.offsetTop;
                const aboutScroll = scrolled - aboutTop;
                aboutParallax.style.transform = `translateX(${aboutScroll * 0.1}px)`;
            }
            
            // Services Parallax
            const servicesParallax = document.querySelector('.services-parallax');
            if (servicesParallax) {
                servicesParallax.style.transform = `translateY(${scrolled * 0.2}px)`;
            }
            
            // Contact Parallax
            const contactParallax = document.querySelector('.contact-parallax');
            if (contactParallax) {
                contactParallax.style.transform = `translateY(${scrolled * 0.15}px)`;
            }
            
            ticking = false;
        });
        
        ticking = true;
    }
});

// Toggle Service Details
function toggleService(index) {
    const serviceDetails = document.getElementById(`service-${index}`);
    const serviceCard = serviceDetails.closest('.service-card');
    const allDetails = document.querySelectorAll('.service-details');
    const allCards = document.querySelectorAll('.service-card');
    
    // Fecha outros cards
    allDetails.forEach((detail, i) => {
        if (i !== index) {
            detail.classList.remove('active');
            allCards[i].classList.remove('active');
        }
    });
    
    // Toggle do card atual
    serviceDetails.classList.toggle('active');
    serviceCard.classList.toggle('active');
}

// Header Scroll Effect
let lastScroll = 0;
window.addEventListener('scroll', () => {
    const header = document.querySelector('.header');
    const currentScroll = window.pageYOffset;
    
    if (currentScroll > 100) {
        header.style.padding = '0.8rem 0';
        header.style.boxShadow = '0 6px 25px rgba(0,0,0,0.2)';
    } else {
        header.style.padding = '1.2rem 0';
        header.style.boxShadow = '0 4px 20px rgba(0,0,0,0.15)';
    }
    
    lastScroll = currentScroll;
});

// Smooth Scroll com Parallax
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
    anchor.addEventListener('click', function (e) {
        e.preventDefault();
        const targetId = this.getAttribute('href');
        const target = document.querySelector(targetId);
        
        if (target) {
            const headerHeight = document.querySelector('.header').offsetHeight;
            const targetPosition = target.offsetTop - headerHeight;
            
            // Smooth scroll com easing personalizado
            const startPosition = window.pageYOffset;
            const distance = targetPosition - startPosition;
            const duration = 1200; // Duração em ms
            let start = null;
            
            function easeInOutCubic(t) {
                return t < 0.5 
                    ? 4 * t * t * t 
                    : 1 - Math.pow(-2 * t + 2, 3) / 2;
            }
            
            function animation(currentTime) {
                if (start === null) start = currentTime;
                const timeElapsed = currentTime - start;
                const progress = Math.min(timeElapsed / duration, 1);
                const ease = easeInOutCubic(progress);
                
                window.scrollTo(0, startPosition + distance * ease);
                
                if (timeElapsed < duration) {
                    requestAnimationFrame(animation);
                }
            }
            
            requestAnimationFrame(animation);
        }
    });
});

// Intersection Observer para animações
const observerOptions = {
    threshold: 0.15,
    rootMargin: '0px 0px -100px 0px'
};

const observer = new IntersectionObserver((entries) => {
    entries.forEach(entry => {
        if (entry.isIntersecting) {
            entry.target.style.opacity = '1';
            entry.target.style.transform = 'translateY(0)';
        }
    });
}, observerOptions);

// Anima elementos ao scroll
document.addEventListener('DOMContentLoaded', () => {
    const animateElements = document.querySelectorAll('.service-card, .about-image, .about-text');
    
    animateElements.forEach(el => {
        el.style.opacity = '0';
        el.style.transform = 'translateY(30px)';
        el.style.transition = 'opacity 0.8s ease, transform 0.8s ease';
        observer.observe(el);
    });
});

// Scroll Indicator
window.addEventListener('scroll', () => {
    const scrollIndicator = document.querySelector('.scroll-indicator');
    if (scrollIndicator) {
        if (window.pageYOffset > 200) {
            scrollIndicator.style.opacity = '0';
        } else {
            scrollIndicator.style.opacity = '1';
        }
    }
});

// Preload de imagens
window.addEventListener('load', () => {
    const images = document.querySelectorAll('img');
    images.forEach(img => {
        img.style.opacity = '0';
        img.style.transition = 'opacity 0.6s ease';
        
        if (img.complete) {
            img.style.opacity = '1';
        } else {
            img.addEventListener('load', () => {
                img.style.opacity = '1';
            });
        }
    });
});