Responsive design + image cropping on Jasper template

Site URL: https://www.amyklazkin.com/

I'm using the Jasper template for my website and I'm having some issues re: responsive design.

Basically, I've made some index images that look really nice on my website when I view my site full-screen. However, if I minimize the window to 2/3 the size of the screen or when I view my site on mobile, the images are getting cropped, and thus some of the image/text is getting cut off, which is an issue. I've tried resizing the images a million different times and reaching out to Squarespace support with no luck...

I'd also be open to changing my images to be image-only and do text as an overlay, if that would work better -- but I'm not totally sure how to do that!

Hoping someone here could help me with some custom code or some other possible solutions. Thank you!!