Вадим В

Я не встречал чтобы была необходимость создавать так много брейкпоинтов, что-то вы делаете не так. Между брейкпоинтами должна быть резина, как правило есть 3-4 брейкпоинтов - Для десктопов, лептопов, таблетов и мобильных. В промежутках между брейкпоинтами сайт должен быть резиновым.

По поводу залезания, то там на body добавляется overflow: hidden; и padding-right: 17px; чтобы компенсировать отсутствие полосы скролла... но так как на header position: fixed; то на него это не распространяется. Видимо на header так же нужно добалять стиль padding-right: 17px; при открывании модального окна.

По поводу закрывания модального окна меню после скролла до анкора, нужно убирать класс active после завершения скрола до анкора, но так как у тебя нет даже анимации скролла, то просто по событию клик по ссылке, должен убираться класс active у menu trans_800. Но так как я полагаю что ты пользуешься библиотеками и разными плагинами, то нужно смотреть как это настроить в документации...

Наверное ты имеешь ввиду это history.pushState(state, title, url);