Z Index Behaving Strangely

Hi All! Getting a funky behavioral issue that I can’t figure out. I’ve got a hero section that is sticky, and then a darkening DIV block that fades in as the page is scrolled. The sections below are meant to scroll in on top. On Safari, it will show the “episodes” blocks below content, and then after you mouse over the image animation, it pops on top. In fact, if I swap the sections, whichever is first will be normal, whatever is second and beyond will misbehave. Chrome works normally. Is this an error on my part or something else? Read only link below. Thanks!

Here is my site Read-Only: Webflow - Audio Wool

I ran into this on another design, and still haven’t fixed it. Anyone have any ideas?