/* ==========================================================================
   footer.css: the shared site footer
   --------------------------------------------------------------------------
   Markup lives in /partials/footer.html and is injected between
   <!-- include:footer --> markers by scripts/build-includes.js, like the nav.

   Used on both the warm business pages and the dark guide pages, so it
   depends on no page variables, and it sets every property that older
   page-level `footer {}`, `h2`, `p`, `a` and `li` rules might touch.
   ========================================================================== */

.site-footer, .site-footer * { box-sizing: border-box; }
.site-footer {
  display: block;
  position: relative;
  margin: 0;
  padding: 3.5rem 0 2rem;
  background: #080f18;
  border-top: 1px solid rgba(61,191,191,0.12);
  color: rgba(255,255,255,0.74);
  font-family: 'Barlow', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.95rem;
  line-height: 1.6;
  text-align: left;
}
.site-footer-inner { max-width: 1180px; margin: 0 auto; padding: 0 clamp(1rem, 4vw, 3rem); }
.site-footer .footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 2.5rem; }
.site-footer .footer-brand { display: inline-flex; align-items: center; gap: 0.7rem; margin-bottom: 1rem; text-decoration: none; }
.site-footer .footer-brand svg { display: block; width: 34px; height: 34px; }
.site-footer .footer-brand span { font-family: 'Barlow Condensed', 'Arial Narrow', sans-serif; font-weight: 700; font-size: 1.2rem; letter-spacing: 0.08em; text-transform: uppercase; color: #ffffff; }
.site-footer .footer-brand b { color: #3dbfbf; font-weight: 700; }
.site-footer p { max-width: 38ch; margin: 0 0 0.9rem; padding: 0; font-size: 0.95rem; line-height: 1.6; color: rgba(255,255,255,0.74); }
.site-footer a { color: rgba(255,255,255,0.86); opacity: 1; text-decoration: none; border: 0; padding: 0; background: none; box-shadow: none; font-family: inherit; font-size: inherit; font-weight: 400; letter-spacing: normal; text-transform: none; }
.site-footer a:hover { color: #3dbfbf; }
.site-footer a.footer-email { color: #3dbfbf; font-weight: 600; }
.site-footer h2 {
  margin: 0 0 0.9rem; padding: 0; border: 0;
  font-family: 'Barlow Condensed', 'Arial Narrow', sans-serif; font-size: 0.82rem; font-weight: 700;
  line-height: 1.3; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255,255,255,0.62);
}
.site-footer h2::before, .site-footer h2::after, .site-footer li::before, .site-footer li::after { content: none; display: none; }
.site-footer ul { display: grid; gap: 0.45rem; margin: 0; padding: 0; list-style: none; }
.site-footer li { margin: 0; padding: 0; list-style: none; border: 0; }
.site-footer .footer-guides { grid-template-columns: 1fr 1fr; column-gap: 1.25rem; }
.site-footer .footer-base {
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 0.75rem 2rem;
  margin-top: 2.75rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,0.1);
  font-size: 0.85rem; color: rgba(255,255,255,0.62);
}
@media (max-width: 900px) {
  .site-footer .footer-grid { grid-template-columns: 1fr 1fr; }
  .site-footer .footer-grid > :first-child { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .site-footer .footer-grid { grid-template-columns: 1fr; }
}
