Given an example html snippet that I cannot change, is there a **CSS only** approach to make text before <br> as bold and after <br> as normal?

I have this html

<div class="html-input goto-card-label">Header <br> Subtitle</div>

CSS is making the entire label bold:

.goto-card-label {
  font-weight: bold;
}

Is there a CSS only approach to make the text after the <br> tag as font-weight: normal; without changing the html at all?

Note: I likely cannot use the content css property since the text will not always be what I put in the example.

>Solution :

You can approach your problem using ::first-line pseudo-element to the first line of the text within div element.

.goto-card-label::first-line {
  font-weight: bold;
}

<div class="html-input goto-card-label">Header <br> Subtitle</div>