I tried out some further tweaks to reduce the change in aspect ratio for the header.
In the css for #header add this for responsive text size.
font-size: calc(0.6em + 2vw);
But do keep the other size setting too (must come before this one), for old browsers where the above does not work.
To further reduce the aspect shift, make the text margins more responsive.
#header h1, #header p { margin: 2% 0 }
There will still be a change in aspect, but it is less than before.
If you don’t like that, you have two choices:-
a. Have a fixed aspect full image and text that is too small to be readable.
b. Suffer some cropping of the background image and have responsive text readable on any screen.
I will leave it to your judgement which is best. 