Я конечно не разбираюсь в свайпере, но там же вроде можно в настройках слайдера указывать свои элементы, которые будут отвечать за навигацию/пагинацию. В данном случае видно, что пагинация и навигация находятся на одном уровне, следовательно их можно поместить в общий блок и выводить его после swiper-wrapper.
Например,
<div class="slider">
<<div class="swiper-container">
<div class="swiper-wrapper">
<!-- твой контент -->
</div>
<div class="slider__controls">
<div class="slider__nav">
<div class="slider-button-prev">Предыдущий проект</div>
<div class="slider-button-next">Следующий проект</div>
</div>
<div class="slider__pagination"></div>
</div>
</div>
</div>
И в настройках слайдера
pagination: {
el: ".slider__pagination",
},
navigation: {
nextEl: ".slider-button-next",
prevEl: ".slider-button-prev",
},