html {
    scroll-behavior: smooth;
}

.hero-overlay {
    background: linear-gradient(rgba(26, 46, 68, 0.7), rgba(26, 46, 68, 0.85)),
                url('https://images.unsplash.com/photo-1464660756002-dd9f9a92b01b?q=80&w=2302&auto=format&fit=crop');
    background-size: cover;
    background-position: center;
}

.gallery-hero,
.history-hero {
    background:
        linear-gradient(rgba(26, 46, 68, 0.72), rgba(26, 46, 68, 0.92)),
        url('/images/flag-waving.webp');
    background-size: cover;
    background-position: center;
}

#mobile-menu {
    transition: transform 0.3s ease-in-out;
}

.hidden-menu {
    transform: translateX(100%);
}