Как правильно разбить шапку на блоки?
Лично я сделал бы внутри блока .header еще 4 блока: логотип, телефон, социалки и меню.
Как-то приблизительно вот так:.header
    .header__logo
        .logo
    .header__phone
        .phone
    .header__social
        .social
            .social__link .social__link--instagram
            .social__link .social__link--vkontakte
            .social__link .social__link--facebook
    .header__menu
        .menu
            .menu__item .menu__item--active
            .menu__item
            .menu__item
Я создаю элемент .header__logo и внутри него уже блок .logo - вполне гибко выходит: раскидываешь внутри шапки ее элементы как надо, а у блока независимо выставляешь свои стили.
Объединять классы в один элемент я бы не стал