Blog preview card component using HTML and CSS

What are you most proud of, and what would you do differently next time?

I like that I was able to recreate the hovering effects on the card that are shown in the Figma design. Although the box-shadow transition is not exactly the same I think it still looks good. Also, I used a media query to change the width of the card when the screen size is less than 480px, which works for most mobile devices. Next time I would like to apply CSS reset before starting so that there are no problems with different browsers.

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

The biggest challenge was making the different hovering effects to apply to both the card title and the card itself, since the title had one effect and the card had a different one. I was able to solve this problem by reading some of the online documentation on transitions and pseudo-class selectors.

What specific areas of your project would you like help with?

Is my project responsive on different devices and browsers? I didn't use pixel units in any part of the CSS style, but I'm not sure whether that's the right way to do it? Any feedback on improvements or changes I should make would be appreciated.