Stats Preview Card - SCSS, Grid, CSS Animations

What was originally a break from a larger project turned into a fun animation experiment! I spent an ungodly amount of time messing around with cubic-bezier curves. 😅 Hopefully they don’t mess up the screenshot.🤞 (Edit: Yep, they did. But only a little! 😁) The statistics are only animated on the desktop layout, as I felt it was a bit too much on mobile.

First time implementing prefers-reduced-motion to prevent animations for those who prefer it reduced. It seems to work when I test it, but please let me know if there’s any goofiness.

Also first time using mix-blend-mode, which seemed to work well in combo with opacity to get close (I hope) to the header image design.

Shoutout to @ApplePieGiraffe for inspiring me to play around more with animations.

As always, any and all feedback is greatly appreciated!