/* Footer
 *
 * Service links route to the product detail pages so footer navigation stays
 * meaningful from any page on the site. Anchor links use `/#section` form so
 * they work cross-page.
 */
function Footer() {
  return (
    <footer className="footer">
      <div className="wrap">
        <div className="footer-grid">
          <div>
            <a href="/" className="logo" style={{marginBottom: 14, textDecoration: 'none', color: 'inherit'}}>
              <div className="logo-mark">o.</div>
              <span>onlyWA</span>
            </a>
            <p style={{maxWidth: '34ch', fontSize: 14, margin: 0}}>WhatsApp-first growth for small local businesses. Built in India.</p>
          </div>
          <div>
            <h5>Products</h5>
            <a href="/products/whatsapp-chatbot">WhatsApp Chatbot</a>
            <a href="/products/website">Website Design</a>
            <a href="/products/meta-ads">Meta Ads</a>
            <a href="/products/crm">CRM & Database</a>
            <a href="/products">See all →</a>
          </div>
          <div>
            <h5>Company</h5>
            <a href="/#process">How we work</a>
            <a href="/#cases">Case studies</a>
            <a href="/#pricing">Pricing</a>
            <a href="/#faq">FAQ</a>
          </div>
          <div>
            <h5>Talk to us</h5>
            <a href="/#contact">WhatsApp</a>
            <a href="/#contact">Email</a>
            <a href="/#contact">Book a call</a>
          </div>
        </div>
        <div className="footer-bottom">
          <span>© 2026 onlyWA · India</span>
          <span>Meta Business Partner · Official WhatsApp Cloud API</span>
        </div>
      </div>
    </footer>
  );
}
window.Footer = Footer;