diff --git a/assets/hero/hero-poster.jpg b/assets/hero/hero-poster.jpg
new file mode 100644
index 0000000..d354e1f
Binary files /dev/null and b/assets/hero/hero-poster.jpg differ
diff --git a/assets/hero/hero.mp4 b/assets/hero/hero.mp4
new file mode 100644
index 0000000..5fb491c
Binary files /dev/null and b/assets/hero/hero.mp4 differ
diff --git a/index.html b/index.html
index 32b074c..0823325 100644
--- a/index.html
+++ b/index.html
@@ -82,6 +82,9 @@
 <main id="top">
 
   <section class="hero band light" data-bg="light">
+    <video class="hero-video" autoplay muted loop playsinline poster="assets/hero/hero-poster.jpg" aria-hidden="true">
+      <source src="assets/hero/hero.mp4" type="video/mp4" />
+    </video>
     <div class="wrap hero-wrap"><div class="hero-col">
       <p class="eyebrow">Knowledge continuity · for Canadian manufacturers</p>
       <h1>Your best people are retiring. Their know&#8209;how doesn't <em>have to.</em></h1>
diff --git a/style.css b/style.css
index af854ec..362ba4f 100644
--- a/style.css
+++ b/style.css
@@ -134,6 +134,10 @@ a.tel { text-decoration: none; }
 .hero { background: var(--paper); position: relative; min-height: min(82vh, 760px); display: flex; align-items: center; padding: 150px 0 96px; }
 .hero-wrap { position: relative; z-index: 2; width: 100%; }
 .hero h1 { margin-bottom: 0.35em; }
+.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: right center; z-index: 1; opacity: 0.45; pointer-events: none; }
+.hero::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, var(--paper) 40%, rgba(247,244,239,0.5) 68%, rgba(247,244,239,0.06) 100%); }
+@media (max-width: 640px) { .hero-video { opacity: 0.22; } .hero::after { background: linear-gradient(180deg, rgba(247,244,239,0.72), rgba(247,244,239,0.42)); } }
+@media (prefers-reduced-motion: reduce) { .hero-video { display: none; } }
 .lead { font-size: 1.25rem; line-height: 1.7; color: var(--ink-soft); margin-bottom: 2.4em; }
 
 .actions { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }