Mobile First - Responsive - CSS Grid - Flexbox - SASS

Hello

• I used CSS background for the different images. Is this approach acceptable in the actual context?

• For the two images, in the second section, I used CSS grid, defined an aspect ratio for one image and made the second stretch to take the available height (default align-items value), this gave it the desired aspect ratio. Is there a better way?

• I positioned the "pattern-square" background image knowing the container and image width. If there's a better way to do it, I would be happy to know it.

• I used magic numbers in my scss, I know I should create scss variables.

Any other suggestions would be appreciated, thank you!