// Main JavaScript file for EnKart30 website

document.addEventListener('DOMContentLoaded', function() {
    // Initialize all functionality
    initSidebar();
    initSmoothScrolling();
    initPortfolioFilter();
    initScrollEffects();
    initContactForm();
    initLightbox();
    initCarousel();
    initMuralsCarousel();
    initVideoCarousel();
    initBrandingCarousel();
});

// Sidebar Toggle
function initSidebar() {
    const sidebarToggle = document.getElementById('sidebar-toggle');
    const sidebar = document.getElementById('sidebar');
    const sidebarClose = document.getElementById('sidebar-close');
    const sidebarOverlay = document.getElementById('sidebar-overlay');
    
    if (sidebarToggle && sidebar) {
        // Open sidebar
        sidebarToggle.addEventListener('click', function() {
            sidebar.classList.add('active');
            sidebarOverlay.classList.add('active');
            sidebarToggle.classList.add('active');
            document.body.style.overflow = 'hidden';
        });

        // Close sidebar
        function closeSidebar() {
            sidebar.classList.remove('active');
            sidebarOverlay.classList.remove('active');
            sidebarToggle.classList.remove('active');
            document.body.style.overflow = '';
        }

        if (sidebarClose) {
            sidebarClose.addEventListener('click', closeSidebar);
        }

        if (sidebarOverlay) {
            sidebarOverlay.addEventListener('click', closeSidebar);
        }

        // Close sidebar when clicking on navigation links
        const sidebarLinks = sidebar.querySelectorAll('.sidebar-nav a');
        sidebarLinks.forEach(link => {
            link.addEventListener('click', function() {
                closeSidebar();
                
                // Add active class to clicked link
                sidebarLinks.forEach(l => l.classList.remove('active'));
                this.classList.add('active');
            });
        });

        // Close sidebar on escape key
        document.addEventListener('keydown', function(e) {
            if (e.key === 'Escape' && sidebar.classList.contains('active')) {
                closeSidebar();
            }
        });
    }
}

// Smooth Scrolling for Navigation Links
function initSmoothScrolling() {
    const navLinks = document.querySelectorAll('nav a[href^="#"], .hero-btns a[href^="#"]');
    
    navLinks.forEach(link => {
        link.addEventListener('click', function(e) {
            e.preventDefault();
            
            const targetId = this.getAttribute('href').substring(1);
            const targetElement = document.getElementById(targetId);
            
            if (targetElement) {
                const headerHeight = document.querySelector('header').offsetHeight;
                const targetPosition = targetElement.offsetTop - headerHeight - 20;
                
                window.scrollTo({
                    top: targetPosition,
                    behavior: 'smooth'
                });
            }
        });
    });
}

// Portfolio Filter Functionality
function initPortfolioFilter() {
    const filterBtns = document.querySelectorAll('.filter-btn');
    const portfolioItems = document.querySelectorAll('.portfolio-item');
    
    filterBtns.forEach(btn => {
        btn.addEventListener('click', function() {
            // Remove active class from all buttons
            filterBtns.forEach(b => b.classList.remove('active'));
            // Add active class to clicked button
            this.classList.add('active');
            
            const filterValue = this.getAttribute('data-filter');
            
            portfolioItems.forEach(item => {
                if (filterValue === 'all' || item.getAttribute('data-category') === filterValue) {
                    item.style.display = 'block';
                    // Add fade in animation
                    item.style.opacity = '0';
                    setTimeout(() => {
                        item.style.opacity = '1';
                    }, 100);
                } else {
                    item.style.display = 'none';
                }
            });
        });
    });
}

// Scroll Effects - Header background change and animations
function initScrollEffects() {
    const header = document.querySelector('header');
    const sections = document.querySelectorAll('section');
    const navLinks = document.querySelectorAll('nav a');
    
    window.addEventListener('scroll', function() {
        const scrollPosition = window.scrollY;
        
        // Enhanced header effects on scroll
        if (scrollPosition > 50) {
            header.classList.add('scrolled');
        } else {
            header.classList.remove('scrolled');
        }
        
        // Active navigation highlighting
        sections.forEach((section, index) => {
            const sectionTop = section.offsetTop - 100;
            const sectionHeight = section.offsetHeight;
            
            if (scrollPosition >= sectionTop && scrollPosition < sectionTop + sectionHeight) {
                navLinks.forEach(link => link.classList.remove('active'));
                const correspondingLink = document.querySelector(`nav a[href="#${section.id}"]`);
                if (correspondingLink) {
                    correspondingLink.classList.add('active');
                }
            }
        });
        
        // Animate elements on scroll
        animateOnScroll();
    });
}

// Animate elements when they come into view
function animateOnScroll() {
    const animateElements = document.querySelectorAll('.service-card, .portfolio-item, .testimonial-card');
    
    animateElements.forEach(element => {
        const elementTop = element.getBoundingClientRect().top;
        const elementVisible = 150;
        
        if (elementTop < window.innerHeight - elementVisible) {
            element.style.opacity = '1';
            element.style.transform = 'translateY(0)';
        }
    });
}

// Initialize animations
function initAnimations() {
    const animateElements = document.querySelectorAll('.service-card, .portfolio-item, .testimonial-card');
    
    animateElements.forEach(element => {
        element.style.opacity = '0';
        element.style.transform = 'translateY(50px)';
        element.style.transition = 'opacity 0.6s ease, transform 0.6s ease';
    });
}

// Contact Form Enhancement
function initContactForm() {
    const contactForm = document.querySelector('.contact-form form');
    
    if (contactForm) {
        const inputs = contactForm.querySelectorAll('input, textarea, select');
        
        // Add focus/blur effects for better UX
        inputs.forEach(input => {
            input.addEventListener('focus', function() {
                this.parentElement.classList.add('focused');
            });
            
            input.addEventListener('blur', function() {
                if (this.value === '') {
                    this.parentElement.classList.remove('focused');
                }
            });
        });
        
        // Form validation before submit
        contactForm.addEventListener('submit', function(e) {
            const name = contactForm.querySelector('input[name="name"]').value.trim();
            const email = contactForm.querySelector('input[name="email"]').value.trim();
            const message = contactForm.querySelector('textarea[name="message"]').value.trim();
            
            if (!name || !email || !message) {
                e.preventDefault();
                showNotification('Please fill in all required fields.', 'error');
                return;
            }
            
            if (!isValidEmail(email)) {
                e.preventDefault();
                showNotification('Please enter a valid email address.', 'error');
                return;
            }
            
            // Show loading state
            const submitBtn = contactForm.querySelector('button[type="submit"]');
            const originalText = submitBtn.textContent;
            submitBtn.textContent = 'Sending...';
            submitBtn.disabled = true;
            
            // Reset button after a delay (form will redirect, but good for UX)
            setTimeout(() => {
                submitBtn.textContent = originalText;
                submitBtn.disabled = false;
            }, 3000);
        });
    }
}

// Email validation helper
function isValidEmail(email) {
    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    return emailRegex.test(email);
}

// Notification system
function showNotification(message, type = 'info') {
    const notification = document.createElement('div');
    notification.className = `alert alert-${type === 'error' ? 'danger' : 'success'} alert-dismissible fade show`;
    notification.style.position = 'fixed';
    notification.style.top = '100px';
    notification.style.right = '20px';
    notification.style.zIndex = '1050';
    notification.style.maxWidth = '400px';
    
    notification.innerHTML = `
        ${message}
        <button type="button" class="btn-close" onclick="this.parentElement.remove()"></button>
    `;
    
    document.body.appendChild(notification);
    
    // Auto remove after 5 seconds
    setTimeout(() => {
        if (notification.parentElement) {
            notification.remove();
        }
    }, 5000);
}

// Intersection Observer for better animations
function initIntersectionObserver() {
    const observerOptions = {
        threshold: 0.1,
        rootMargin: '0px 0px -50px 0px'
    };
    
    const observer = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.classList.add('animate-in');
            }
        });
    }, observerOptions);
    
    // Observe elements for animation
    const elementsToObserve = document.querySelectorAll('.service-card, .portfolio-item, .testimonial-card, .about-content, .contact-info');
    elementsToObserve.forEach(el => observer.observe(el));
}

// Initialize intersection observer when page loads
document.addEventListener('DOMContentLoaded', function() {
    // Small delay to ensure all elements are rendered
    setTimeout(initIntersectionObserver, 100);
    initAnimations();
});

// Smooth scroll to top functionality
function scrollToTop() {
    window.scrollTo({
        top: 0,
        behavior: 'smooth'
    });
}

// Add scroll to top button
function addScrollToTopButton() {
    const scrollBtn = document.createElement('button');
    scrollBtn.innerHTML = '<i class="fas fa-chevron-up"></i>';
    scrollBtn.className = 'scroll-to-top';
    scrollBtn.style.cssText = `
        position: fixed;
        bottom: 30px;
        right: 30px;
        width: 50px;
        height: 50px;
        background: var(--accent);
        color: white;
        border: none;
        border-radius: 50%;
        cursor: pointer;
        display: none;
        align-items: center;
        justify-content: center;
        z-index: 1000;
        transition: all 0.3s ease;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    `;
    
    scrollBtn.addEventListener('click', scrollToTop);
    
    // Show/hide based on scroll position
    window.addEventListener('scroll', () => {
        if (window.scrollY > 300) {
            scrollBtn.style.display = 'flex';
        } else {
            scrollBtn.style.display = 'none';
        }
    });
    
    document.body.appendChild(scrollBtn);
}

// Initialize scroll to top button
document.addEventListener('DOMContentLoaded', addScrollToTopButton);

// Performance optimization - Lazy loading for images
function initLazyLoading() {
    const images = document.querySelectorAll('img[data-src]');
    
    const imageObserver = new IntersectionObserver((entries, observer) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                const img = entry.target;
                img.src = img.dataset.src;
                img.classList.remove('lazy');
                imageObserver.unobserve(img);
            }
        });
    });
    
    images.forEach(img => imageObserver.observe(img));
}

// Initialize lazy loading if data-src attributes are used
document.addEventListener('DOMContentLoaded', initLazyLoading);

// Lightbox Image Viewer
function initLightbox() {
    const portfolioItems = document.querySelectorAll('.portfolio-item');
    const lightbox = document.getElementById('lightbox');
    const lightboxImage = document.getElementById('lightbox-image');
    const lightboxTitle = document.getElementById('lightbox-title');
    const lightboxDescription = document.getElementById('lightbox-description');
    const lightboxClose = document.querySelector('.lightbox-close');
    const lightboxPrev = document.getElementById('lightbox-prev');
    const lightboxNext = document.getElementById('lightbox-next');
    
    let currentImageIndex = 0;
    let images = [];
    
    // Collect all portfolio images and their data
    portfolioItems.forEach((item, index) => {
        const img = item.querySelector('img');
        const overlay = item.querySelector('.portfolio-overlay');
        const title = overlay.querySelector('h4').textContent;
        const description = overlay.querySelector('p').textContent;
        
        images.push({
            src: img.src,
            alt: img.alt,
            title: title,
            description: description
        });
        
        // Add click event to portfolio item
        item.addEventListener('click', function() {
            currentImageIndex = index;
            openLightbox();
        });
    });
    
    function openLightbox() {
        const imageData = images[currentImageIndex];
        lightboxImage.src = imageData.src;
        lightboxImage.alt = imageData.alt;
        lightboxTitle.textContent = imageData.title;
        lightboxDescription.textContent = imageData.description;
        
        lightbox.style.display = 'block';
        document.body.style.overflow = 'hidden';
        
        updateNavigationButtons();
    }
    
    function closeLightbox() {
        lightbox.style.display = 'none';
        document.body.style.overflow = '';
    }
    
    function showPreviousImage() {
        currentImageIndex = currentImageIndex > 0 ? currentImageIndex - 1 : images.length - 1;
        openLightbox();
    }
    
    function showNextImage() {
        currentImageIndex = currentImageIndex < images.length - 1 ? currentImageIndex + 1 : 0;
        openLightbox();
    }
    
    function updateNavigationButtons() {
        lightboxPrev.disabled = images.length <= 1;
        lightboxNext.disabled = images.length <= 1;
    }
    
    // Event listeners
    if (lightboxClose) {
        lightboxClose.addEventListener('click', closeLightbox);
    }
    
    if (lightboxPrev) {
        lightboxPrev.addEventListener('click', showPreviousImage);
    }
    
    if (lightboxNext) {
        lightboxNext.addEventListener('click', showNextImage);
    }
    
    // Close lightbox when clicking outside the image
    lightbox.addEventListener('click', function(e) {
        if (e.target === lightbox) {
            closeLightbox();
        }
    });
    
    // Keyboard navigation
    document.addEventListener('keydown', function(e) {
        if (lightbox.style.display === 'block') {
            switch(e.key) {
                case 'Escape':
                    closeLightbox();
                    break;
                case 'ArrowLeft':
                    showPreviousImage();
                    break;
                case 'ArrowRight':
                    showNextImage();
                    break;
            }
        }
    });
}

// Horizontal Sliding Carousel
function initCarousel() {
    const carouselWrapper = document.querySelector('.carousel-wrapper');
    const slides = document.querySelectorAll('.carousel-slide');
    const prevBtn = document.getElementById('carouselPrev');
    const nextBtn = document.getElementById('carouselNext');
    const indicators = document.querySelectorAll('.indicator');
    
    let currentSlide = 0;
    const totalSlides = slides.length;
    
    // Auto-play interval
    let autoPlayInterval;
    const autoPlayDelay = 5000; // 5 seconds
    
    function updateCarousel() {
        const translateX = -currentSlide * 100;
        carouselWrapper.style.transform = `translateX(${translateX}%)`;
        
        // Update indicators
        indicators.forEach((indicator, index) => {
            indicator.classList.toggle('active', index === currentSlide);
        });
        
        // Update slides active state
        slides.forEach((slide, index) => {
            slide.classList.toggle('active', index === currentSlide);
        });
    }
    
    function nextSlide() {
        currentSlide = (currentSlide + 1) % totalSlides;
        updateCarousel();
    }
    
    function prevSlide() {
        currentSlide = (currentSlide - 1 + totalSlides) % totalSlides;
        updateCarousel();
    }
    
    function goToSlide(slideIndex) {
        currentSlide = slideIndex;
        updateCarousel();
    }
    
    function startAutoPlay() {
        autoPlayInterval = setInterval(nextSlide, autoPlayDelay);
    }
    
    function stopAutoPlay() {
        clearInterval(autoPlayInterval);
    }
    
    // Event listeners
    if (nextBtn) {
        nextBtn.addEventListener('click', () => {
            nextSlide();
            stopAutoPlay();
            setTimeout(startAutoPlay, 3000); // Restart after 3 seconds
        });
    }
    
    if (prevBtn) {
        prevBtn.addEventListener('click', () => {
            prevSlide();
            stopAutoPlay();
            setTimeout(startAutoPlay, 3000); // Restart after 3 seconds
        });
    }
    
    // Indicator click events
    indicators.forEach((indicator, index) => {
        indicator.addEventListener('click', () => {
            goToSlide(index);
            stopAutoPlay();
            setTimeout(startAutoPlay, 3000); // Restart after 3 seconds
        });
    });
    
    // Keyboard navigation
    document.addEventListener('keydown', (e) => {
        const carouselSection = document.querySelector('.featured-carousel');
        const rect = carouselSection.getBoundingClientRect();
        const isCarouselVisible = rect.top < window.innerHeight && rect.bottom > 0;
        
        if (isCarouselVisible) {
            switch(e.key) {
                case 'ArrowLeft':
                    prevSlide();
                    stopAutoPlay();
                    setTimeout(startAutoPlay, 3000);
                    break;
                case 'ArrowRight':
                    nextSlide();
                    stopAutoPlay();
                    setTimeout(startAutoPlay, 3000);
                    break;
            }
        }
    });
    
    // Touch/swipe support for mobile
    let startX = 0;
    let currentX = 0;
    let isDragging = false;
    
    carouselWrapper.addEventListener('touchstart', (e) => {
        startX = e.touches[0].clientX;
        isDragging = true;
        stopAutoPlay();
    });
    
    carouselWrapper.addEventListener('touchmove', (e) => {
        if (!isDragging) return;
        e.preventDefault();
        currentX = e.touches[0].clientX;
    });
    
    carouselWrapper.addEventListener('touchend', () => {
        if (!isDragging) return;
        
        const diffX = startX - currentX;
        const threshold = 50; // Minimum distance for swipe
        
        if (Math.abs(diffX) > threshold) {
            if (diffX > 0) {
                nextSlide();
            } else {
                prevSlide();
            }
        }
        
        isDragging = false;
        setTimeout(startAutoPlay, 3000);
    });
    
    // Pause auto-play on hover
    const carouselContainer = document.querySelector('.carousel-container');
    if (carouselContainer) {
        carouselContainer.addEventListener('mouseenter', stopAutoPlay);
        carouselContainer.addEventListener('mouseleave', startAutoPlay);
    }
    
    // Initialize carousel
    updateCarousel();
    startAutoPlay();
    
    // Pause auto-play when page is not visible
    document.addEventListener('visibilitychange', () => {
        if (document.hidden) {
            stopAutoPlay();
        } else {
            startAutoPlay();
        }
    });
}

// Murals Carousel
function initMuralsCarousel() {
    const muralsCarouselWrapper = document.querySelector('.murals-carousel-wrapper');
    const muralsSlides = document.querySelectorAll('.murals-carousel .carousel-slide');
    const muralsPrevBtn = document.getElementById('muralsCarouselPrev');
    const muralsNextBtn = document.getElementById('muralsCarouselNext');
    const muralsIndicators = document.querySelectorAll('.murals-indicators .indicator');
    
    if (!muralsCarouselWrapper || muralsSlides.length === 0) return;
    
    let currentMuralSlide = 0;
    const totalMuralSlides = muralsSlides.length;
    
    // Auto-play interval
    let muralsAutoPlayInterval;
    const muralsAutoPlayDelay = 6000; // 6 seconds
    
    function updateMuralsCarousel() {
        const translateX = -currentMuralSlide * 100;
        muralsCarouselWrapper.style.transform = `translateX(${translateX}%)`;
        
        // Update indicators
        muralsIndicators.forEach((indicator, index) => {
            indicator.classList.toggle('active', index === currentMuralSlide);
        });
        
        // Update slides active state
        muralsSlides.forEach((slide, index) => {
            slide.classList.toggle('active', index === currentMuralSlide);
        });
    }
    
    function nextMuralSlide() {
        currentMuralSlide = (currentMuralSlide + 1) % totalMuralSlides;
        updateMuralsCarousel();
    }
    
    function prevMuralSlide() {
        currentMuralSlide = (currentMuralSlide - 1 + totalMuralSlides) % totalMuralSlides;
        updateMuralsCarousel();
    }
    
    function goToMuralSlide(slideIndex) {
        currentMuralSlide = slideIndex;
        updateMuralsCarousel();
    }
    
    function startMuralsAutoPlay() {
        muralsAutoPlayInterval = setInterval(nextMuralSlide, muralsAutoPlayDelay);
    }
    
    function stopMuralsAutoPlay() {
        clearInterval(muralsAutoPlayInterval);
    }
    
    // Event listeners
    if (muralsNextBtn) {
        muralsNextBtn.addEventListener('click', () => {
            nextMuralSlide();
            stopMuralsAutoPlay();
            setTimeout(startMuralsAutoPlay, 4000);
        });
    }
    
    if (muralsPrevBtn) {
        muralsPrevBtn.addEventListener('click', () => {
            prevMuralSlide();
            stopMuralsAutoPlay();
            setTimeout(startMuralsAutoPlay, 4000);
        });
    }
    
    // Indicator click events
    muralsIndicators.forEach((indicator, index) => {
        indicator.addEventListener('click', () => {
            goToMuralSlide(index);
            stopMuralsAutoPlay();
            setTimeout(startMuralsAutoPlay, 4000);
        });
    });
    
    // Touch/swipe support for mobile
    let muralsStartX = 0;
    let muralsCurrentX = 0;
    let muralsIsDragging = false;
    
    muralsCarouselWrapper.addEventListener('touchstart', (e) => {
        muralsStartX = e.touches[0].clientX;
        muralsIsDragging = true;
        stopMuralsAutoPlay();
    });
    
    muralsCarouselWrapper.addEventListener('touchmove', (e) => {
        if (!muralsIsDragging) return;
        e.preventDefault();
        muralsCurrentX = e.touches[0].clientX;
    });
    
    muralsCarouselWrapper.addEventListener('touchend', () => {
        if (!muralsIsDragging) return;
        
        const diffX = muralsStartX - muralsCurrentX;
        const threshold = 50;
        
        if (Math.abs(diffX) > threshold) {
            if (diffX > 0) {
                nextMuralSlide();
            } else {
                prevMuralSlide();
            }
        }
        
        muralsIsDragging = false;
        setTimeout(startMuralsAutoPlay, 4000);
    });
    
    // Pause auto-play on hover
    const muralsCarouselContainer = document.querySelector('.murals-carousel-container');
    if (muralsCarouselContainer) {
        muralsCarouselContainer.addEventListener('mouseenter', stopMuralsAutoPlay);
        muralsCarouselContainer.addEventListener('mouseleave', startMuralsAutoPlay);
    }
    
    // Initialize murals carousel
    updateMuralsCarousel();
    startMuralsAutoPlay();
}

// Video Carousel Functionality
function initVideoCarousel() {
    const videoCarouselWrapper = document.querySelector('.video-carousel-wrapper');
    const videoSlides = document.querySelectorAll('.video-slide');
    const videoPrevBtn = document.getElementById('videoCarouselPrev');
    const videoNextBtn = document.getElementById('videoCarouselNext');
    const videoIndicators = document.querySelectorAll('.video-indicators .indicator');
    
    if (!videoCarouselWrapper || videoSlides.length === 0) return;
    
    let videoCurrentSlide = 0;
    let videoAutoPlayInterval;
    
    function updateVideoCarousel() {
        const translateX = -videoCurrentSlide * 100;
        videoCarouselWrapper.style.transform = `translateX(${translateX}%)`;
        
        // Update active slide
        videoSlides.forEach((slide, index) => {
            slide.classList.toggle('active', index === videoCurrentSlide);
        });
        
        // Update indicators
        videoIndicators.forEach((indicator, index) => {
            indicator.classList.toggle('active', index === videoCurrentSlide);
        });
        
        // Pause all videos except current
        videoSlides.forEach((slide, index) => {
            const video = slide.querySelector('video');
            if (video) {
                if (index !== videoCurrentSlide) {
                    video.pause();
                }
            }
        });
    }
    
    function nextVideoSlide() {
        videoCurrentSlide = (videoCurrentSlide + 1) % videoSlides.length;
        updateVideoCarousel();
    }
    
    function prevVideoSlide() {
        videoCurrentSlide = (videoCurrentSlide - 1 + videoSlides.length) % videoSlides.length;
        updateVideoCarousel();
    }
    
    function goToVideoSlide(slideIndex) {
        videoCurrentSlide = slideIndex;
        updateVideoCarousel();
    }
    
    function startVideoAutoPlay() {
        videoAutoPlayInterval = setInterval(nextVideoSlide, 8000);
    }
    
    function stopVideoAutoPlay() {
        clearInterval(videoAutoPlayInterval);
    }
    
    // Event listeners
    if (videoPrevBtn) {
        videoPrevBtn.addEventListener('click', () => {
            prevVideoSlide();
            stopVideoAutoPlay();
            setTimeout(startVideoAutoPlay, 5000);
        });
    }
    
    if (videoNextBtn) {
        videoNextBtn.addEventListener('click', () => {
            nextVideoSlide();
            stopVideoAutoPlay();
            setTimeout(startVideoAutoPlay, 5000);
        });
    }
    
    videoIndicators.forEach((indicator, index) => {
        indicator.addEventListener('click', () => {
            goToVideoSlide(index);
            stopVideoAutoPlay();
            setTimeout(startVideoAutoPlay, 5000);
        });
    });
    
    // Touch/swipe support for mobile
    let videoStartX = 0;
    let videoCurrentX = 0;
    let videoIsDragging = false;
    
    videoCarouselWrapper.addEventListener('touchstart', (e) => {
        videoStartX = e.touches[0].clientX;
        videoIsDragging = true;
        stopVideoAutoPlay();
    });
    
    videoCarouselWrapper.addEventListener('touchmove', (e) => {
        if (!videoIsDragging) return;
        e.preventDefault();
        videoCurrentX = e.touches[0].clientX;
    });
    
    videoCarouselWrapper.addEventListener('touchend', () => {
        if (!videoIsDragging) return;
        
        const diffX = videoStartX - videoCurrentX;
        const threshold = 50;
        
        if (Math.abs(diffX) > threshold) {
            if (diffX > 0) {
                nextVideoSlide();
            } else {
                prevVideoSlide();
            }
        }
        
        videoIsDragging = false;
        setTimeout(startVideoAutoPlay, 5000);
    });
    
    // Pause auto-play on hover
    const videoCarouselContainer = document.querySelector('.video-carousel-container');
    if (videoCarouselContainer) {
        videoCarouselContainer.addEventListener('mouseenter', stopVideoAutoPlay);
        videoCarouselContainer.addEventListener('mouseleave', startVideoAutoPlay);
    }
    
    // Pause auto-play when video is playing
    videoSlides.forEach(slide => {
        const video = slide.querySelector('video');
        if (video) {
            video.addEventListener('play', stopVideoAutoPlay);
            video.addEventListener('pause', () => {
                setTimeout(startVideoAutoPlay, 2000);
            });
            video.addEventListener('ended', () => {
                setTimeout(startVideoAutoPlay, 1000);
            });
        }
    });
    
    // Initialize video carousel
    updateVideoCarousel();
    startVideoAutoPlay();
}

// Branding Carousel Functionality
function initBrandingCarousel() {
    const brandingCarouselWrapper = document.querySelector('.branding-carousel-wrapper');
    const brandingSlides = document.querySelectorAll('.branding-slide');
    const brandingPrevBtn = document.getElementById('brandingCarouselPrev');
    const brandingNextBtn = document.getElementById('brandingCarouselNext');
    const brandingIndicators = document.querySelectorAll('.branding-indicators .indicator');
    
    if (!brandingCarouselWrapper || brandingSlides.length === 0) return;
    
    let brandingCurrentSlide = 0;
    let brandingAutoPlayInterval;
    
    function updateBrandingCarousel() {
        const translateX = -brandingCurrentSlide * 100;
        brandingCarouselWrapper.style.transform = `translateX(${translateX}%)`;
        
        // Update active slide
        brandingSlides.forEach((slide, index) => {
            slide.classList.toggle('active', index === brandingCurrentSlide);
        });
        
        // Update indicators
        brandingIndicators.forEach((indicator, index) => {
            indicator.classList.toggle('active', index === brandingCurrentSlide);
        });
    }
    
    function nextBrandingSlide() {
        brandingCurrentSlide = (brandingCurrentSlide + 1) % brandingSlides.length;
        updateBrandingCarousel();
    }
    
    function prevBrandingSlide() {
        brandingCurrentSlide = (brandingCurrentSlide - 1 + brandingSlides.length) % brandingSlides.length;
        updateBrandingCarousel();
    }
    
    function goToBrandingSlide(slideIndex) {
        brandingCurrentSlide = slideIndex;
        updateBrandingCarousel();
    }
    
    function startBrandingAutoPlay() {
        brandingAutoPlayInterval = setInterval(nextBrandingSlide, 5000);
    }
    
    function stopBrandingAutoPlay() {
        clearInterval(brandingAutoPlayInterval);
    }
    
    // Event listeners
    if (brandingPrevBtn) {
        brandingPrevBtn.addEventListener('click', () => {
            prevBrandingSlide();
            stopBrandingAutoPlay();
            setTimeout(startBrandingAutoPlay, 4000);
        });
    }
    
    if (brandingNextBtn) {
        brandingNextBtn.addEventListener('click', () => {
            nextBrandingSlide();
            stopBrandingAutoPlay();
            setTimeout(startBrandingAutoPlay, 4000);
        });
    }
    
    // Indicator click events
    brandingIndicators.forEach((indicator, index) => {
        indicator.addEventListener('click', () => {
            goToBrandingSlide(index);
            stopBrandingAutoPlay();
            setTimeout(startBrandingAutoPlay, 4000);
        });
    });
    
    // Touch/swipe support for mobile
    let brandingStartX = 0;
    let brandingCurrentX = 0;
    let brandingIsDragging = false;
    
    brandingCarouselWrapper.addEventListener('touchstart', (e) => {
        brandingStartX = e.touches[0].clientX;
        brandingIsDragging = true;
        stopBrandingAutoPlay();
    });
    
    brandingCarouselWrapper.addEventListener('touchmove', (e) => {
        if (!brandingIsDragging) return;
        e.preventDefault();
        brandingCurrentX = e.touches[0].clientX;
    });
    
    brandingCarouselWrapper.addEventListener('touchend', () => {
        if (!brandingIsDragging) return;
        
        const diffX = brandingStartX - brandingCurrentX;
        const threshold = 50;
        
        if (Math.abs(diffX) > threshold) {
            if (diffX > 0) {
                nextBrandingSlide();
            } else {
                prevBrandingSlide();
            }
        }
        
        brandingIsDragging = false;
        setTimeout(startBrandingAutoPlay, 4000);
    });
    
    // Pause auto-play on hover
    const brandingCarouselContainer = document.querySelector('.branding-carousel-container');
    if (brandingCarouselContainer) {
        brandingCarouselContainer.addEventListener('mouseenter', stopBrandingAutoPlay);
        brandingCarouselContainer.addEventListener('mouseleave', startBrandingAutoPlay);
    }
    
    // Initialize branding carousel
    updateBrandingCarousel();
    startBrandingAutoPlay();
}
