Update: I have solved the issue
This line is in the themes CSS for the home page
.home .site-branding {
padding: 2.5em 0;
}
I added this to the @media screen and (max-width: 767px) section
.site-branding {
padding: 2.5em 0;
}
And now all pages headers behave the same on smaller browser resolutions
Thanks
Connor