Why does my mobile site look so terrible?

As the title says, I am happy with the desktop version, of the mobile version looks very bad. The text is all over the place, overlapping, etc. The navigation bar is also bad. The only page that looks ok is the “contact us” where I used a default form. I used quick stacks hoping it’d rearrange them better on mobile site, but I am at a loss trying to figure out how to fix this as this is my first go at a website. Is it better/easier to just redesign it while previewing in mobile?

I’m trying to have this ready for someone tomorrow so any help would be great!

Published site is: www.casaamortequila.com
Here is my site Read-Only: Webflow - Casa Amor Tequila

An example > The ‘cell’ containing that image is smaller than the image.
OR . . . The image is larger than the cell. Same results.

There are similar issues (errors) with the containing box for some of the text items.

Also looks like some styles (classes) are used again when a combo class is appropriate.

Webflow designs large to small. Fix the issues in the desktop. If correct, check it in tablet, etc.
Make sizing and dimensions for each as desired.