/* Footer — clean identity-led close */

function Footer() {
  return (
    <footer className="footer" data-screen-label="07 Footer">
      <div className="footer__inner">
        <div className="footer__top">
          <div className="footer__tagline">
            <div className="footer__tagline-eyebrow">·  ESTABLISHED 2026</div>
            <div className="footer__tagline-line">Instant<br/>Integrated<br/>Intelligence<span className="footer__stop"></span></div>
          </div>
          <div className="footer__logo-wrap">
            <BodeLogo className="footer__logo" />
          </div>
        </div>

        <div className="footer__cols">
          {[
            { code: "01", label: "PROFILE",      hint: "Identity" },
            { code: "02", label: "INTEGRATIONS", hint: "Connect a source" },
            { code: "03", label: "AGENT",        hint: "Ask anything" },
            { code: "04", label: "CANVAS",       hint: "Working artifacts" },
          ].map((c) => (
            <div className="footer__col" key={c.code}>
              <div className="footer__col-num">· {c.code}</div>
              <div className="footer__col-label">{c.label}</div>
              <div className="footer__col-hint">{c.hint}</div>
            </div>
          ))}
        </div>

        <div className="footer__bottom">
          <span>© 2026 BODE AI Ltd · All rights reserved</span>
          <span className="footer__contact">
            <a href="#contact">Request access via the form ↗</a>
          </span>
        </div>
      </div>
    </footer>
  );
}

window.Footer = Footer;