All solutions

This challenge was slightly trickier than the previous ones I've completed, but I think it turned out okay.

Would appreciate a little bit of a HTML/CSS review to see if there's anything specific I'm missing, or if there's a better way to approach this type of challenge in future.

Thanks

I did the unique styling on the cards using nth-child selectors. To me this seemed the most efficient way and to account for further cards being added to the main component. What do you guys think, is there a better way to do this?

Thanks.

Can anyone explain the best use cases for Grid and Flexbox? I tried making this in Flexbox first, but it seemed very cumbersome so I read up on Grid and it seemed a lot more controllable.

Apart from nav bars and the odd horizontal or vertical scaling content, would people primarily just use Grid now a days?

Would a card component like this sit inside a html main tag, or is there something more semantically correct?

I'm not entirely happy with the margin and padding applied to the h1 and p elements. Visually it looks fine but I'm wondering would it have been better to only apply padding on these?