Mobile H1 header text getting cut off by mobile header bar

Hi, my H1 header text was getting cut off on mobile by the header bar. To fix this I moved it down a little but now it looks great for mobile and terrible for desktop because the header text is moved way too far down.

I am not sure what to do. 

I have also been finding that trying to vertically space out blocks by separating them by 1 or 2 rows in the grid does't seem to work. The space disappears either on mobile or desktop so two blocks are on top of each other. 

The only thing that seems to work is adding hitting the return key and adding a blank line above or below header text but then that seems to add a lot of padding again either in mobile or desktop. 

I feel like you just can't win. 

Right now I just need a solution to have my H1 header not be cut off by the header bar on mobile and on desktop to not have 200px or more above my H1 header as a result. 

Maybe there's a way to put padding only in mobile below the header bar?

Please help. 

Hi,

Can you share link to this page?