Mobile Browser Height skipping/overlapping address bar

Hello. I am trying to figure out why when I load my site in my safari browser, on my iPhone 12 Pro, the bottom of my website hides behind the address bar and jumps up and down when I swipe it.

Ive tried setting it to 100% height and 100VH but it didn’t help.

any suggestions?

please refer to my screen recording(its a gif because I can’t upload the video) to see what I mean.

or click my website link below and see for yourself.
RPReplay_Final1681004367

I just want it to load properly in place. but if it can’t then I understand.


Here is my site Read-Only: LINK
(how to share your site Read-Only link)