/* global React, Icon, Icons */

function Footer() {
  return (
    <footer className="site-footer">
      <div className="container">
        <div className="columns">
          <div>
            <div className="footer-brand">
              <img src={window.__resources.img01} alt="Your Sign Guy"/>
              <span className="wordmark">Your Sign Guy<small>Colorado's Sign Experts</small></span>
            </div>
            <p className="blurb">
              Based in Erie, Colorado. We design, fabricate, and install custom signage
              for businesses across the Front Range — from Fort Collins to Pueblo.
              From the smallest engraved sign to massive flex-face displays.
            </p>
            <div className="blurb-row">
              <span><Icon d={Icons.Phone} size={16}/> 720·925·1172</span>
              <span><Icon d={Icons.Mail} size={16}/> Michael@YourSignGuyCO.com</span>
            </div>
          </div>
          <div>
            <h5>Services</h5>
            <a href="#services">Storefronts &amp; Channel Letters</a>
            <a href="#services">Monument Signs</a>
            <a href="#services">Vehicle Wraps &amp; Fleet</a>
            <a href="#services">Dimensional Letters</a>
            <a href="#services">ADA &amp; Wayfinding</a>
            <a href="#services">LED Neon &amp; Lobby</a>
            <a href="#services">Window Vinyl</a>
            <a href="#services">Event &amp; Banners</a>
          </div>
          <div>
            <h5>Shop</h5>
            <a href="#about">About</a>
            <a href="#process">Our Process</a>
            <a href="#work">Recent Work</a>
            <a href="#quote">Get a Quote</a>
          </div>
          <div>
            <h5>Visit</h5>
            <p style={{ fontSize: 14, lineHeight: 1.7, color: 'rgba(255,255,255,.78)', margin: 0 }}>
              <strong style={{ color: 'var(--white)' }}>Your Sign Guy LLC</strong><br/>
              Michael Zaun, Owner<br/>
              Erie, Colorado<br/><br/>
              <span style={{ display: 'inline-flex', alignItems: 'center', gap: 8 }}>
                <Icon d={Icons.Clock} size={14}/> Mon–Fri · 8a–5p
              </span>
            </p>
          </div>
        </div>
        <hr/>
        <div className="legal">
          <span>© 2026 Your Sign Guy LLC · All rights reserved</span>
          <span>Erie · Colorado · Front Range</span>
        </div>
      </div>
    </footer>
  );
}

window.Footer = Footer;