Responsive Headline for mobile

The headlines (text that is in h1, h2 etc.) break words in mobile view. I tried word-break: keep-all; via child-theme.css but that creates other, even less desirable formatting problems.

What I want is this: text should be responsive and get smaller on mobile devices. Just like with pictures. Text size should decrease but formatting should stay the same. No breaks, no hyphens.