obc-terrassement/components/marketing/Footer.tsx

import Link from "next/link";

export default function Footer() {
  return (
    <footer className="border-t border-border py-10 md:py-12 bg-bg-white">
      <div className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
        <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
          {/* Brand */}
          <div>
            <Link href="/" className="flex items-center gap-2 mb-3" aria-label="HookLab - Accueil">
              <div className="w-8 h-8 bg-navy rounded-lg flex items-center justify-center">
                <span className="text-white font-bold text-sm">H</span>
              </div>
              <span className="text-lg font-bold text-navy">
                Hook<span className="text-orange">Lab</span>
              </span>
            </Link>
            <p className="text-text-light text-sm leading-relaxed max-w-xs">
              Cr&eacute;ation de sites pour le B&acirc;timent et l&rsquo;Artisanat.
            </p>
            <p className="text-text-muted text-xs mt-3">
              59148 Flines-lez-Raches
            </p>
          </div>

          {/* Expertises SEO */}
          <div>
            <h4 className="text-navy font-semibold text-sm mb-4">
              Expertises
            </h4>
            <ul className="space-y-2 text-text-light text-sm">
              <li>Site internet Couvreur</li>
              <li>SEO Ma&ccedil;onnerie</li>
              <li>Webmaster Paysagiste</li>
              <li>Visibilit&eacute; Menuisier</li>
            </ul>
          </div>

          {/* Legal */}
          <div>
            <h4 className="text-navy font-semibold text-sm mb-4">L&eacute;gal</h4>
            <ul className="space-y-2">
              <li>
                <Link href="/mentions-legales" className="text-text-light hover:text-navy text-sm transition-colors">
                  Mentions l&eacute;gales
                </Link>
              </li>
              <li>
                <Link href="/confidentialite" className="text-text-light hover:text-navy text-sm transition-colors">
                  Politique de Confidentialit&eacute;
                </Link>
              </li>
              <li>
                <Link href="/plan-du-site" className="text-text-light hover:text-navy text-sm transition-colors">
                  Plan du site
                </Link>
              </li>
            </ul>
          </div>
        </div>

        {/* Bottom SEO */}
        <div className="border-t border-border mt-8 pt-6 flex flex-col md:flex-row items-center justify-between gap-3">
          <p className="text-text-muted text-xs">
            &copy; {new Date().getFullYear()} HookLab &mdash; Enguerrand Ozano &middot; SIREN 994 538 932
          </p>
          <p className="text-text-muted text-xs text-center md:text-right">
            Intervention : Douai &middot; Orchies &middot; Arleux &middot; Valenciennes &middot; Saint-Amand-les-Eaux
          </p>
        </div>
      </div>
    </footer>
  );
}