Issues with Spacing on Tablet View

Hello. I'm facing an issue when working on the tablet / wide mobile viewport for my website.

My problem is that, on certain sections with a lot of text, although no spacing is left beneath the text, a huge margin appears below the textbox and gives the section an awful look. There is no margin or padding set to the section or the elements it contains and the text is the closest it can be to the end of the section.

On the link I shared if you scroll down a bit on 600px to 991px, you'll see colored sections with images above and text below and the issue will be clear.

Given the mobile design didn't translate well, I decided to work with duplicate sections. So each of these sections is duplicated, the original section is set to display on desktop and mobile, and the duplicate displays only on this in-between size. I need to get rid of these margins. If anyone has ideas about how to solve this, they will be immensely appreciated. I can share my custom CSS or anything else you think could be useful.

Link to the website: https://www.theslatestudio.com/the-big-picture