<div class="container__col container__col_md_4 container__col_xs_6">Блок 1</div>
. container__col {
@extend .col-6 .col-md-4
}
и я объяснил почему.
.row.news-list {}
.row.product-list {}
Когда на бэкенде пишут код, тоже плодятся всевозможные хелперы, утилсы и прочие помогаторы, в которые выносят общий функционал, который может быть переиспользован.
<nav>
<ul>
</li></a> * N
</li class="active"></a>
</ul>
</nav>
+ аргументы в виде микроразметок и т.д.<div class="main-menu">
</a> * N
</a class="active">
</div>
Упрощение и лаконичность в разметке тянет за собой усложнение в стилях.