function Footer({ onNav }) {
  const MAPS_URL = 'https://www.google.com/maps/search/?api=1&query=Vicolo+Grappa+21+Lipari+ME+98055';

  const goToServizi = (e) => {
    e.preventDefault();
    onNav('home');
    setTimeout(() => {
      document.getElementById('as-services')?.scrollIntoView({ behavior: 'smooth' });
    }, 80);
  };

  return (
    <footer className="as-footer">
      <div className="as-footer-grid">
        <div>
          <div className="as-footer-brand">Anna Serra</div>
          <p className="as-footer-blurb">
            Studio di consulenza del lavoro a Lipari per privati, freelance e piccole imprese.
          </p>
        </div>

        <div>
          <h6 className="as-footer-h">Servizi</h6>
          <a href="#" onClick={goToServizi}>Modello 730</a>
          <a href="#" onClick={goToServizi}>F24 / Imposte</a>
          <a href="#" onClick={goToServizi}>Patronato</a>
          <a href="#" onClick={goToServizi}>CAF</a>
        </div>

        <div>
          <h6 className="as-footer-h">Studio</h6>
          <a href="#" onClick={(e) => { e.preventDefault(); onNav('chi-siamo'); }}>Chi siamo</a>
          <a href="#" onClick={(e) => { e.preventDefault(); onNav('scadenze'); }}>Scadenze fiscali</a>
          <a href="#" onClick={(e) => { e.preventDefault(); onNav('faq'); }}>FAQ</a>
          <a href="#" onClick={(e) => { e.preventDefault(); onNav('contatti'); }}>Contatti</a>
        </div>

        <div>
          <h6 className="as-footer-h">Contatti</h6>
          <a href={MAPS_URL} target="_blank" rel="noopener noreferrer">
            Indirizzo: Vicolo Grappa, 21
          </a>
          <a href="tel:+390909813440">Tel: (+39) 090-981-3440</a>
          <a href="tel:+393792800002">Cell: (+39) 379-280-0002</a>
          <a href="mailto:info@annaserra.it">Email: info@annaserra.it</a>
        </div>
      </div>

      <div className="as-footer-bot">
        <span>
          © 2026 Anna Serra · C.F.{' '}
          <span style={{ fontFamily: 'var(--font-mono)' }}>90027820837</span>
        </span>
        <span className="as-footer-legal">
          <a href="#" onClick={(e) => { e.preventDefault(); onNav('privacy'); }}>Privacy Policy</a>
          <span className="as-footer-dot">·</span>
          <a href="#" onClick={(e) => { e.preventDefault(); onNav('cookie-policy'); }}>Cookie Policy</a>
        </span>
        <span className="as-credits">
          Fatto con <span className="as-heart">❤︎</span> da <a href="https://waretagarasu.com/" target="_blank" rel="noopener noreferrer" className="as-credits-link">WaretaGarasu</a>
        </span>
      </div>
    </footer>
  );
}

window.Footer = Footer;