Carnet d'adresses : liste en grille de cartes

- Adresses affichées en grille (côte à côte puis retour à la ligne)
- Cartes de taille homogène avec contour et effet d'ombre
- Zone de contenu élargie pour accueillir plusieurs colonnes
- Design : description de la disposition en grille de CarnetAdressesComponent

frontend/src/app/features/carnet-adresses/carnet-adresses.component.scss

@@ -1,6 +1,6 @@
 .carnet {
   padding: 1.5rem;
-  max-width: 720px;
+  max-width: 1080px;
   margin: 0 auto;
   display: flex;
   flex-direction: column;
@@ -158,9 +158,10 @@ button {
   list-style: none;
   margin: 0;
   padding: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
+  gap: 1rem;
+  align-items: stretch;
 }
 
 .carnet__vide {
@@ -170,12 +171,14 @@ button {
 
 .ligne {
   display: flex;
+  flex-direction: column;
   justify-content: space-between;
-  align-items: center;
   gap: 1rem;
-  padding: 0.75rem;
-  border: 1px solid #e4e4e4;
-  border-radius: 6px;
+  padding: 1rem;
+  border: 1px solid #e0e0e0;
+  border-radius: 10px;
+  background: #fff;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
 }
 
 .ligne__infos {
@@ -183,6 +186,7 @@ button {
   flex-direction: column;
   gap: 0.15rem;
   min-width: 0;
+  overflow-wrap: anywhere;
 }
 
 .ligne__denomination {
@@ -203,4 +207,5 @@ button {
   display: flex;
   gap: 0.5rem;
   flex-shrink: 0;
+  justify-content: flex-end;
 }