Easybank Landing Page - Grid, CSS Animations, JS, SCSS

Hi, everyone! 👋 Glad to finally be done with this one(I hope)!

Questions:

• When I uploaded my solution to Vercel, I noticed that on desktop the background image on the hero was loading slower and showing up halfway through the animation. I used this handy solution from CSS Tricks to pause the animations until the images were loaded. It seems to have worked for me, but let me know if there’s any weirdness. 🤞 Are there better ways to go about delaying animations until all elements are loaded?
• For accessibility, I again made sure to put the mobile menu button inside the nav, added an aria-label, as well as used the aria-expanded attribute as I did in the Loopstudios solution. Is this the correct way to go about this? Could accessibility be improved? Any insight is appreciated.

“Extras”

• The mobile menu will close if clicking outside the menu or header (as well as by using the menu button, of course).
• I played around with CSS animations on the hero section, with different animations for mobile and desktop.

Thanks for taking the time to look at my solution! Feedback is greatly appreciated. 😄