Scroll animations not working with anchor links

Hi all,
So, some context: I want my page to have scroll snapping so I followed a tutorial that includes a scroll-snap-wrapper. The scrolling worked great when used with a mouse/pad, however, my anchor links did not work. So I got ChatGPT to write me some JS to get them to work. Great, now scrolling with the mouse works and my anchor links work. BUT my scroll animations do not work when using the anchor links. I need to nudge the page slightly down with the mouse to get them to work. I’m so close, it’s just this one thing. I feel like there is something slightly off in my structuring that is not allowing the animations to trigger. Can anyone help?

Here is my public share link:

Very strange. As you stated, after I slightly move the mouse I get the desired results, even on the second scroll through, or refreshing the page everything works as expected. It’s something about the very first page load. I don’t see anything apparently wrong in your structure.

You’re so close, I hate to send you down another path but I currently use the following code for snap scrolling. Goes in the body element in the page settings. This sample targets elements with the class “.sections” which I’ve used as a wrapper element for each of my styled sections.

<script src=""></script>

$(function() {
            section : ".sections",

Thank you. Yes I believe the scroll-snap-wrapper tutorial that I used was an alternative to Scrolify because Scrolify has some jitter to it. I’d have to restructure a bunch of what I’ve built so far so I’m trying to exhaust all options on this first.