How to properly organize BEM markup?

Question

BEM

It is semantically correct to write directly in the section heading. At the same time, it is considered that for the section block you need to use it when you can give a meaningful name, i.e. essentially a class for section. But there are situations when there is a logical block, but it needs several outer wrappers, as in this case

<div class="page-main__banner banner">
    <section class="banner__content">
      <h1 class="banner__title">Быстрая доставка цветов</h1>
      <ul class="banner__advantages">
        <li class="banner__advantage banner__advantage--rose">
          Ежедневный привоз свежих цветов
        </li>
        <li class="banner__advantage banner__advantage--ruble">
          Низкие цены за счет больших поставок
        </li>
        <li class="banner__advantage banner__advantage--car">
          Быстрая круглосуточная доставка
        </li>
      </ul>
    </section>
  </div>

The first wrapper is for the full-width background. The second is the actual information. But I get a meaningful name for the wrapper, and section is, in fact, a block element. But at the same time, I cannot separate the section itself into a separate block, because the background is also part of the block. I apologize if I didn't write clearly. And please forgive me if this is a stupid question.

Answer 1

So everything seems to look fine, only in the tag headings should go from h2-h6, as I remember.
Well, you can look at the working code, maybe everything is easier to beat there))