const Footer = () => {
  return (
    <footer className="footer">
      <div className="container">
        <div className="footer-grid">
          <div className="brand">
            <div>
              <Logo height={36}/>
            </div>
            <p>Studio de produto digital. Desenhamos, programamos e lançamos sites, softwares, SaaS, automações, e-commerces e as marcas que vestem tudo isso.</p>
          </div>
          <div>
            <h4>Studio</h4>
            <a href="#services">Serviços</a>
            <a href="#process">Processo</a>
            <a href="#about">Time</a>
            <a href="#cases">Cases</a>
          </div>
          <div>
            <h4>Produtos</h4>
            <a href="https://www.bboxconnect.com.br/" target="_blank" rel="noopener">BBOX Connect ↗</a>
            <a href="#contact">Sob-demanda</a>
          </div>
          <div>
            <h4>Contato</h4>
            <a href="mailto:contato@bboxdigital.com.br">contato@bboxdigital.com.br</a>
            <a href="https://wa.me/5511987411333" target="_blank" rel="noopener noreferrer">WhatsApp</a>
            <a href="https://instagram.com/bbox.digital" target="_blank" rel="noopener noreferrer">Instagram</a>
            <a href="https://linkedin.com/company/bboxdigital" target="_blank" rel="noopener noreferrer">LinkedIn</a>
          </div>
        </div>
        <div className="footer-base">
          <span>© 2026 BBOX Digital · CNPJ 66.225.126/0001-72</span>
          <span>Feito com ◦ cuidado em São Paulo</span>
        </div>
      </div>
    </footer>
  );
};
window.Footer = Footer;