Home Page Height Fix

This seems to be more tricky than I can manage – 

On my site alinahetz.com I made the home page full screen, fixed page - as in it *shouldn't* scroll up or down. Just sort of be one full screen page. 

It works on desktop and I figured out how to make it that way on iPhone but it doesn't seem to apply to all. My media max-width is set to 767px, changing it to 640px as I also see used a lot does nothing. The page is displayed fixed and full screen on my iPhone 11 Max and on a 14 Pro. On standard iPhone 14 the image or page shows up short - so there's a white area on the bottom.

Instead of me changing vh back and forth - is there a code that would automatically adjust the height of my home page to all mobile screens to sort of fit it exactly and not move around?

I know it's tricky but thanks in advance if anyone knows how to navigate this!

Right now the css I have running looks like this:

@media screen and (max-width: 767px) 
{ #feature
  {min-height: 78vh!important}
  }

(*putting 100vh makes the page too tall and it starts to scroll)

This did it! Thank you so much @tuanphan!