Grid in responsive acting strange

Hi everyone

I’m quite new to Webflow. I’ve been looking at the University a lot, yet the issue I’m having stumps me. To strat off, here’s the site I’m working on: https://econ3-new-website.webflow.io/

I’m using a grid for the 4 elements under the hero image, namely: Houtskeletbouw, Maatwerk, Kwaliteit en duurzaamheid and Ontzorging. I have 2 main issues with the grid here:

  1. the 4 elements aren’t the same width/alignment and I don’t see what the issue could be. As far as I can tell they are set up exactly the same.
  2. When you look at responsiveness, for some reason one element is put in the same grid area as another one. I’ve tried everything, but it never responds the way I want it to.

I’ve been looking at this for hours now and needless to say, I’m getting frustrated at not finding the solutions. Would appreciate any help you can give me!