« Modèle:Accueil/shared/styles.css » : différence entre les versions

@@ Ligne 742 : / Ligne 742 : @@
 .home-grid a.external {
      background-image: none;
+}
+/* ====================================
+   GRILLES DE CARDS - VARIANTES
+   ==================================== */
+/* Grille 3 colonnes (EXISTANTE - pour référence) */
+.home-cards-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+    gap: 20px;
+    margin: 20px 0;
+}
+/* Grille 2 colonnes */
+.home-cards-grid-2 {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: 20px;
+    margin: 20px 0;
+}
+/* Grille 1 colonne (pleine largeur) */
+.home-cards-grid-1 {
+    display: grid;
+    grid-template-columns: 1fr;
+    gap: 20px;
+    margin: 20px 0;
+}
+/* ====================================
+   RESPONSIVE
+   ==================================== */
+/* Tablette : 2 colonnes deviennent 1 */
+@media (max-width: 768px) {
+    .home-cards-grid-2 {
+        grid-template-columns: 1fr;
+    }
+}
+/* Mobile : 3 colonnes deviennent 1 */
+@media (max-width: 640px) {
+    .home-cards-grid {
+        grid-template-columns: 1fr;
+    }
 }