feat: pivot complet - agence web artisans BTP Nord + Sanity CMS

Transformation complète du site HookLab de formation TikTok Shop
vers une landing page haute conversion pour agence web locale ciblant
les artisans du bâtiment dans le Nord (Douai, Orchies, Valenciennes).

- Nouveau design system : bleu nuit/orange sur fond clair (mobile-first)
- Hero avec promesse artisan + CTA orange "Réserver mon Audit"
- Section "Le Système" (3 étapes : Trouvé, Choisi, Contacté)
- Portfolio connecté à Sanity.io (fallback data intégré)
- Section "Qui suis-je" avec carte OpenStreetMap interactive
- FAQ orientée artisans avec JSON-LD pour Google
- Formulaire contact audit gratuit
- SEO local : 12 keywords artisans, JSON-LD LocalBusiness
- Sanity.io schemas (portfolio, siteSettings) + client conditionnel
- Accessibilité : skip-to-content, focus-visible, aria-labels

https://claude.ai/code/session_01H2aRGDaKgarPvhay2HxN6Y

components/CookieBanner.tsx

@@ -0,0 +1,60 @@
+"use client";
+
+import { useState, useEffect } from "react";
+import Link from "next/link";
+
+export default function CookieBanner() {
+  const [visible, setVisible] = useState(false);
+
+  useEffect(() => {
+    const consent = localStorage.getItem("hooklab_cookie_consent");
+    if (!consent) {
+      setVisible(true);
+    }
+  }, []);
+
+  const handleAccept = () => {
+    localStorage.setItem("hooklab_cookie_consent", "accepted");
+    setVisible(false);
+  };
+
+  const handleRefuse = () => {
+    localStorage.setItem("hooklab_cookie_consent", "refused");
+    setVisible(false);
+  };
+
+  if (!visible) return null;
+
+  return (
+    <div
+      className="fixed bottom-0 left-0 right-0 z-[90] p-4 sm:p-6"
+      role="dialog"
+      aria-label="Gestion des cookies"
+    >
+      <div className="max-w-2xl mx-auto bg-dark-light border border-dark-border rounded-2xl p-4 sm:p-6 shadow-2xl">
+        <p className="text-white/80 text-sm leading-relaxed mb-4">
+          Ce site utilise uniquement des <strong className="text-white">cookies techniques</strong> n&eacute;cessaires
+          au fonctionnement de la plateforme (authentification, session). Aucun cookie publicitaire
+          ou de tra&ccedil;age n&rsquo;est utilis&eacute;.{" "}
+          <Link href="/confidentialite" className="text-primary hover:underline">
+            Politique de confidentialit&eacute;
+          </Link>
+        </p>
+        <div className="flex flex-col sm:flex-row gap-2 sm:gap-3">
+          <button
+            onClick={handleAccept}
+            className="px-5 py-2.5 gradient-bg text-white text-sm font-semibold rounded-xl hover:opacity-90 transition-opacity cursor-pointer"
+          >
+            Accepter
+          </button>
+          <button
+            onClick={handleRefuse}
+            className="px-5 py-2.5 bg-dark-lighter border border-dark-border text-white/60 text-sm font-medium rounded-xl hover:text-white transition-colors cursor-pointer"
+          >
+            Refuser
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}