Stats preview card component

I faced many difficulties when trying to make the images responsive. Prior to this project I used background images for images section of the webpage. The problems I faced are as follows:

• The object-fit property didn't work when I used it on large screens but worked when I used it on smaller screens, you can check it in my code. Anyone know why?
• I ended up using flexbox to make the image a flex item and cover the container it was in.
• The purple filter or overlay on the image was tricky to design. After some internet surfing I found many solution but nothing worked. At last I used background color and made the image transparent to get the desired effect. Any other ideas on how to design this?