Scroll Animations

• When the top of an item enters the viewport, it will get a CSS variable "--viewport-position: 0%".

• When the bottom of an item leaves the viewport, it will stay at CSS variable "--viewport-position: 100%".

• All animation in between 0-100 can be created by CSS transforms.