// Footer — clean lockup at top (Logo SVG + tagline), 4-column links below.
// The giant 280px ASCII-style wordmark is gone.

const Footer = () => (
  <footer className="bfooter grain grain--dark">
    <div className="bfooter__inner">

      <div className="bfooter__hero">
        <Logo variant="with-label" height={36} dark />
      </div>

      <div className="bfooter__cols">
        <div className="bfooter__col">
          <span className="bfooter__col-title">Le studio</span>
          <p>Studio de développement web sur-mesure et déploiement d’agents IA à Marseille. Sites, SaaS, applications métier. Deux développeurs fondateurs, zéro sous-traitance, hébergement 100 % européen.</p>
        </div>
        <div className="bfooter__col">
          <span className="bfooter__col-title">Nos services</span>
          <a href="projets.html">Réalisations</a>
          <a href="agents.html">Agents IA</a>
          <a href="developpement.html">Développement web</a>
        </div>
        <div className="bfooter__col">
          <span className="bfooter__col-title">L'équipe</span>
          <a href="a-propos.html">À propos</a>
          <a href="contact.html">Contact</a>
          <a href="diagnostic.html">Diagnostic gratuit</a>
        </div>
        <div className="bfooter__col">
          <span className="bfooter__col-title">Contact</span>
          <a href="mailto:hello@latraverse.studio">hello@latraverse.studio</a>
          <a href="tel:+33601350754">+33 6 01 35 07 54</a>
          <a>13007 / Marseille</a>
        </div>
      </div>

      <div className="bfooter__bottom">
        <span className="bfooter__copy">© 2026 La Traverse · Marseille · Tous droits réservés</span>
        <div className="bfooter__legal">
          <a href="mentions-legales.html">Mentions légales</a>
          <a href="confidentialite.html">Confidentialité</a>
        </div>
      </div>
    </div>
    <div className="bfooter__horizon" aria-hidden="true"></div>
  </footer>
);

window.Footer = Footer;