Best way to do a custom underline on several lines

Hello guys,

For each Heading 1 of my articles in a particular collection, I would like to have this underline.

I tried two methods:

  1. Inner box shadow, but the underline has too much height compared to Figma screenshot (see below)

  2. I tried by applying a class that includes a gradient effect, but it only applies to the last row. How to have it applied on the entire title?


Here is my site Read-Only: LINK
(how to share your site Read-Only link)