Div Background Images & Contain/Cover

Hi, I'm having some problems with the whitespace appearing on these Card elements I'm using. When the browser window is tall or wide, there is white space showing on either side. I attempted using 'cover' in the third image here, but it's cropping off the important information. Trying to find a way to make the cards responsive while keeping the aspect ratio and also not showing the white space. I added a blue 2px dotted outline around the 4 section grid. The red 2px dotted outline shows the Box that contains the three cards with the image. The yellow 2px dotted outline shows the three cards within that. The final image attached is the design file from Figma.