.nav-links {
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

#mobile-hero {
    display: none;
}

@media (max-width: 767px) {
    /*
     * Ensures the links are stacked vertically on mobile, 
     * overriding the default inline 'flex' or 'md:flex-row' behavior.
     */
    #main-hero {
        display: none;
    }

    #mobile-hero {
        display: block; /* Stacks the menu items */
    }
}