• Give the section an attribute name of data-scroll-snap
• When we stop scrolling, the page will scroll to the nearest section with that attribute

<script src="https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/gsap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/ScrollTrigger.min.js"></script>
<script>
document.addEventListener("DOMContentLoaded", () => {
	gsap.registerPlugin(ScrollTrigger);
	document.querySelectorAll("[data-scroll-snap]").forEach((component) => {
		ScrollTrigger.create({
			trigger: component,
			start: "top top",
			end: "bottom top",
			scrub: true,
			snap: {
				snapTo: [0, 1],
				duration: { min: 0.05, max: 0.3 },
				delay: 0,
				ease: "power1.inOut"
			}
		});
	});
});
</script>