Hover Interaction Overriding Scroll into View Interaction

Hey everyone,

I’m trying to set up two interactions on the “Work" navigation link on my homepage. First, when you scroll down my homepage to my case studies, I want “Work" to change color and stay highlighted. When you scroll back up I want it to go back to its original color. I did this by creating a DIV block trigger and using Scroll into View interactions (Work Trigger Scroll In/Work Trigger Scroll Out).

The second interaction is changing the hover state on the “Work" navigation link. I did this in the interaction panel as well (Work Hover On/Work Hover Off).

Everything works as expected until you hover over “Work” while it is already highlighted at the bottom of the page. When the mouse leaves “Work”, it goes back to its original color. I want it to still stay highlighted when the page is at that position. It’s like the Hover interaction is overriding the Scroll into View interaction. Is there any way to make sure “Work” stays highlighted? Any help would be greatly appreciated!

Thanks in advance!!


Here is my public share link: LINK
(how to access public share link)