// Footer.jsx — minimal three-column dark footer + mobile sticky CTA
function Footer() {
  return (
    <footer className="footer">
      <div className="footer-inner">
        <div className="footer-col">
          <div className="footer-word">LA Media Wall</div>
          <p className="footer-blurb">Custom media walls, fireplace walls, and TV feature walls. Southern California.</p>
        </div>
        <div className="footer-col">
          <span className="eyebrow on-dark">— Navigate</span>
          <ul className="footer-list">
            <li><a href="#work">Work</a></li>
            <li><a href="#styles">Styles</a></li>
            <li><a href="#process">Process</a></li>
          </ul>
        </div>
        <div className="footer-col">
          <span className="eyebrow on-dark">— Reach Us</span>
          <ul className="footer-list">
            <li><a href="tel:17472438969">(747) 243-8969</a></li>
            <li><a href="mailto:lamediawall@gmail.com">lamediawall@gmail.com</a></li>
            <li><a href="https://www.instagram.com/lamediawall/" target="_blank" rel="noopener">@lamediawall</a></li>
          </ul>
          <a href="#contact" className="btn btn-primary-light footer-cta">Request an Estimate</a>
        </div>
      </div>
      <div className="footer-rule" />
      <div className="footer-base">
        <span>© 2026 LA Media Wall</span>
        <span>Designed and built in Southern California</span>
      </div>
    </footer>
  );
}

function MobileCTA() {
  return (
    <a href="#contact" className="mobile-cta">Request Estimate</a>
  );
}

window.Footer = Footer;
window.MobileCTA = MobileCTA;