// Demandscape website — footer (parent attribution steps forward here)
function Footer({ onNav }) {
  const { Logo } = window.DemandscapeDesignSystem_0e6a32;
  return (
    <footer className="footer">
      <div className="container">
        <div className="footer__top">
          <div style={{ maxWidth: 340 }}>
            <button className="brandbtn" onClick={() => onNav('home')} aria-label="Demandscape home">
              <Logo size={24} tone="white" />
            </button>
            <p style={{ marginTop: 16, fontSize: 14, lineHeight: 1.65, color: 'rgba(255,255,255,.7)' }}>
              Demandscape is a Rosroe technology, developed from original research at the
              University of Oxford.
            </p>
          </div>
          <div className="footer__cols">
            <div className="footer__col">
              <h4>Product</h4>
              <a onClick={() => onNav('home')}>Home</a>
              <a onClick={() => onNav('platform')}>Platform</a>
              <a onClick={() => onNav('demo')}>Request a demo</a>
            </div>
            <div className="footer__col">
              <h4>Company</h4>
              <a onClick={() => onNav('about')}>About</a>
              <a href="mailto:hello@rosroe.com">hello@rosroe.com</a>
              <a href="https://rosroe.com" target="_blank" rel="noreferrer">rosroe.com</a>
            </div>
          </div>
        </div>
        <div className="footer__bottom">
          <span>© 2026 Rosroe. All rights reserved.</span>
          <span className="mono">[ demandscape ] · a Rosroe technology</span>
        </div>
      </div>
    </footer>
  );
}
window.Footer = Footer;