feat(v4): Pourquoi → 5 nouveaux segments (F/G/H/I/I.1) + icônes dédiées

Ajoute les segments marché :
- Cat. F — Bureaux d'études (Artelia, BRL, Egis) : brique AMO Eau
- Cat. G — ONG & Associations (Surfrider, FNE) : Aarhus + plaidoyer
- Cat. H — OFB & Parcs Naturels Marins : couverture parc vs point
- Cat. I — Ports & VNF (hors HAROPA) : ICPE + microplastiques + bruit
- Cat. I.1 — Cerema (prescripteur technique)

Mise à jour titre/lead/callout : dix marchés, dix douleurs chiffrées,
un même socle. Nouvelles icônes SVG (blueprint, advocacy, leaf, port,
compass).

src/components/Pourquoi.astro

@@ -49,6 +49,56 @@ const segments = [
     euTag: 'DCE · Green Deal · Taxonomie verte',
     pitch: "Brique capteur milieu naturel compatible Hubgrade / LyRE. CIFRE ou co-développement.",
   },
+  {
+    cat: 'Cat. F',
+    title: "Bureaux d'études",
+    sub: 'Artelia, BRL, Egis',
+    icon: 'blueprint',
+    pain: "Livrer au client final (Agence, port, collectivité) une <strong class=\"text-foam-50\">data continue crédible</strong> là où ils facturent actuellement des campagnes ponctuelles coûteuses.",
+    painSource: '',
+    euTag: 'DCE · ICPE (marchés publics)',
+    pitch: "Brique instrumentation à revendre en marge dans vos missions AMO Eau.",
+  },
+  {
+    cat: 'Cat. G',
+    title: 'ONG & Associations',
+    sub: 'Surfrider, FNE',
+    icon: 'advocacy',
+    pain: "Pas d'accès à la <strong class=\"text-foam-50\">donnée terrain</strong> pour étayer le plaidoyer → dépendance aux rapports publics.",
+    painSource: '',
+    euTag: 'Directive Eaux de Baignade · Convention d\'Aarhus',
+    pitch: "Cartographier une baie pour le prix d'une seule bouée classique. Visibilité média assurée.",
+  },
+  {
+    cat: 'Cat. H',
+    title: 'OFB & Parcs Naturels Marins',
+    sub: '',
+    icon: 'leaf',
+    pain: "Mission de surveillance multi-parcs avec budgets limités — <strong class=\"text-foam-50\">hydrophones à plusieurs k€/point</strong> aujourd'hui, impossible de couvrir un parc entier.",
+    painSource: '',
+    euTag: 'DCSMM · Natura 2000 en mer',
+    pitch: "Couverture acoustique et multi-paramètres continue à l'échelle d'un parc entier, pas d'un point.",
+  },
+  {
+    cat: 'Cat. I',
+    title: 'Ports & VNF',
+    sub: 'hors HAROPA',
+    icon: 'port',
+    pain: "Obligations <strong class=\"text-foam-50\">ICPE</strong>, microplastiques alarmants Seine/Rhône/Loire et bruit anthropique impactant la faune — à documenter.",
+    painSource: '',
+    euTag: 'ICPE · DCSMM D11 (ports inclus) · Plastics Strategy',
+    pitch: "Tableau de bord permanent pour les audits DREAL, sans génie civil.",
+  },
+  {
+    cat: 'Cat. I.1',
+    title: 'Cerema',
+    sub: 'prescripteur technique',
+    icon: 'compass',
+    pain: "Expertise technique sollicitée sans <strong class=\"text-foam-50\">capacité de mesure dense</strong> à disposition.",
+    painSource: '',
+    euTag: 'Transposition technique DCE / DCSMM en France',
+    pitch: "Outil terrain que le Cerema peut recommander aux collectivités en déploiement pilote.",
+  },
 ];
 ---
 
@@ -56,12 +106,12 @@ const segments = [
   <div class="container-narrow">
     <div class="section-title-block">
       <span class="eyebrow">Pourquoi</span>
-      <h2 class="h-section mt-4">Cinq marchés, cinq douleurs chiffrées, un même socle technique.</h2>
+      <h2 class="h-section mt-4">Dix marchés, dix douleurs chiffrées, un même socle technique.</h2>
       <p class="lead mt-6">
         Le monitoring côtier est traversé par des enjeux très différents selon l'acteur :
-        conformité réglementaire, recherche, exploitation, prévention. NowYouSea adresse
-        ces cinq verticales avec une seule plateforme, en s'appuyant sur les cadres
-        européens qui financent leur densification.
+        conformité réglementaire, recherche, exploitation, prévention, plaidoyer, expertise.
+        NowYouSea adresse ces dix verticales avec une seule plateforme, en s'appuyant sur
+        les cadres européens qui financent leur densification.
       </p>
     </div>
 
@@ -110,6 +160,40 @@ const segments = [
                   <path d="M7.5 7.5l3 3M13.5 13.5l3 3M16.5 7.5l-3 3M10.5 13.5l-3 3" stroke="currentColor" stroke-width="1.5"/>
                 </svg>
               )}
+              {s.icon === 'blueprint' && (
+                <svg viewBox="0 0 24 24" class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                  <rect x="3" y="4" width="18" height="16" rx="2"/>
+                  <path d="M3 9h18M9 4v16"/>
+                  <path d="M13 13h5M13 16h3"/>
+                </svg>
+              )}
+              {s.icon === 'advocacy' && (
+                <svg viewBox="0 0 24 24" class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                  <path d="M3 11l10-7v16L3 13z"/>
+                  <path d="M13 9h3a3 3 0 0 1 0 6h-3"/>
+                  <path d="M8 13v4a2 2 0 0 0 4 0v-3"/>
+                </svg>
+              )}
+              {s.icon === 'leaf' && (
+                <svg viewBox="0 0 24 24" class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                  <path d="M5 20c0-9 7-15 15-15 0 9-6 15-15 15z"/>
+                  <path d="M5 20c4-4 8-6 12-8"/>
+                </svg>
+              )}
+              {s.icon === 'port' && (
+                <svg viewBox="0 0 24 24" class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                  <path d="M3 18h18"/>
+                  <path d="M6 18V9l6-4 6 4v9"/>
+                  <path d="M10 18v-5h4v5"/>
+                  <path d="M2 21h20"/>
+                </svg>
+              )}
+              {s.icon === 'compass' && (
+                <svg viewBox="0 0 24 24" class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                  <circle cx="12" cy="12" r="9"/>
+                  <path d="M15.5 8.5L13 13l-4.5 2.5L11 11z"/>
+                </svg>
+              )}
             </span>
             <div class="flex flex-col">
               <span class="text-[10px] font-medium uppercase tracking-[0.2em] text-lagoon-400/80">{s.cat}</span>
@@ -154,8 +238,9 @@ const segments = [
             <span class="text-lagoon-400">Il en faudrait 300.</span>
           </p>
           <p class="mt-3 text-sm text-foam-100/70 max-w-xl">
-            Un seul socle technique, cinq financements européens mobilisables. NowYouSea
-            rend la densification réaliste — au prix accessible à un port de plaisance.
+            Un seul socle technique, dix verticales mobilisables — chacune avec son canal
+            de financement européen. NowYouSea rend la densification réaliste, au prix
+            accessible à un port de plaisance.
           </p>
         </div>
         <div class="flex items-center gap-6 md:flex-col md:items-end md:gap-2">