Perf: optimisation vidéos page d'accueil

- Vidéos recompressées (CRF 23, faststart, full res/fps) : 22MB → 5.8MB et 4.8MB
- Champs Kirby dynamiques pour vidéo desktop/mobile + posters
- Source vidéo dynamique via data.backgroundVideo (corrige le hardcode)
- Lecture déclenchée sur canplay plutôt qu'immédiatement (évite freeze)
- preload="auto" pour un buffering plus agressif

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

site/blueprints/pages/home.yml

@@ -41,7 +41,7 @@ tabs:
             type: fields
             fields:
               backgroundVideo:
-                label: Vidéo d'arrière-plan
+                label: Vidéo d'arrière-plan (desktop)
                 type: files
                 layout: cards
                 max: 1
@@ -52,3 +52,35 @@ tabs:
                   cover: true
                 uploads:
                   template: video
+              backgroundVideoPoster:
+                label: Poster vidéo desktop (affiché pendant le chargement)
+                type: files
+                layout: cards
+                max: 1
+                accept: image/*
+                translate: false
+                image:
+                  ratio: 16/9
+                  cover: true
+              backgroundVideoMobile:
+                label: Vidéo d'arrière-plan (mobile)
+                type: files
+                layout: cards
+                max: 1
+                accept: video/*
+                translate: false
+                image:
+                  ratio: 9/16
+                  cover: true
+                uploads:
+                  template: video
+              backgroundVideoMobilePoster:
+                label: Poster vidéo mobile (affiché pendant le chargement)
+                type: files
+                layout: cards
+                max: 1
+                accept: image/*
+                translate: false
+                image:
+                  ratio: 9/16
+                  cover: true

site/templates/home.json.php

@@ -9,7 +9,10 @@ $specificData = [
     'ctaPath' => $page->ctaLink()->toPage()?->id() ?? '#',
     'image' => $page->heroImage()->toFile()?->url()
   ],
-  'backgroundVideo' => $page->backgroundVideo()->toFile()?->url(),
+  'backgroundVideo'             => $page->backgroundVideo()->toFile()?->url(),
+  'backgroundVideoPoster'       => $page->backgroundVideoPoster()->toFile()?->url(),
+  'backgroundVideoMobile'       => $page->backgroundVideoMobile()->toFile()?->url(),
+  'backgroundVideoMobilePoster' => $page->backgroundVideoMobilePoster()->toFile()?->url(),
   'floatingBubbles' => $page->floatingBubbles()->toStructure()->map(function($bubble) {
     return [
       'text' => $bubble->text()->value(),