Столько комментов и добавить то нечего)
БЭМ это модульность. Каждая верстка это словно создание фреймворка наподобие бутстрап. Если лендинг секций на 10 к примеру верстаешь, то сверстал по БЭМ секции 2-3 а дальше только классы расставляй готовые и иногда модификаторы добавляй. Или многостраничник, основные элементы сверстал и так же только классы расставляй, стили уже готовы.
А если смотреть HTML код с правильным БЭМ, то получается как самодокументируемый код в программировании. Все ясно из названий классов и видно где частью вёрстки независимый блок с элементами внутри. Видно состояние элементов, типа
menu__link_active
card_shadow
button_red
section__title_blue
В вашем примере результат идиотизма верстальщика, ему можно смело руки оторвать.
А Sass это просто более удобая работа со стилями. Препроцессоры не дают модульности в работе над проектом. Неоспоримые удобства - однозначно, сам сасс использую и написал свою адаптивную сетку, когда вся адаптивка происходит в стилях, а не как в бутстрап расставлением кучи классов и созданием большой вложенности а результат это каша в разметке.
Но БЭМ это другое. Между прочим он идеально сочетается с возможностями препроцессоров!
У сожалению у вас получилось как в анекдоте.
- Гоги, тебе нравиться Шакира?
- Нет
- А где ты ее слышал?
- Мне Моги напел
Вам доказывали какую-то чушь, выдавая ее а БЭМ. А потом удивляешься, почему люди БЭМ не любят. Да вот такие умники своим бредом пугают людей, а те в свою очередь думают что это на самом деле БЭМ.
Сожалею о вашем таком неудачном знакомстве с очень хорошим и мудрым изобретением.