Welcome to the Forum!
Here is one solution to your question:
Hype Demo Project: stickyElement-bottomPin_JHSv3a.hype.zip (25.0 KB)
Live Demo here.
The key aspect in this Demo is the CSS scripting found in the “Head HTML”. The class(es) for each Element/Group is set in the “Identity Inspector”.
position: fixed !important;
height: 100vh !important;
min-height: 700px !important;
The rest is just a matter of grouping the proper elements together and creating the "Flexible Layout" settings (found in the "Metrics Inspector") for each Element or Group as needed.
Side Note: I skimmed the article You linked to - I look forward to reading it in full - looks interesting!