my-app/src/components/ui/Card.module.css

@@ -10,8 +10,9 @@
 	box-shadow: 0 2px 8px rgba(104, 104, 104, 0.15);
 	text-decoration: none;
 	color: var(--text-primary);
-	aspect-ratio: 1 / 1;
+	/*aspect-ratio: 1 / 1;*/
 	padding: 1rem;
+	flex: 1;
 }
 
 @media (hover: hover) {

my-app/src/pages/RoomBooking.module.css

@@ -25,6 +25,19 @@
 	gap: 2rem;
 }
 
+@media (min-width: 520px) {
+	.roomCategoryCards {
+		flex-direction: row;
+		flex-wrap: wrap;
+	}
+	
+	.roomCategoryCards > * {
+		flex: 1 1 0;
+		min-width: 200px;
+		max-width: 400px;
+	}
+}
+
 .sectionDivider {
 	border: none;
 	margin-top: 4rem;