「IntersectionObserver」を使用したスクロール時に下線がひかれるアニメーション

JSの「IntersectionObserver」を使用してテキスト要素がビューポートに入ったときに下線を引くアニメーションを開始しています。
下線は「linear-gradient」を使用し文字に重なるように引いてます。
また「scroll-snap-type: y mandatory;」で垂直方向(y)にスクロールを強制的(mandatory)に止めるようにしています。

関連パーツ