Parallax Background images are meant to scale to fit the browser as best as possible without losing quality or looking too stretched. So when you add something with words that cover most of the image, it’s most likely going to get cut off depending on where they are positioned.
You could add background-size: contain !important; for the .front-page-1 in your responsive section so it is only applied to the first widget area and not the rest. That will make the image show up in full, but you’ll have a lot of space right under the image which you’ll need to account for in other areas of the code.
You could do that, or just have a completely separate image show up when in mobile responsive mode…..Specifically a smaller image designed for mobile devices.
.
