Правильно ли я верстаю, используя методологию БЭМ?
Все так делают после прочтения официальной документации))
Но все на много проще. Представь себе что у тебя в макете есть кнопки перехода на другие страницы.
Значит нужно что-то вроде <a href='#'>Кнопка</a>, но оно не очень похоже на кнопку, поэтому:на первом уровне тебе нужно найти все общее между всеми кнопками в макете и создать элементарную bem сущность button.<a class='button' href='#'>Кнопка</a>// COMMON
.button{
  display: inline-block;
  padding: 0.5em 1em;
  text-align: center;
  text-decoration: none;
}
дальше, к примеру видим, что в макете есть кнопки двух размеров - большие и маленькие, соответственно:// SIZE
<a class='button button_size_m' href='#'>Кнопка</a>
<a class='button button_size_l' href='#'>Кнопка</a>

// COLOR
<a class='button button_primary' href='#'>Кнопка</a>
<a class='button button_secondary' href='#'>Кнопка</a>/*        _MODS_       */
// SIZE
.button{
   &_size_s{
     font-size: 1rem;
     }
   &_size_l{
     font-size: 2rem;
     }
}

// COLOR
.button{
  &_primary{
    background: #607D8B;
    color: #ffffff;
    }
  &_secondary{
    background: #8BC34A;
    color: #ffffff;
    }
}
и на последнем уровне переопределения мы имеем большую кнопку по центру хедера, где ее родитель за руку ставит в то место, где она должна стоять))<a class='button button_primary button_size_l header__button' href='#'>Кнопка</a>// PARENT__BLOCK
.header{
    &__button{
      display: block;
      width: 200px;
      margin: 0 auto;
     }
}
Далее примерно такой же подход ко всем остальным блокам.
определил общее > доопределил/переопределил варианты > при необходимости родителем расставил по местам и косишь как будто ты не верстальщик, а rонструкторо-собиральщик :)
codepen.io/kovbassa/pen/ObrqZv
centerbox
glenbrook-row
glenbrook-col-12
нужно интегрировать в свои классы используя миксины в less/sass/stylus
Отговорки на счет того, что ты придумал новую версию БЕМ не катят