body {
    font-family: 'Inter', sans-serif;
    scroll-behavior: smooth;
}
.hero-bg {
    background-image: linear-gradient(rgba(0, 40, 104, 0.8), rgba(0, 40, 104, 0.6)), url('/assets/imgs/herobg.png');
    background-size: cover;
    background-position: center;
}
#heroLogo {
    width: 220px;
    display: block;
    margin: 50px auto;
    border-radius: 40px;
}

@media (max-width: 768px) {
    #heroLogo {
        width: 176px;
        margin: 20px auto;
    }
}
.animate-fade-in-up {
    animation: fadeInUp 0.8s ease-out forwards;
    opacity: 0;
    transform: translateY(20px);
}
@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }

section {
    scroll-margin-top: 80px;
}