Responsive 3 column preview card component using CSS Grid and MQ's.

This is the first ever challenge I made in my life and even though it's simple I am proud of myself that I made this kind of challenge in this website, for me this challenge is amazing and easy to do, I didn't use any frameworks here because I have 0 knowledge of CSS frameworks, so I used pure vanilla CSS here, I learnt CSS variables from Kevin Powells (massive shoutout to this teacher) give his a check on his channel if you want to learn a lot from web development and also Web dev simplified, so going back to the coding part I am 100% not sure if everything I have done is correct, in my code here I did everything what is said to be done like making sure you've your best copying it 100% and as of what I can see I think I did it, the only thing that bothers me is the breakpoint in Media Queries, I did mobile first and I don't know where to break it for me to switch it to the desktop mode and for me I had a hard time here since it bothers me seeing the card stretch that wide, also the semantics on the HTML, other than that I think I did everything right and good (I guess) if you guys can see it please let me know if I did something wrong or bad here, I really want to learn and upgrade my skills, for me this is a hobby not just for some frontend job, please recommend me some good frameworks for CSS and what can I improve in this project, thank you for your time reading this and I will appreciate any help you can give me for improvement.