Header element issues in responsive Design

Hi there,

I am facing issues with the position of a page header element and hero sections which have been built in Beaver Builder.
When the site is viewed in tablets/small laptops the site does not seem to have the required Offset Site Header Height working - it seems like the page heroes get swallowed up.
I have set the length to be 140px in standard desktop, but I don't see any option for tablets/small lappies.
Have you any suggestions on how I can keep these elements centered (ie. The quote/title which appears on the page) irrespective of screen size?
For example: https://riverpsychotherapy.com/my-therapy-approach/
Looks great on big and normal screens but bunches up on others.

Many thanks!
John