Почему амперсант в SCSS имеет меньшую спецификацию?
В SCSS имеется возможность прописывать media прямо внутри класса. Попробуй, это намного удобнее
Потому что первый вариант компилтся в:
.promo .promo__wrapper {
  text-align: center;
}
а второй в:
.promo__wrapper {
  text-align: center;
}
css.yoksel.ru/specifity