Maybe, I should make the whole block aria-hidden and add a visually hidden element instead?

Yes, remove the svg from the accessibility tree and add the word "and" as visually hidden text.

<h2>
  <span class="first-line">
    Deadpool
    <svg width="53" height="64" class="inline" aria-hidden="true">
      <use href="#oleo-ampersand"></use>
    </svg>
    <span class="sr-only">and&nbsp;</span> 
    Wolverine:
  </span> 
  A StackOverflow Example
</h2>

.first-line {
  display: block;
}

Also, notice that I removed the br element after "Wolverine" and instead wrapped they first line of content in a span and gave it a display of block to get the line break you want. In browse mode, some screen readers will announce the heading as if it were two separate headings if you use the br element to force a line break, so this is a courtesy to prevent that.