function Footer() {
  const { SocialButton } = window.VizeProDamboIceDesignSystem_70ea19;
  return (
    <footer id="kontakt" style={{ background: 'var(--surface-page)' }}>
      {/* kurátorovaná silueta vesnice (uprostřed radnice + kostel + hospoda),
          šedá kontura na bílém pozadí, posazená na černé hraně patičky */}
      <div style={{ padding: 'var(--space-7) var(--gutter) 0', marginBottom: -1 }}>
        <window.FooterSkyline color="var(--ink-900)" opacity={0.45} />
      </div>
      <div style={{ background: 'var(--ink-900)', color: 'var(--white)' }}>
      <div style={{ maxWidth: 'var(--container)', margin: '0 auto', padding: 'var(--section-y) var(--gutter)' }}>
        <div className="vpd-footer-top" style={{
          display: 'grid', gridTemplateColumns: '1fr auto', gap: 'var(--space-7)', alignItems: 'center',
        }}>
          <div>
            <img src="assets/logo.png" alt="Vize pro Dambořice"
              style={{ height: 84, width: 'auto', background: '#fff', borderRadius: 'var(--radius-md)', padding: 10 }} />
            <h2 style={{ fontFamily: 'var(--font-heading)', fontWeight: 700, fontSize: 'var(--fs-h2)', color: '#fff', margin: 'var(--space-5) 0 var(--space-3)', letterSpacing: 'var(--ls-tight)' }}>
              Sledujte nás a buďte u toho.
            </h2>
            <p style={{ fontFamily: 'var(--font-body)', fontSize: 'var(--fs-body)', lineHeight: 'var(--lh-normal)', color: 'rgba(255,255,255,0.72)', margin: 0, maxWidth: '46ch' }}>
              Hlavní novinky zveřejňujeme na Facebooku a Instagramu. Web <strong style={{ color: '#fff', fontWeight: 600 }}>VizeProDamborice.cz</strong> je váš rozcestník.
            </p>
          </div>
          <div className="vpd-footer-cta" style={{ display: 'flex', flexDirection: 'column', gap: 'var(--space-3)', minWidth: 240 }}>
            <SocialButton channel="facebook" href={window.FB_URL} size="lg" fullWidth label="Facebook" />
            <SocialButton channel="instagram" href={window.IG_URL} size="lg" fullWidth label="Instagram" />
          </div>
        </div>

        <hr style={{ border: 0, borderTop: '1px solid rgba(255,255,255,0.14)', margin: 'var(--space-7) 0 var(--space-5)' }} />

        <div className="vpd-footer-bottom" style={{
          display: 'flex', justifyContent: 'space-between', alignItems: 'center', gap: 'var(--space-4)', flexWrap: 'wrap',
        }}>
          <div>
            <div style={{ fontFamily: 'var(--font-heading)', fontWeight: 600, fontSize: 'var(--fs-small)', color: '#fff' }}>
              Vize pro Dambořice — nezávislí kandidáti · komunální volby 2026
            </div>
            <div style={{ fontFamily: 'var(--font-body)', fontSize: 13, color: 'rgba(255,255,255,0.55)', marginTop: 4 }}>
              Nejsme členy žádné politické strany.
            </div>
          </div>
          <div style={{ fontFamily: 'var(--font-body)', fontSize: 13, color: 'rgba(255,255,255,0.45)' }}>
            © 2026 VizeProDamborice.cz
          </div>
        </div>
      </div>
      </div>
    </footer>
  );
}
window.Footer = Footer;