/**
 * Service / about pages: footer matches rendez-vous.html (#footer on blue gradient).
 * Loaded in addition to fontawesome; does not require style.css or bootstrap.
 */
#footer {
  padding: 72px 0 50px;
  position: relative;
  background: transparent !important;
  border-top: none !important;
  color: rgba(255, 255, 255, 0.75);
}
#footer .container {
  max-width: 1170px;
  margin: 0 auto;
  padding: 0 15px;
  padding-top: 30px;
  box-sizing: border-box;
}
#footer .footer-grid-col {
  text-align: center;
}
#footer .gotop {
  position: absolute;
  top: 28px;
  left: 50%;
  margin-left: -28px;
  z-index: 8;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18) !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  box-shadow: none !important;
  transition: transform 0.2s ease, background 0.2s ease, top 0.2s ease;
  text-decoration: none !important;
  color: #ffffff !important;
}
#footer .gotop:hover,
#footer .gotop:focus {
  top: 24px;
  background: rgba(255, 255, 255, 0.26) !important;
  text-decoration: none !important;
}
#footer .gotop svg {
  width: 24px;
  height: 24px;
  display: block;
  flex-shrink: 0;
}
#footer .social-media-links {
  margin: 30px 0 !important;
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
#footer .social-media-links a {
  margin: 0 25px !important;
}
#footer .social-media-links a,
#footer .social-media-links a i {
  color: rgba(255, 255, 255, 0.9) !important;
}
#footer .social-media-links a:hover,
#footer .social-media-links a:focus,
#footer .social-media-links a:hover i,
#footer .social-media-links a:focus i {
  color: #fff !important;
}
#footer p {
  color: rgba(255, 255, 255, 0.75) !important;
}
#footer p:not(.footer-legal) {
  font-size: 11px;
}
#footer .footer-legal {
  margin: 0;
  font-size: 10px;
}
#footer .footer-legal-link {
  color: rgba(255, 255, 255, 0.7) !important;
  text-decoration: none;
}
#footer .footer-legal-link:hover,
#footer .footer-legal-link:focus {
  color: #fff !important;
}
#footer .footer-legal-sep {
  margin: 0 10px;
  color: rgba(255, 255, 255, 0.25);
}
@media (min-width: 769px) {
  #footer p:not(.footer-legal) {
    font-size: 20px;
    line-height: 1.5;
  }
  #footer .footer-legal,
  #footer .footer-legal-link {
    font-size: 1rem;
  }
}
@media (max-width: 768px) {
  #footer p .footer-rights-line {
    display: block;
    margin-top: 0.35em;
  }
  #footer p .footer-pipe {
    display: none;
  }
  #footer .fab {
    display: inline-block;
    min-width: 1.1em;
    text-align: center;
  }
  #footer .footer-legal-link {
    color: #b8b8b8 !important;
  }
  #footer .social-media-links {
    flex-wrap: nowrap;
    justify-content: center;
    gap: 18px;
  }
  #footer .social-media-links a {
    margin: 0 14px !important;
    flex-shrink: 0;
  }
}
@media (max-width: 480px) {
  #footer .social-media-links a {
    margin: 0 12px !important;
  }
}

/*
 * Rendez-vous: #footer is a direct child of body — no extra wrapper padding below it.
 * Service pages keep #footer inside .page with large padding-bottom (80px desktop, 100–160px mobile)
 * for legacy CTA bars, which reads as empty blue space under the legal line.
 */
.page:has(#footer) {
  padding-bottom: 0;
}
@media (max-width: 768px) {
  .page:has(#footer) {
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }
}