/* ══════════════════════════════════════════════════════════
   Footer — .site-footer and footer layout (3D and IT sites)
   Shared across all Groteska sites.
   ══════════════════════════════════════════════════════════ */

.site-footer {
  background: var(--color-surface);
  border-top: 1px solid var(--color-border);
  padding: var(--space-10) 0;
}
.footer-grid { display: grid; grid-template-columns: 2fr 1fr; gap: var(--space-10); }
.site-footer h4 { color: var(--color-text); margin-bottom: var(--space-5); font-size: var(--font-size-md); font-family: var(--font-family-mono); }
.site-footer p,
.site-footer a { color: var(--color-text-secondary); font-size: var(--font-size-sm); margin: 0 0 var(--space-4) 0; }
.site-footer a:hover { color: var(--color-primary); }
.footer-links ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-4); }

/* ── Responsive ── */
@media (max-width: 768px) {
  .footer-grid { grid-template-columns: 1fr; }
}