diff --git a/src/app/globals.css b/src/app/globals.css
index 2852229..42cd737 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -319,48 +319,129 @@ button {
 }
 
 /* ---- Public footer & legal pages ---- */
+.site-footer {
+  background: var(--cream-2);
+  /* Filet doré : referme la page au lieu d'une simple ligne grise. */
+  border-top: 3px solid var(--gold);
+}
+/* Quatre colonnes : à trois, la dernière laissait un tiers de la largeur vide. */
 .footer-grid {
   display: grid;
-  grid-template-columns: minmax(280px, 1.8fr) 1fr 1fr;
-  gap: 48px;
+  grid-template-columns: minmax(240px, 1.5fr) repeat(3, minmax(0, 1fr));
+  gap: 40px;
   align-items: start;
 }
+.footer-brand img {
+  display: block;
+  width: 96px;
+  height: auto;
+}
+.footer-tagline {
+  margin: 10px 0 0;
+  max-width: 340px;
+  color: var(--muted);
+  font-size: 13.5px;
+  line-height: 1.65;
+}
 .footer-title {
-  font-family: "Bricolage Grotesque", "Public Sans", system-ui, sans-serif;
-  color: var(--ink-strong);
-  font-size: 13px;
+  margin: 0 0 14px;
+  color: var(--brown);
+  font-size: 11.5px;
   font-weight: 800;
-  margin: 3px 0 11px;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
 }
 .footer-links {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
-  gap: 8px;
+  gap: 10px;
   color: var(--muted);
-  font-size: 13px;
+  font-size: 13.5px;
 }
 .footer-links a,
 .footer-links button {
+  padding: 0;
+  border: 0;
+  background: none;
+  color: inherit;
+  font: inherit;
+  text-align: left;
   text-decoration: none;
   cursor: pointer;
+  transition: color 0.15s ease, transform 0.15s ease;
 }
 .footer-links a:hover,
 .footer-links button:hover {
-  color: var(--brown) !important;
-  text-decoration: underline;
+  color: var(--brown);
+  transform: translateX(2px);
+}
+/* Boutons sociaux libellés : plus lisibles que deux icônes isolées, et ils
+   donnent enfin du contenu à la quatrième colonne. */
+.footer-social {
+  display: flex;
+  flex-direction: column;
+  /* Sans cela les boutons s'étirent sur toute la colonne et deviennent des
+     pavés vides. */
+  align-items: flex-start;
+  gap: 9px;
+}
+.footer-social a {
+  display: inline-flex;
+  align-items: center;
+  gap: 10px;
+  padding: 9px 13px;
+  border: 1px solid #e2d6bd;
+  border-radius: 11px;
+  background: #fff;
+  color: var(--ink-soft);
+  font-size: 13px;
+  font-weight: 600;
+  text-decoration: none;
+  transition: border-color 0.15s ease, transform 0.15s ease;
+}
+.footer-social a:hover {
+  transform: translateY(-1px);
+}
+.footer-contact {
+  display: flex;
+  flex-direction: column;
+  gap: 7px;
+  margin-top: 16px;
+  color: var(--muted);
+  font-size: 13px;
+}
+.footer-contact a {
+  color: inherit;
+  text-decoration: none;
+}
+.footer-contact a:hover {
+  color: var(--brown);
 }
 .footer-bottom {
   display: flex;
+  align-items: center;
   justify-content: space-between;
-  gap: 16px;
+  gap: 10px 20px;
   flex-wrap: wrap;
   border-top: 1px solid #ded2b9;
-  margin-top: 26px;
+  margin-top: 34px;
   padding-top: 18px;
   color: var(--muted-2);
   font-size: 12.5px;
 }
+.footer-bottom__place {
+  display: inline-flex;
+  align-items: center;
+  gap: 7px;
+}
+.footer-bottom__place::before {
+  content: "";
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: var(--gold);
+}
 .legal-content h2 {
   font-family: "Bricolage Grotesque", "Public Sans", system-ui, sans-serif;
   color: var(--ink-strong);
@@ -408,8 +489,12 @@ button {
     grid-template-columns: 1fr;
   }
   .footer-grid {
-    grid-template-columns: 1.5fr 1fr 1fr;
-    gap: 28px;
+    /* Quatre colonnes ne tiennent plus : la marque prend toute la ligne. */
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 30px;
+  }
+  .footer-grid > :first-child {
+    grid-column: 1 / -1;
   }
 }
 @media (max-width: 640px) {
@@ -427,11 +512,21 @@ button {
     padding: 0 16px;
   }
   .footer-grid {
-    grid-template-columns: 1fr 1fr;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 26px;
   }
-  .footer-grid > :first-child {
+  .footer-grid > :first-child,
+  /* « Nous suivre » resterait seule dans une colonne, la moitié droite vide. */
+  .footer-grid > :last-child {
     grid-column: 1 / -1;
   }
+  .footer-social {
+    flex-direction: row;
+    flex-wrap: wrap;
+  }
+  .footer-bottom {
+    justify-content: flex-start;
+  }
 }
 
 /* Évite tout débordement horizontal sur mobile. */
diff --git a/src/components/SiteFooter.tsx b/src/components/SiteFooter.tsx
index f330909..199f04e 100644
--- a/src/components/SiteFooter.tsx
+++ b/src/components/SiteFooter.tsx
@@ -5,48 +5,27 @@ import { SOCIAL_BRAND, SocialIcon } from "./SocialIcons";
 
 export async function SiteFooter() {
   const year = new Date().getFullYear();
-  const socials = socialLinks(await getSiteSettings());
+  const settings = await getSiteSettings();
+  const socials = socialLinks(settings);
+
+  const email = settings.association_email.trim();
+  const phone = settings.association_phone.trim();
+  const address = settings.association_address.trim();
+  const hasContact = !!(email || phone || address);
 
   return (
-    <footer style={{ background: "#EFE9DA", borderTop: "1px solid #e2d6bd" }}>
-      <div className="container" style={{ paddingTop: 34, paddingBottom: 24 }}>
+    <footer className="site-footer">
+      <div className="container" style={{ paddingTop: 40, paddingBottom: 26 }}>
         <div className="footer-grid">
-          <div>
+          <div className="footer-brand">
             <Link href="/" aria-label="Plein R — accueil" style={{ display: "inline-flex" }}>
               {/* eslint-disable-next-line @next/next/no-img-element */}
-              <img src="/assets/logo.png" alt="Plein R" style={{ width: 118, height: "auto", display: "block" }} />
+              <img src="/assets/logo.png" alt="Plein R" />
             </Link>
-            <p style={{ margin: "12px 0 0", maxWidth: 370, fontSize: 13.5, lineHeight: 1.65, color: "#6c6150" }}>
+            <p className="footer-tagline">
               Association des commerçants et entreprises du Bassin de Pompey.
               Réseau · Rencontre · Réussite.
             </p>
-            {socials.length > 0 && (
-              <div style={{ display: "flex", gap: 9, marginTop: 16 }}>
-                {socials.map((s) => (
-                  <a
-                    key={s.network}
-                    href={s.href}
-                    target="_blank"
-                    rel="noopener noreferrer"
-                    aria-label={`Plein R sur ${s.label}`}
-                    title={`Plein R sur ${s.label}`}
-                    style={{
-                      display: "inline-flex",
-                      alignItems: "center",
-                      justifyContent: "center",
-                      width: 38,
-                      height: 38,
-                      borderRadius: 11,
-                      border: "1px solid #e2d6bd",
-                      background: "#fff",
-                      color: SOCIAL_BRAND[s.network],
-                    }}
-                  >
-                    <SocialIcon network={s.network} />
-                  </a>
-                ))}
-              </div>
-            )}
           </div>
 
           <div>
@@ -54,27 +33,57 @@ export async function SiteFooter() {
             <div className="footer-links">
               <Link href="/annuaire">Annuaire</Link>
               <Link href="/#promotions">Promotions</Link>
-              <Link href="/association">Association</Link>
-              <Link href="/login">Connexion</Link>
+              <Link href="/association">L&apos;association</Link>
+              <Link href="/rencontres-passees">Rencontres passées</Link>
+              <Link href="/login">Espace adhérent</Link>
             </div>
           </div>
 
           <div>
             <div className="footer-title">Informations</div>
             <div className="footer-links">
-              <ContactModalButton
-                label="Nous contacter"
-                style={{ background: "none", border: "none", padding: 0, font: "inherit", color: "inherit", textAlign: "left" }}
-              />
+              <ContactModalButton label="Nous contacter" />
               <Link href="/mentions-legales">Mentions légales</Link>
               <Link href="/confidentialite">Confidentialité</Link>
             </div>
           </div>
+
+          <div>
+            {socials.length > 0 && (
+              <>
+                <div className="footer-title">Nous suivre</div>
+                <div className="footer-social">
+                  {socials.map((s) => (
+                    <a
+                      key={s.network}
+                      href={s.href}
+                      target="_blank"
+                      rel="noopener noreferrer"
+                      aria-label={`Plein R sur ${s.label}`}
+                    >
+                      <span style={{ color: SOCIAL_BRAND[s.network], display: "inline-flex" }}>
+                        <SocialIcon network={s.network} size={17} />
+                      </span>
+                      {s.label}
+                    </a>
+                  ))}
+                </div>
+              </>
+            )}
+
+            {hasContact && (
+              <div className="footer-contact">
+                {email && <a href={`mailto:${email}`}>{email}</a>}
+                {phone && <a href={`tel:${phone.replace(/[^\d+]/g, "")}`}>{phone}</a>}
+                {address && <span>{address}</span>}
+              </div>
+            )}
+          </div>
         </div>
 
         <div className="footer-bottom">
           <span>© {year} Plein R. Tous droits réservés.</span>
-          <span>Bassin de Pompey</span>
+          <span className="footer-bottom__place">Bassin de Pompey</span>
         </div>
       </div>
     </footer>