Путь адаптивности?
Что-то тут не так:@media all and (min-width: 601px) and (max-width: 991px) and (max-width: 768px)
В таком простом макете никак не ожидал увидеть километры такого вот кода. Наверняка, что-то вы намудрили тут:.header-top-contacts {
    width: calc(99.99% * 10/12 - (30px - 30px * 10/12)); }
  .header-top-contacts:nth-child(n) {
    float: left;
    margin-right: 30px;
    clear: none; }
  .header-top-contacts:last-child {
    margin-right: 0; }
  .header-top-contacts:nth-child(12n) {
    margin-right: 0; }
  .header-top-contacts:nth-child(12n + 1) {
    clear: left; }
  .header-top-socials {
    width: calc(99.99% * 2/12 - (30px - 30px * 2/12)); }
Ну а самая главная ошибка по адаптивности - не следование принципам Mobile first.
1. Разрешение 992 - 1032 последний пункт меню уехал в контент.
2. Сalc(для адаптивности норм, для кроссбраузерности насколько я знаю не очень).
3. Где меню для разрешения под мобильники?
4. Минимальной ширины нет. Это не обязательно, но желательно. 
Общая картина: мне нравится, если что-то исправлять(не учитывая calc), то проблем не возникнет.