/* Pied de page — bloc autonome : aucune dépendance aux autres feuilles (templates/_site_footer.twig).
   Disposition, tailles et filigrane repris du pied de page de l'ancien site ; couleur du nouveau site (le turquoise
   foncé de l'en-tête, lisible en blanc : contraste 4,6) au lieu du rouge d'origine (#ae3141). Les pictogrammes des
   réseaux sociaux sont découpés dans leur carré blanc : ils prennent la couleur du fond. */
.site-footer { --footer-background: #167f9e; position: relative; overflow: hidden; box-sizing: border-box; margin-top: 2rem; padding: 60px 0; background: var(--footer-background); color: #fff; font-family: Lato, system-ui, -apple-system, "Segoe UI", Arial, sans-serif; font-size: 14px; font-weight: 400; line-height: 24px; text-align: left; }
.site-footer *, .site-footer *::before, .site-footer *::after { box-sizing: inherit; }
.site-footer::after { content: ""; position: absolute; z-index: 0; left: 60px; bottom: -20px; width: 540px; height: 440px; background: url(https://www.drostatic.com/images/dromadaire/v2017/dromadaire-footer-background.png) center / cover no-repeat; opacity: .05; pointer-events: none; }
.site-footer__inner { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; padding: 0 40px; }
.site-footer__social, .site-footer__column { list-style: none; margin: 0; padding: 0; }
.site-footer a { color: #fff; text-decoration: none; }
.site-footer a:hover, .site-footer a:focus-visible { text-decoration: underline; }
.site-footer a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; border-radius: 4px; box-shadow: none; }

.site-footer__social { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; padding: 0 0 30px; margin: 0 0 30px; border-bottom: 1px solid rgba(255, 255, 255, .2); }
.site-footer__social a { display: flex; align-items: center; gap: 20px; line-height: 20px; }
.site-footer__social img { flex: none; width: 50px; height: 50px; max-width: none; }
.site-footer__social strong { display: block; font-weight: 700; text-transform: uppercase; }

.site-footer__columns { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 20px; margin: 0 0 30px; }
.site-footer__column a { display: inline-block; padding: 0; }

.site-footer__about { margin: 0 0 30px; font-size: 12px; line-height: 20px; font-weight: 400; }
.site-footer__about strong { font-weight: 700; }
.site-footer__abroad { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 32px; font-size: 13px; font-weight: 400; }
.site-footer__abroad a { display: inline-flex; align-items: center; gap: 6px; }
.site-footer__abroad img { flex: none; width: 24px; height: 16px; max-width: none; }

/* Sites sans pied de page détaillé pour l'instant. */
.site-footer--kisseo .site-footer__brand { margin: 0 0 18px; display: flex; align-items: center; gap: 14px; font-size: 13px; }
.site-footer--kisseo .site-footer__brand img { display: block; height: 30px; width: auto; }
.site-footer--kisseo .site-footer__links { margin: 0 0 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; font-size: 13px; font-weight: 700; }
.site-footer--kisseo .site-footer__about { font-weight: 400; }
.site-footer--plain { padding: 1.5rem 1rem; text-align: center; background: #1f2430; color: #cfd4dc; }
.site-footer--plain::after { content: none; }
.site-footer--plain p { margin: 0; }

@media (max-width: 1000px) {
  .site-footer__social { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-footer__columns { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 20px; }
}
@media (max-width: 600px) {
  .site-footer { padding: 40px 0; }
  .site-footer__inner { padding: 0 20px; }
  .site-footer__social a { gap: 12px; }
  /* Comme sur l'ancien site, les colonnes de liens ne s'affichent pas au téléphone — sauf l'aide et les
     conditions d'utilisation, qui doivent rester accessibles partout. */
  .site-footer__columns { grid-template-columns: 1fr; }
  .site-footer__column:not(.site-footer__column--help) { display: none; }
  .site-footer__column a { padding: 6px 0; }
  .site-footer__abroad { gap: 4px 24px; }
  .site-footer__abroad-label { flex-basis: 100%; }
  .site-footer__abroad a { min-width: 40%; }
  .site-footer__abroad a { padding: 6px 0; }
}
