Four Card Feature Using Stylus

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

I'm most proud of being able to leverage Stylus' features a bit better in this challenge. Things such as taking advantage of iterations, conditional statements, placeholder selectors, etc. I also divided my stylesheets into 3 different files, each having a single responsibility (i.e. Globals, Utility, Style). This made it easier to navigate through my styles more effectively.

It's a bit early to switch to a different CSS preprocessor, but next time I'll use LESS instead of Stylus in order to have some experience with it.

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

A challenge I encountered was figuring out how to setup the four cards to look like the desktop version. I knew that there were two ways I could go about solving this, but didn't know which method I wanted to use i.e. Grid or 2 Flexboxes. In the end, CSS grid was my go to answer, but then I had issues visualizing how to setup the columns and rows. So, I used this CSS interactive Grid website to come up with a solution. Neat, huh?

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

How can I make this website even more accessible?

Otherwise, all feedback welcome!