In Middle of View or On-Hover Element Highlight and Background Fade Out

Hi all,

I came across a really interesting effect that I'm wondering if Motion is able to do, or if it's better to do this via CSS?

https://share.zight.com/OAuZ0R5j

Essentially when you're scrolling down the page, and an element such as a Newsletter call-out element comes into the middle of the Viewport, suddenly the element in question is highlighted and everything else fades out to a dark transparency.

Then when you're past it, the page returns to normal.

This could be either when a visitor has the element:

1.) Just come into view, or

2.) Middle of the viewport, or

3.) Maybe even on-hover.

Depending on the use case / calibration.

Thank you.