CSS NOOB: Highlighted Text Effect

hi! ☻ so i made some custom css to create a text "highlight" effect on my newest project but you'll see from the picture that the "background" color is overlapping on the previous line of text. i know i need to maybe shorten the height of the actual highlight element but i'm kind of a noob with css. if you look at the second example i provided it looks perfect because the highlight goes BEHIND the second line of text and i love the look of the highlight kind of touching the next line of text {am i even making sense?!} any ideas??

here is the code i added for reference:

h2 strong {background: linear-gradient(to bottom, #F7F7EF 60%, #E6F09D 40%);} 

h1 strong {background: linear-gradient(to bottom, #F7F7EF 60%, #FECF97 40%);}

thanks in advance!

a lil help please! 🤪

Can you share link to page in screenshot? We can test code easier

Sent you the page via message! Ty.