Responsive meet landing page with Grid

What challenges did you encounter, and how did you overcome them?

When resizing the window, instead of having the hero images resize, I made them behave like in the Figma design, where they stay the same size and are evenly cropped from both the left and right sides. I used flexbox to ensure that the hero images disappear equally on both sides as the window is resized.

But I have to wrap the hero content in an extra div for better control. Please kindly comment on my approach, is there anything I can do better?