Disable scroll until the Scroll animation within a "div" block is complete

For the Hero page, I have created a Lottie Animation: it is a curve which is growing when scrolling inside a div block. I would like to have to disable scrolling until viewer have scrolled until the end of the animation. How can I achieve that? Also is it possible to combine this with snap.scroll? At the moment it is going through all div and I want to be only part of the first one.

This is how far I got: Test

Please help…