<span class="depth">A title <br> with many lines<br> of text</span>

.depth { 
  --d: .3em; /* control the depth */
  line-height: 2;
  
  padding-block: .1em calc(.1em + var(--d));
  padding-inline:.2em calc(.2em + var(--d));
  -webkit-box-decoration-break: clone;
          box-decoration-break: clone;
  background:
    conic-gradient(at right var(--d) bottom var(--d),
      #0004 37.5%,#0008 0 75%,#0000 0) 
    #d81a14; /* the main color */
  text-align: center;
}

body {
  font-family: sans-serif;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 30px;
  color: #fff;
}
h2 {
  font-size: 30px;
}