improved responsive framework

web/themes/custom/leshed/assets/scss/partials/pages/_views-archives-projets.scss

@@ -11,9 +11,14 @@
 
 
 div.views-archives-projets{
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
+  // Design : 4 colonnes ou 2, jamais 3 — grille explicite qui bascule au
+  // seuil mobile. Une dernière rangée incomplète ne s'étire pas.
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: $colsgap;
+  @media #{$mobile}{
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
 
 
   article.node-type-projet.view-mode-tableau_liste{
@@ -27,25 +32,6 @@ div.views-archives-projets{
 
   }
 
-
-  // DESKTOP + TABLETTE (≥ 768) — gouttière + rangées de 4.
-  @media #{$desktop-et-tablette}{
-    gap: $colsgap;
-    div.views-row{
-        flex: 1 0 calc(25% - $colsgap);
-        width: calc(25% - $colsgap);
-    }
-  }
-
-  // MOBILE (≤ 767) : 2 par ligne.
-  @media #{$mobile}{
-    gap: $colsgap;
-    div.views-row{
-        flex: 1 0 calc(50% - $colsgap);
-        width: calc(50% - $colsgap);
-    }
-  }
-
 }
 form#views-exposed-form-archives-page-1{
   div.bef-links{