Responsive Page with Sass and Simple Animation

Congrats on completing the challenge, it's really close to the original design!!

I've found some key areas where you can improve and simplify the code.

• The main idea of this challenge is to use css-grid only on the cards section, so on the mobile view, you should use display: grid on the section tag.
• You should avoid using setting the width and height to each grid item, for this you could use grid-auto-column: minmax(auto, $desired-max-width); and grid-auto-row: 1fr; where the grid is defined. By doing this, you fix the overflow issue you have on smaller desktop-views and also you guarantee that each grid item has the correct-size.
• You could simplify your grid-template-area by doing the following:

grid-template-area: 
". two ." 
"one two four" 
"one three four" 
". three .";

This will make your grid template more readable, as well as you could simplify each card, by removing the grid-row property and replacing it with grid-area: one for the first card and so on.

Other than that, the code and site look great! PS. loved the card animation on hover!!