Responsive four card feature section using css grid

1. The footer content easily overlaps with the last card on mobile.
2. Only the top-left and top-right corners of each card's colored area should have rounded corners, while the rest should remain straight.
3. You can use box-shadow: 0 y-axis offset blur to create the shadow effect initially requested.
4. The card's title text should have a font-weight set.
5. Mobile sizes are typically below 768px, but in your case, the layout switches to mobile around a screen width of 980px.

Another interesting thing is that when the screen size is reduced to below 300px, it applies the desktop styles again, which is also something that can be adjusted