fix: make cards responsive (#1049)

[![PR App][icn]][demo] | Fix CX-1683
:-------------------:|:----------:

## 🧰 Changes
- set cards to one column on mobile

<img width="200" alt="image"
src="https://github.com/user-attachments/assets/e980fc06-8ef3-4733-9f1f-2479fb7f90f6"
/>



## 🧬 QA & Testing

- [Broken on production][prod].
- [Working in this PR app][demo].


[demo]: https://markdown-pr-PR_NUMBER.herokuapp.com
[prod]: https://SUBDOMAIN.readme.io
[icn]:
https://user-images.githubusercontent.com/886627/160426047-1bee9488-305a-4145-bb2b-09d8b757d38a.svg

components/Cards/style.scss

@@ -1,3 +1,5 @@
+$iphone-plus: 414px;
+
 .CardsGrid {
   display: grid;
   gap: 20px;
@@ -45,5 +47,7 @@
     }
   }
 
-
+  @media (max-width: $iphone-plus) {
+    grid-template-columns: 1fr !important;
+  }
 }