// Wait for the DOM to be fully loaded
document.addEventListener('DOMContentLoaded', function() {
    // Add a fade-in effect to the main elements
    const elements = [
        document.querySelector('.logo'),
        document.querySelector('.coming-soon'),
        document.querySelector('.social-links'),
        document.querySelector('.opening-hours'),
        document.querySelector('.events-note')
    ];
    
    // Apply fade-in animation with delay for each element
    elements.forEach((element, index) => {
        if (element) {
            element.style.opacity = '0';
            element.style.transition = 'opacity 1s ease-in-out';
            
            // Stagger the animations
            setTimeout(() => {
                element.style.opacity = '1';
            }, 300 * index);
        }
    });
    
    // Add a subtle hover effect to the logo
    const logo = document.querySelector('.logo');
    if (logo) {
        logo.addEventListener('mouseover', function() {
            this.style.transform = 'scale(1.05)';
            this.style.transition = 'transform 0.3s ease';
        });
        
        logo.addEventListener('mouseout', function() {
            this.style.transform = 'scale(1)';
        });
    }
});