/* ===================================================================
   thanaelfontaine.eu · pied de page commun (plan du site)
   Généré au build par tools/site_footer.py sur toutes les pages. Chaque page
   se termine à minuit : fond Minuit, encre Lune, accent Or.
   Charte : docs/design/charte-une-journee.md
   =================================================================== */

.tf-foot {
  background: #0D1322; color: #AEB6C8;
  padding: clamp(48px, 6vw, 80px) clamp(20px, 5vw, 88px) 28px;
  border-top: 1px solid rgba(174,182,200,.2);
  font-size-adjust: none;
}
.tf-map {
  --tf-serif: "Cormorant Garamond", "Cormorant Secours", Georgia, serif;
  --tf-label: "IBM Plex Sans Condensed", "Plex Secours", "Plex Secours Large", sans-serif;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
  gap: 32px clamp(28px, 4vw, 64px); align-items: start;
  padding-bottom: 28px; border-bottom: 1px solid rgba(174,182,200,.15);
  font-size-adjust: none; text-align: left;
}
.tf-brand { display: flex; flex-direction: column; gap: 10px; }
.tf-name { display: inline-flex; align-items: center; gap: 12px; color: #EFE8DC; text-decoration: none; font-family: var(--tf-serif); font-size: 24px; }
.tf-seal {
  width: 34px; height: 34px; flex: none; display: grid; place-items: center; padding-top: .06em;
  background: #B4532F; color: #F4EEE3; font-family: var(--tf-serif); font-weight: 600; font-size: 14px;
  border-radius: 2px; transform: rotate(-2deg);
  box-shadow: inset 0 0 0 3px #B4532F, inset 0 0 0 4px rgba(244,238,227,.5);
}
.tf-role { margin: 0; font-family: var(--tf-label); font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: #8E97AB; }
.tf-tag { margin: 0; font-family: var(--tf-serif); font-style: italic; font-size: 18px; line-height: 1.4; color: #DCE0E8; max-width: 26ch; }
.tf-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px clamp(20px, 3vw, 44px); }
.tf-col-t { margin: 0 0 12px; font-family: var(--tf-label); font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: #E8B77E; }
.tf-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.tf-col li { margin: 0; font-family: var(--tf-serif); }
.tf-col a {
  color: #DCE0E8; text-decoration: none; font-family: var(--tf-serif); font-size: 16.5px; line-height: 1.35;
  border-bottom: 1px solid transparent; transition: border-color .3s, color .3s;
}
.tf-col a:hover, .tf-col a:focus-visible { color: #EFE8DC; border-bottom-color: rgba(232,183,126,.7); opacity: 1; }
.tf-col a[aria-current="page"] { color: #E8B77E; }
.tf-map :focus-visible { outline: 2px solid #E8B77E; outline-offset: 3px; }
.tf-rights { grid-column: 1 / -1; margin: 0; padding-top: 4px; font-family: var(--tf-label); font-size: 10.5px; letter-spacing: .08em; color: #8E97AB; }

@media (max-width: 980px) {
  .tf-map { grid-template-columns: 1fr; }
  .tf-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
  .tf-cols { grid-template-columns: 1fr; }
}