// FOOTER — minimal merchant-house colophon
function Footer() {
  return (
    <>
      <style>{`
        .footer{background:var(--navy-2);color:rgba(243,238,227,.7);padding:64px 0 28px}
        .footer-top{
          display:grid;grid-template-columns:1fr auto 1fr;gap:48px;
          align-items:center;padding-bottom:48px;
          border-bottom:1px solid rgba(243,238,227,.12);
        }
        .footer-tag{
          font-family:var(--mono);font-size:10px;letter-spacing:.2em;
          text-transform:uppercase;
        }
        .footer-tag.right{text-align:right}
        .footer-bot{
          display:flex;align-items:center;justify-content:space-between;
          padding-top:24px;flex-wrap:wrap;gap:16px;
        }
        .footer-bot .copy{
          font-family:var(--mono);font-size:11px;letter-spacing:.1em;
          color:rgba(243,238,227,.4);
        }
        .footer-bot .links{display:flex;gap:24px}
        .footer-bot .links a{
          font-family:var(--mono);font-size:11px;letter-spacing:.1em;
          color:rgba(243,238,227,.5);text-transform:uppercase;cursor:pointer;
        }
        .footer-bot .links a:hover{color:var(--paper)}
        @media (max-width:760px){
          .footer-top{grid-template-columns:1fr;text-align:center;gap:24px}
          .footer-tag.right{text-align:center}
        }
      `}</style>
      <footer className="footer">
        <div className="container">
          <div className="footer-top">
            <div className="footer-tag">A merchant house · Est. 2020</div>
            <SBMonogram size={92} variant="neg" />
            <div className="footer-tag right">Miami · 1200 Brickell Ave.</div>
          </div>
          <div className="footer-bot">
            <div className="copy">© {new Date().getFullYear()} The Sicilian Brothers LLC. All rights reserved.</div>
            <div className="links">
              <a>Privacy</a>
              <a>Terms</a>
              <a href="mailto:info@sicilianbrothers.com">info@sicilianbrothers.com</a>
            </div>
          </div>
        </div>
      </footer>
    </>
  );
}

window.Footer = Footer;