How to write a class according to the BEM methodology?

Question

css

<section class="banner-top container">
    <div class="banner-top__bg"></div>
    <div class="banner-top__before">
        <p class="ico_s point">text</p>
    </div>
    <div class="banner-top__middle">
        <h1>title</h1>
        <p>text</p>
    </div>
    <div class="banner-top__after">
        <div class="slider-logo owl-carousel">
                <div class="slider-logo__item">
                    <a target="_blank" href="<?= $item["link"] ?>">
                        <img src='./img/.png' alt='img' srcset='./img/svg/.svg'>
                    </a>
                </div>
        </div>
    </div>
</section>

how to name the classes correctly, this block confuses me and it seems to me that the classes are not named according to Bam, in general, write your structure and point out errors, I will be glad !!!

Answer 1

Paste the code here: https://yoksel.github.io/html-tree/
The service will show where you have problems