/* The one site footer (`_site_footer.html`), self-contained like the header: scoped under
   `footer.sf`, tokens from _theme.html with dark fallbacks, so it looks the same on the landing
   pages (welcome.css, pro.css) and on the tool pages that carry no landing styles at all. */
footer.sf { margin-top: 48px; border-top: 1px solid var(--border, #2d3744); background: var(--bg, #0f1419);
  color: var(--text, #e6edf3); font-family: system-ui, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; }
footer.sf * { box-sizing: border-box; }
footer.sf .sf-in { max-width: 1080px; margin: 0 auto; padding: 34px 22px 26px; }
footer.sf .sf-cols { display: grid; grid-template-columns: 1fr; gap: 26px; }
@media (min-width: 720px) { footer.sf .sf-cols { grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 30px; } }
footer.sf .sf-brand { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; color: var(--text, #e6edf3);
  font-weight: 600; font-size: 1.06rem; margin-bottom: 10px; }
footer.sf .sf-brand img { width: 24px; height: 24px; display: block; }
footer.sf .sf-about { font-size: .88rem; max-width: 34ch; line-height: 1.6; color: var(--muted, #8b98a5); margin: 0; }
footer.sf .sf-h { font-size: .74rem; text-transform: uppercase; letter-spacing: .14em; color: var(--muted, #8b98a5);
  margin: 0 0 8px; font-weight: 700; }
footer.sf .sf-col a { color: var(--muted, #8b98a5); text-decoration: none; display: block; padding: 4px 0; font-size: .9rem; line-height: 1.4; }
footer.sf .sf-col a:hover { color: var(--accent, #3fb950); }
footer.sf .sf-legal { margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--border, #2d3744);
  display: flex; flex-wrap: wrap; gap: 6px 12px; font-size: .82rem; color: var(--muted, #8b98a5); }
footer.sf.slim .sf-in { padding: 22px; }
footer.sf.slim .sf-legal { margin-top: 0; padding-top: 0; border-top: 0; }
footer.sf.slim .sf-legal a { color: var(--muted, #8b98a5); text-decoration: none; }
footer.sf.slim .sf-legal a:hover { color: var(--accent, #3fb950); }