feat(aep-v1.1): PA1 fix DOM-TOM pattern desktop 2 onglets

- Remplace le bandeau DOM-TOM 140px (UX cassée, pin inaccessible) par
  un pattern 2 onglets en haut de carte (Metropole/Europe vs Outre-mer)
- Applique le pattern symetriquement sur pratiques-regeneratives.vue
  et index.vue
- Carte selectionnee occupe toute la hauteur dispo, accordeon DOM-TOM
  scrollable

pages/pratiques-regeneratives.vue

@@ -26,10 +26,37 @@
     <!-- ═══════════════════════════════════════ ZONE CENTRALE (carte) -->
     <main class="flex-1 flex flex-col overflow-hidden relative">
 
-      <!-- ── VUE DESKTOP : Europe pleine largeur + DOM-TOM row en bas ── -->
+      <!-- ── VUE DESKTOP : Onglets Europe / Outre-mer + carte pleine hauteur ── -->
       <div class="hidden lg:flex lg:flex-1 lg:flex-col lg:overflow-hidden">
-        <!-- Carte Europe — pleine largeur -->
-        <div class="flex flex-col flex-1 overflow-hidden">
+
+        <!-- Onglets Europe / Outre-mer (desktop) -->
+        <div class="shrink-0 flex" style="background: var(--nav-surface); border-bottom: 1px solid var(--nav-bg-alt);">
+          <button
+            type="button"
+            class="flex-1 py-2 text-sm font-medium transition-colors"
+            :style="desktopMapView === 'europe'
+              ? 'color: var(--nav-text); border-bottom: 2px solid var(--nav-primary-solid);'
+              : 'color: var(--nav-text-muted); border-bottom: 2px solid transparent;'"
+            @click="desktopMapView = 'europe'"
+          >
+            Europe
+            <span class="ml-1 text-xs opacity-70">({{ europeOrgs.length }})</span>
+          </button>
+          <button
+            type="button"
+            class="flex-1 py-2 text-sm font-medium transition-colors"
+            :style="desktopMapView === 'outremer'
+              ? 'color: var(--nav-text); border-bottom: 2px solid var(--nav-primary-solid);'
+              : 'color: var(--nav-text-muted); border-bottom: 2px solid transparent;'"
+            @click="desktopMapView = 'outremer'"
+          >
+            Outre-mer
+            <span class="ml-1 text-xs opacity-70">({{ outremerOrgs.length }})</span>
+          </button>
+        </div>
+
+        <!-- Carte Europe (pleine hauteur) -->
+        <div v-show="desktopMapView === 'europe'" class="flex flex-col flex-1 overflow-hidden">
           <div class="relative flex-1" style="min-height: 200px;">
             <ClientOnly>
               <EuropeMap
@@ -50,11 +77,8 @@
           </div>
         </div>
 
-        <!-- Bandeau DOM-TOM — row horizontale pleine largeur, hauteur fixe -->
-        <div
-          class="shrink-0"
-          style="height: 140px; border-top: 1px solid var(--nav-bg-alt);"
-        >
+        <!-- Carte Outre-mer (pleine hauteur, scroll) -->
+        <div v-show="desktopMapView === 'outremer'" class="flex-1 overflow-y-auto" style="background: var(--nav-bg);">
           <ClientOnly>
             <OutremerMapPratiques
               :orgs="outremerOrgs"
@@ -63,7 +87,7 @@
             />
             <template #fallback>
               <div
-                class="flex items-center justify-center h-full text-sm"
+                class="flex items-center justify-center h-48 text-sm"
                 style="color: var(--nav-text-muted);"
               >
                 Chargement…
@@ -307,6 +331,7 @@ const pays = ref<string[]>(
 
 const selectedId = ref<number | null>(null)
 const mobileMapView = ref<'europe' | 'outremer'>('europe')
+const desktopMapView = ref<'europe' | 'outremer'>('europe')
 
 // Refs vers les instances EuropeMap
 const europeMapRef = ref<any>(null)