Responsive 4 Card Layout

I see that the right grid item gets lost if I am minimizing the screen slowly to smaller device. You should work on responsive layout as things shouldn't get lost if devices are changing. I recommend you to not fixing widths. Kevin Powell is a good guy to learn responsive layouts.

as example if you delete the fixed width of 400px in your .card selector of your desktop approach, nothing will be lost anymore and the box is acting responsive. Give it a try.

I'm a newbie just like you but one thing I've seen you've done wrong is you use margin-top to layout the 4 cards, you can layout your grid by having 3 columns and four rows and then position them using grid-area, I don't know if you get it but its better if you can do your own research on it, its easy to find.

share this on discord server and post it on help section, people there who have better experience than me will give you feedbacks.