Upgrading a Card Component

If we wanted to build a card component without container queries, we could create variations using modifier classes. And for variations of the card size, those modifiers could be tied to breakpoints. This means that if the card had the modifier, it would be allowed to change when the viewport width fell within that breakpoint.

The following image shows three card size variations and their respective modifier classes, where the top .card would be considered as default.