script.js

// Carousel functionality with infinite loop
let currentSlide = 0;
const carousel = document.getElementById('buildCarousel');
const items = carousel.querySelectorAll('.carousel-item');
const totalSlides = items.length;

function updateCarousel() {
    // Remove active class from all items
    items.forEach(item => item.classList.remove('active'));
    
    // Add active class to current item
    items[currentSlide].classList.add('active');
    
    // Calculate offset for centered carousel with visible adjacent items
    const itemWidth = 70; // percentage
    const offset = -currentSlide * itemWidth + 15; // 15% to center
    carousel.style.transform = `translateX(${offset}%)`;
}

function moveCarousel(direction) {
    // Calculate new slide index
    currentSlide += direction;
    
    // Loop around (infinite loop)
    if (currentSlide < 0) {
        currentSlide = totalSlides - 1;
    } else if (currentSlide >= totalSlides) {
        currentSlide = 0;
    }
    
    updateCarousel();
}

// Initialize carousel
updateCarousel();

// Auto-play carousel
let autoplayInterval = setInterval(() => {
    moveCarousel(1);
}, 5000);

// Pause autoplay on hover
carousel.parentElement.addEventListener('mouseenter', () => {
    clearInterval(autoplayInterval);
});

carousel.parentElement.addEventListener('mouseleave', () => {
    autoplayInterval = setInterval(() => {
        moveCarousel(1);
    }, 5000);
});

// Optional: Auto-play carousel
// Uncomment the following lines if you want automatic sliding
/*
let autoplayInterval;

function startAutoplay() {
    autoplayInterval = setInterval(() => {
        moveCarousel(1);
    }, 5000); // Change slide every 5 seconds
}

function stopAutoplay() {
    clearInterval(autoplayInterval);
}

// Start autoplay on load
startAutoplay();

// Stop autoplay when user interacts with carousel
carousel.addEventListener('mouseenter', stopAutoplay);
carousel.addEventListener('mouseleave', startAutoplay);
*/

// Smooth scroll 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) {
            target.scrollIntoView({
                behavior: 'smooth',
                block: 'start'
            });
        }
    });
});