У тебя проблемы с размерами блоков. Я не специалист, но выявил пару проблем.
1. У body стоит margin 8px, зачем?)
2. Зачем ты используешь проценты в padding'ax? Это плохая практика
3. У тебя сайт не может подстроиться под ширину экрана, на всех разрешениях появляться горизонтальная полоса. Там .footer из-за 100vw ломает тебе вёрстку.
4. Зачем ты используешь разные системы измерения в пределах одного блока? vh,px,% - выбери что-то одно или лови тонну трудно отлаживаемых багов на проде.
5. Такие выражения вообще убирай, они не имеют смысла и не будут применяться.
min-height: 100vh;
6. Не используй пустые теги для семантической разбивки. На практите пустые теги без нормализаторов могут давать нежелательные отступы.
#Неправильно
<section>
<div class="footer">
<div class="bottom_footer"></div>
</div>
</section>
#Правильно
<section class="footer">
<div class="bottom_footer"></div>
</section>