Is BEM correct?

Question

css

Hello! Please rate the quality of BEM css and how well I combine it with sass. As you can see, through a hyphen, directly by concatenation, I attach, as it were, sub-elements chtoli. As I understand it, it’s quite, because if we are not going to use some kind of header menu elsewhere, then we should not make it a separate block, so the menu item will be like this - header__menu-item. Am I understanding this correctly? If not, then how to give a name to this menu, if we say I have 3 types of menus on the page? You won’t write menu-1, menu-2, etc. But if you bind its position to the class name: menu-sidebar, menu-top, menu-bottom, etc. then the meaning is lost. Please clarify my misunderstandings..

.section-videos {
  &__slider {
    margin-top: 20px;
  }

  &__box {
    text-align: center;
    padding: 16px 18px 40px 18px;
    background: #121d44;

    &-title {
      color: #fff;
      font-size: 28px;
      margin-left: 68px;
      position: relative;
      display: inline-block;
      padding-top: 12px;
      margin-bottom: 24px;
    
      &_alloc {
         background: #545543;
}

      &:before {
        content: '';
        position: absolute;
        top: 0;
        left: -68px;
        width: 50px;
        height: 56px;
        background: url("../img/logo.png");
        background-size: 100% 100%;
      }
    }

    &-text {
      display: inline-block;
      color: #fff;
      font-size: 24px;
      margin-bottom: 34px;
    }
  }
}

Answer 1

I wouldn't do a third level of nesting (excluding before, after and modifiers)... you save a bit in the selector, but there's a lot of white space in the substitutions and in general the original BEM styles are pretty flat.

Answer 2

Wrong
Minimum
a1 .section-videos
a2 .section-videos__slider
a3 .section-videos__text
a4 .section-videos__title
The second block is optional (in this case a3 and a4 are not needed because there are b2 and b3)
b1 .section-video -slider b2
.section-video-slider__text
b3 .section-video-slider__title