Perf: optimisation vidéos page expertise

- Vidéos recompressées (CRF 23, faststart) : 13MB → 3.4MB et 3.7MB
- Champs Kirby dynamiques pour vidéo normale et inverse
- Sources dynamiques via data.backgroundVideo / data.backgroundVideoReverse

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

site/blueprints/pages/expertise.yml

@@ -53,3 +53,37 @@ tabs:
                           - heading
                         headings:
                           - 3
+
+  media:
+    label: Médias
+    icon: image
+    columns:
+      - width: 1/2
+        sections:
+          mediaFields:
+            type: fields
+            fields:
+              backgroundVideo:
+                label: Vidéo d'arrière-plan (sens normal)
+                type: files
+                layout: cards
+                max: 1
+                accept: video/*
+                translate: false
+                image:
+                  ratio: 16/9
+                  cover: true
+                uploads:
+                  template: video
+              backgroundVideoReverse:
+                label: Vidéo d'arrière-plan (sens inverse)
+                type: files
+                layout: cards
+                max: 1
+                accept: video/*
+                translate: false
+                image:
+                  ratio: 16/9
+                  cover: true
+                uploads:
+                  template: video

site/templates/expertise.json.php

@@ -2,6 +2,8 @@
 
 $specificData = [
   'pageTitle'              => $page->writer()->value(),
+  'backgroundVideo'        => $page->backgroundVideo()->toFile()?->url(),
+  'backgroundVideoReverse' => $page->backgroundVideoReverse()->toFile()?->url(),
   'items'                  => $page->body()->toBlocks()->filter(fn($b) => $b->type() === 'text')->map(fn($block) => [
     'text' => $block->text()->value()
   ])->values()

src/views/Expertise.svelte

@@ -232,7 +232,7 @@
       playsinline
       preload="auto"
     >
-      <source src="/assets/video/BACKGROUND_VIDEO_MISSION.mp4" type="video/mp4" />
+      <source src={data.backgroundVideo ?? '/assets/video/BACKGROUND_VIDEO_MISSION.mp4'} type="video/mp4" />
     </video>
     <video
       bind:this={videoRev}
@@ -241,7 +241,7 @@
       playsinline
       preload="auto"
     >
-      <source src="/assets/video/BACKGROUND_VIDEO_MISSION_REVERSE.mp4" type="video/mp4" />
+      <source src={data.backgroundVideoReverse ?? '/assets/video/BACKGROUND_VIDEO_MISSION_REVERSE.mp4'} type="video/mp4" />
     </video>
   </div>