/* The multi-column footer shared by every public marketing page (index.php, faq.php,
   privacy_policy.php, terms_of_service.php) via includes/site_footer.php — one stylesheet so the four
   pages can never drift apart. Sizes are fixed here rather than inherited from each page's own body
   font-size, so the footer renders identically everywhere. White block on the page's gray
   background, set off with a top border rather than a shadow. */
/* Sticky footer: the page is a full-height column and the footer's auto top margin soaks up any spare
   height, so on a short page (Contact, with the form unavailable, a wide monitor) the footer sits at the
   bottom of the window instead of floating mid-screen. `body > *` gets an explicit width because
   children that centre themselves with `margin: 0 auto` + `max-width` would otherwise shrink to their
   content in a flex column. Position: fixed items (the back-to-top button) are unaffected. */
body { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
body > * { flex-shrink: 0; width: 100%; }
.site-footer {
    margin-top: auto;
    background: #fff;
    border-top: 1px solid #e5e7eb;
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 18px;
    line-height: 1.6;
    text-align: left;
}
.site-footer * { box-sizing: border-box; }
.footer-inner { max-width: 1220px; margin: 0 auto; padding: 56px 32px 36px; display: flex; flex-wrap: wrap; gap: 48px; justify-content: space-between; }
.footer-brand { flex: 1 1 260px; max-width: 320px; }
.footer-brand-link { display: flex; align-items: center; gap: 8px; font-size: 1.2em; font-weight: 600; color: #1568c4; text-decoration: none; margin: 0 0 10px; }
.footer-logo { width: 26px; height: 26px; }
.footer-tagline { color: #6b7280; font-size: 0.92em; line-height: 1.6; margin: 0; }
.footer-col { flex: 0 0 140px; }
.footer-col h4 { font-size: 0.78em; text-transform: uppercase; letter-spacing: 0.05em; color: #9ca3af; font-weight: 600; margin: 0 0 14px; }
.footer-col a { display: block; color: #374151; text-decoration: none; font-size: 0.92em; margin: 0 0 10px; }
.footer-col a:hover { color: #1568c4; }
.footer-bottom { border-top: 1px solid #f1f2f4; padding: 18px 32px; text-align: center; color: #9ca3af; font-size: 0.85em; }

@media (max-width: 640px) {
    .site-footer { font-size: 16px; }
    .footer-inner { padding: 36px 20px 24px; gap: 28px 16px; }
    .footer-brand { flex: 1 1 100%; max-width: none; }
    .footer-col { flex: 1 1 40%; }
    .footer-bottom { padding: 16px 20px; }
}