/* Pied de page (includes/footer.html) : marine, logo, aligné sur la largeur de la page. */
.site-footer {
  padding-block: 32px;
  background: var(--brand-navy);
  --focus: var(--brand-mint);
}
.footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px 32px;
  flex-wrap: wrap;
}
.footer-logo-img { width: 98px; height: auto; margin-bottom: 10px; }
.footer-zone { margin-top: 2px; font-size: 13px; color: var(--brand-mist); }
.footer-contact,
.footer-links {
  display: flex;
  gap: 8px 20px;
  flex-wrap: wrap;
}
.footer-contact a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--brand-cream);
}
.footer-contact a .icon { color: var(--brand-mint); }
.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px 32px;
  flex-basis: 100%;
  padding-top: 18px;
  border-top: 1px solid var(--brand-navy-line);
}
.footer-links a { font-size: 13px; color: var(--brand-mist); }
.footer-links a:hover { color: var(--brand-cream); }
.footer-credit { font-size: 11px; color: var(--brand-mist); }

@media (max-width: 680px) {
  .footer-inner { flex-direction: column; align-items: flex-start; }
  .footer-bottom { flex-basis: auto; width: 100%; }
}