metaf

Css ничего не знает о вашем и контенте, и стили в зависимости от ширины блока (не путать в вьюпортом) задавать нельзя.
Есть решения на js, например, marcj.github.io/css-element-queries

Вообще, я бы считала не высоту, а выстроила все пункты в один ряд (display: inline-block; white-space: nowrap или display:table-cell), а потом считала, длиннее ли меню контейнера и добавляла ему класс. Опираться на высоту сломанного меню это как-то... странно...
В любом случае, есть небольшие библиотеки а-ля медиа-запросы для элемента, а не вьюпорта: elementqueries.com . Возможно, это вам подойдет. Потому что если делать через js самостоятельно, то нужно будет вешать триггер на ресайз и всё такое прочее, что несколько усложнит вам задачу.

У Lynda есть курсы photoshop/illustrator for web design часа на 3-4 каждый, этого хватит с головой. Темы там рассматриваются поверхностно, но больше вам и не нужно, основной дизайнерский инструмент фронтендщика все же браузер.

В будущем такие штуки &__header превратятся в АД, если у вас проект разрастется на десятки отдельных .scss не будет sourcemap. Потому что найти нужный элемент будет нереально.

Почему не можете использовать flexbox? Если из-за поддержки, проверяйте через modernizr и всем неподдерживающим браузерам делайте где возможно через float/display:inline-block+rtl-ltr flexbox polyfill или любые другие хаки css и оставшимся - через jQuery, так % людей, видящих прыгающие или мигающие блоки при загрузке будет ниже.
Правда, и работы будет в намноооого больше. Ну и обязательно все это обсудите вначале с заказчиком, потом с дизайнером. Я бы за такое раза в 4 больше эстимейт дала)) Может, действительно проще перерисовать или отдельный мобильный сайт сделать?

Я согласна с многими комментариями, что верстальщик - это просто верстальщик, но... Задачи, которые вы ставите - очень простые, показать верстальщику как это работает - и все! Пару-тройку раз ответить на вопросы, если не разобрался с первого раза. Я, как "верстальщик" это начала сама уже понимать, я использую zurb foundation, а к нему в довесок сейчас идет panini (шаблонизатор) - это же просто рай, насколько же это облегчает работу именно верстальщика! Не нужно копипастить эти ненавистные header footer по сто раз, не нужно забивать каждый раз кучу данных, которые загрязняют страницу и мешают разглядеть структуру, их можно просто вынести в отдельный файл и накидать циклов да условий. Этим облегчить работу И себе, И программистам. И ДА, верстальщик должен знать про циклы, условия и переменные - они все есть в scss, если он их не использует, верстая "100500 html-страниц", то он плохой верстальщик.

можно еще вот так, codepen.io/olgar/pen/XKbKoL, но поддержка только частичная caniuse.com/#search=mix-blend-mode

Грузите контент модального окна через ajax www.bootply.com/63523

Прекратите уже мучить себя этими вычислениями, используйте susydocs.oddbird.net и создавайте хоть 50 различных layout-ов.