html and css - profile-card-component-main

Any feedback on the css? For some reason I wasn't able to give 100% concentration to following a strict flex box dev, so I ended up just hacking the css. Overall I was able to complete this in under an hour, however I just realised that I forgot to add the background circle elements. The positioning of the image wasted a lot of my time and I ended up forgetting about the background elements while I was trying to complete the challenge for time.

Im not sure why there is the big white space at the bottom of the card. I have a feeling it is because I shifted the profile image upwards, however I haven't been able to get rid of the white space, any ideas to solve this?

Also is it possible to use flex box and have the profile image in the position that it is? I was not able to achieve this so I ended up butchering my css. Hopefully another shot down the line and I can improve this and not forget the background circles :).