Reponsive fixes for dynamic grid v2

src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css

@@ -1,4 +1,6 @@
 .dynamic-grid {
+	container-type: inline-size;
+
 	&.dynamic-grid--bleed-bleed {
 		grid-column: bleed !important;
 	}
@@ -47,12 +49,6 @@
 				box-sizing: border-box;
 
 				.tile-content-wrapper {
-					display: -webkit-box;
-					-webkit-box-orient: vertical;
-					-webkit-line-clamp: 4;
-					line-height: 20px;
-					overflow: hidden;
-
 					.tile-title {
 						font-weight: bold;
 						line-height: 20px;
@@ -182,8 +178,34 @@
 		}
 	}
 
-	@container (max-width: 950px) {
-		.tab-container {
+	@container (max-width: 900px) {
+		.tiles-container {
+			grid-template-columns: repeat(3, 1fr);
+
+			.tile.vertical {
+				grid-row: span 1;
+				grid-column: span 1;
+
+				.tile-image--vertical {
+					display: none;
+				}
+
+				.tile-image--horizontal {
+					display: none;
+				}
+
+				.tile-image--square {
+					display: block;
+
+					picture img {
+						display: block !important;
+					}
+				}
+			}
+		}
+	}
+
+	@container (max-width: 700px) {
 		.tiles-container {
 			grid-template-columns: repeat(2, 1fr);
 
@@ -208,14 +230,14 @@
 				}
 			}
 
-				.tile.horizontal {
+			.tile.vertical {
+				grid-row: span 2;
 				grid-column: span 1;
 			}
 		}
 	}
-	}
 
-	@container (max-width: 700px) {
+	@container (max-width: 500px) {
 		.tiles-container {
 			grid-template-columns: 1fr;
 			max-width: 700px;