All solutions

I was struggling at the beginning with grid a bit as it was scaling in a weird way. Turned out it was because my hard coding card positions. grid-template-areas did the job.

Any feedback as always welcomed!

PS. I know I need to change px to rem, but I need to fix my plugin for that :D

This was quite straightforward project. However I'm not sure if there's a better way to position 'Learn More' button. When shrinking at some point text was hiding under the button. I solved it with switching to mobile view, but I wonder if it can be done better?

Another issue I've found just now is that footer behaves weird when view port width is shrunk to less than 300px: it hides on the right side. No idea why it happens.

Thanks for checking out my solution! Any feedback is welcome!

Have a nice day and happy coding!

I was struggling with adding those marks as HTML form. Initially I wanted it to be input with type of radio but it was impossible to style it.

It was quite nice recap after previous one. I didn't have any troubles (only eye balling from images is a struggle, but part of fun). Of course any feedback is welcome :)

I'm still not sure if blending the picture cannot be done easier with some simple CSS. At the moment I've set mix-blend-mode: multiply and also I've added div that works as pink filter.

I think I still need to improve naming and CSS structure - I'm not sure how to write CSS files to see possible reusability etc.