Elements on mobile misaligned but it looks okay on preview and PC browser (responsive mode)

Hello, I have been stuck on this issue where the padding/margins look completely wrong on mobile.

Here is an image on the Chrome browser (in responsive mode)

And here is an image of that same part of the website on my mobile (Samsung S20 FE):

I am using the same resolution but it looks different. I am pretty lost and any help would be greatly appreciated, thank you!


Here is my site Read-Only: https://preview.webflow.com/preview/hobi-a567b5?utm_medium=preview_link&utm_source=designer&utm_content=hobi-a567b5&preview=78487777ef4a2981ea4f68ba0ae85b5a&workflow=preview

Could I get any help on this? Trying to avoid having to rebuild the site.