Как рассчитать высоту каждого экрана лендинга?
Кстати вот это очень правильный и важный вопрос, по которому информации в инете пренебрежительно мало. Куда не сунься - все дают советы насчет ширины экрана, а вот насчёт высоты советов почти что и нет. Есть что-то вроде "делай не выше 600рх" и можно сказать всё.
Причина такому положению вещей простая - замучаешься ты так тонко настраивать дизайн. Вот ты озвучил 4 ширины - моник, ноут, планшет и мобила. Теперь помножь это на варианты высот. А если еще вспомнить, что окошко браузера юзеры могут ресайзить - рехнёшься. Поэтому и советуют делать высоту для настольных браузеров в районе 600-800рх, а для мобильных - 400-500.
Чтобы упростить задачу - сокращаем количество вариантов ширины. Делаешь только два - для больших экранов (моник, ноут, планшет - 1000-1200рх) и для маленьких (смартфоны - 320-360, эппл со своими 375 тут идёт лесом). Соответственно первой ширине присваиваешь высоту 600-800, а второй - 400-50. 
То, что советует Вадим Белкин возможно лишь при хорошом взаимопонимании дизайнера и разработчика, и непрерывном контроле качества результата. А иначе попросишь разраба сделать вьюху резиновой, да и спрессуется всё в итоге, если окошко браузера будет чересчур малым для имеющегося на сайте контента. В таких случаях пусть уж лучше будет лишний скролл.
В CSS есть единицы измерения vw (ширина вьюпорта) и vh (высота вьюпорта). Это лучше чем под каждый экран в пикселях задавать, один раз задав высоту блоку width: 100vh он у вас на любом экране будет равен 100% высоты вьюпорта. Почитайте, например тут
Конечно же если вам подходит их поддержка браузерами