.bg-hero {
    background-image: url('/assets/images/cityhall.jpg'); /* this path is correct from public folder */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 80vh; /* ensure it takes up space */
}

.bg-overlay {
    background-color: rgba(0, 0, 0, 0.5);
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.animate-fadeIn {
    animation: fadeIn 1s ease-out;
}
#loader {
    transition: opacity 5.5s ease;
}