function Footer() {
  return (
    <footer className="footer">
      <div className="container">
        <div className="footer-grid">
          <div>
            <div className="footer-mark">BASE<span className="num">38</span></div>
            <p className="footer-tagline">
              The boutique AI partner for Australian small business. Boring word for it.
              Genuinely fun work.
            </p>
            <div className="footer-social">
              <a href="#" aria-label="LinkedIn">
                <svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor"><path d="M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z"/></svg>
              </a>
              <a href="#" aria-label="Instagram">
                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><rect x="2" y="2" width="20" height="20" rx="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37zM17.5 6.5h.01"/></svg>
              </a>
              <a href="#" aria-label="X">
                <svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>
              </a>
            </div>
          </div>

          <div>
            <h4>Sitemap</h4>
            <ul>
              <li><a href="#what-we-do">What we do</a></li>
              <li><a href="#use-cases">Use cases</a></li>
              <li><a href="#process">Process</a></li>
              <li><a href="#try-it">Try it live</a></li>
              <li><a href="#about">About</a></li>
            </ul>
          </div>

          <div>
            <h4>Contact</h4>
            <ul>
              <li><a href="mailto:hello@base38.com.au">hello@base38.com.au</a></li>
              <li><a href="tel:+61400000000">+61 4 0000 0000</a></li>
              <li><a href="#">Brisbane · Australia</a></li>
              <li><a href="#contact">Book a chat →</a></li>
            </ul>
          </div>

          <div className="footer-cta">
            <h3>Still reading?</h3>
            <p>That's a lead by our standards. Let's actually talk.</p>
            <a href="#contact" className="btn">
              Book a chat
              <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.4" strokeLinecap="round" strokeLinejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
            </a>
          </div>
        </div>

        <div className="footer-bottom">
          <span>© 2026 Base 38 Pty Ltd · ABN 00 000 000 000</span>
          <span>Built with care · and a bit of AI · in Brisbane</span>
        </div>
      </div>
    </footer>
  );
}
window.Footer = Footer;