function Footer() {
  const socials = window.socials || [];
  return (
    <footer style={{ background: "var(--bg-void)", borderTop: "1px solid var(--border-void-soft)", padding: "var(--space-6)", display: "flex", alignItems: "center", justifyContent: "space-between", flexWrap: "wrap", gap: 16 }}>
      <div style={{ color: "var(--text-on-void-muted)", fontSize: "var(--fs-label-mono)", letterSpacing: "var(--ls-label-mono)", textTransform: "uppercase", fontFamily: "var(--font-mono)" }}>© 2026 Studio Gibbeuse</div>
      <div style={{ display: "flex", gap: 16 }}>
        {socials.map((s) => (
          <a key={s.name} href={s.href} title={s.name} target="_blank" rel="noopener noreferrer"><img src={`https://cdn.simpleicons.org/${s.name}/ffffff`} alt={s.name} width="15" height="15" style={{ opacity: 0.45 }} /></a>
        ))}
      </div>
    </footer>
  );
}
window.Footer = Footer;