50% header background color

Hey,

I'm trying to create a similar style h1 heading to this site: https://www.thebalance.com/key-differences-between-trading-vs-investing-4588472

Tried to inspect and copy/paste their CSS to:

.page-hero h1 {

But this only seems to work when the text fits on the same line, if not it just colors the bottom half of the text like this: https://www.evernote.com/l/AGIkxeqU-0VAV41rcI63vsXtk1ksZVkY97M

Any help would be much appreciated :)