Hero loop: drop poster, fade the video in on play

Can't generate a frame poster (the loop is VP9; fine for real browsers but the
review tooling can't decode it), so rely on the paper-tinted panel as the
instant never-blank base and fade the video in on the 'playing' event. Cleaner
and removes a 404. VP9 confirmed — plays on all modern browsers + iOS 14.5+.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

index.html

@@ -88,7 +88,7 @@
       <p class="call">or call <a class="tel" data-p1="778" data-p2="985" data-p3="6736" href="#contact">778&#8209;985&#8209;OPEN (6736)</a></p>
     </div>
     <div class="hero-media" aria-hidden="true">
-      <video class="hero-video" muted loop playsinline preload="none" poster="assets/media/hero-loop-poster.webp" data-src="assets/media/hero-loop.webm"></video>
+      <video class="hero-video" muted loop playsinline preload="none" data-src="assets/media/hero-loop.webm"></video>
     </div>
     </div>
   </section>
@@ -374,6 +374,7 @@ Cal("init", { origin: "https://cal.shopwisdom.ca" });
   var src = hv.getAttribute('data-src'); if (!src) return;
   var s = document.createElement('source'); s.src = src; s.type = 'video/webm';
   hv.appendChild(s); hv.load();
+  hv.addEventListener('playing', function () { hv.classList.add('is-playing'); }, { once: true });
   var p = hv.play(); if (p && p.catch) p.catch(function () {});
 })();
 </script>