function Footer() {
  return (
    <>
      <section style={{
        background: 'linear-gradient(160deg, var(--navy-800) 0%, var(--navy-900) 100%)',
        padding: '96px 32px',
        textAlign: 'center',
        borderTop: '1px solid var(--border-on-dark)',
      }}>
        <div style={{ maxWidth: 820, margin: '0 auto' }}>
          <h2 data-anim="fade-up" style={{
            fontFamily: 'var(--font-sans)', fontWeight: 700,
            fontSize: 'clamp(32px, 4.4vw, 52px)', lineHeight: 1.08,
            letterSpacing: '-0.025em', color: 'var(--cream-50)',
            margin: '0 0 28px', textWrap: 'balance',
          }}>
            Seus concorrentes já vendem para o governo.{' '}
            <span style={{ fontFamily: 'var(--font-serif)', fontStyle: 'italic', fontWeight: 400, color: 'var(--magenta-400)' }}>
              Quando vai ser a sua vez?
            </span>
          </h2>
          <p data-anim="fade-up" data-anim-delay="1" style={{ fontSize: 18, lineHeight: 1.6, color: 'var(--cream-200)', margin: '0 0 36px' }}>
            A ResultaHub já fez esse caminho com dezenas de empresas. Pode fazer com a sua também.
          </p>
          <a data-anim="fade-up" data-anim-delay="2" className="btn btn-primary magnetic" data-magnet="0.18" href="https://wa.me/5511939197036" style={{ padding: '18px 32px', fontSize: 16 }}>
            Falar com especialista agora
            <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M20.5 3.5A11 11 0 003.6 17.7L2 22l4.4-1.5A11 11 0 0020.5 3.5zm-8.6 16.9a8.9 8.9 0 01-4.5-1.2l-.3-.2-2.7.9.9-2.6-.2-.3A8.9 8.9 0 1112 20.4zm5.1-6.7c-.3-.1-1.7-.8-2-.9s-.5-.1-.7.2c-.2.3-.7.9-.9 1.1-.2.2-.3.2-.6.1a7 7 0 01-2.1-1.3 7.8 7.8 0 01-1.4-1.8c-.2-.3 0-.4.1-.6l.4-.5c.1-.2.2-.3.3-.5s0-.4 0-.5-.7-1.7-1-2.3-.5-.5-.7-.5h-.6c-.2 0-.5.1-.7.4a3 3 0 00-1 2.3 5.5 5.5 0 001.2 2.9 12.3 12.3 0 004.7 4.1c.7.3 1.2.5 1.6.6.7.2 1.3.2 1.8.1.5-.1 1.7-.7 1.9-1.4s.2-1.2.2-1.3-.3-.2-.5-.4z"/></svg>
          </a>
        </div>
      </section>

      <footer style={{ background: 'var(--navy-950)', padding: '64px 32px 32px', borderTop: '1px solid var(--border-on-dark)' }}>
        <div style={{ maxWidth: 1120, margin: '0 auto' }}>
          <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start', gap: 32, flexWrap: 'wrap', marginBottom: 48 }}>
            <div>
              <Logo height={36} />
              <p style={{ marginTop: 16, fontSize: 14, color: 'var(--cream-200)', maxWidth: 320, lineHeight: 1.6 }}>
                Consultoria 360° em licitações públicas. Do cadastro ao contrato assinado.
              </p>
            </div>
            <div style={{
              fontFamily: 'var(--font-sans)', fontWeight: 600, fontSize: 18,
              color: 'var(--cream-200)', letterSpacing: '-0.005em', maxWidth: 380, textAlign: 'right',
            }}>
              Estratégia. Conexão. Plano.{' '}
              <span style={{ color: 'var(--magenta-400)', fontWeight: 700 }}>RESULTADOS REAIS.</span>
            </div>
          </div>
          <div style={{ paddingTop: 24, borderTop: '1px solid var(--border-on-dark)', display: 'flex', justifyContent: 'space-between', flexWrap: 'wrap', gap: 16, fontSize: 12, color: 'rgba(246,241,230,.45)' }}>
            <span>© 2025 ResultaHub. Todos os direitos reservados.</span>
            <span>Conformidade LGPD</span>
          </div>
        </div>
      </footer>
    </>
  );
}
window.Footer = Footer;