diff --git a/Dockerfile b/Dockerfile
index e11a8e9..801c348 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,4 +1,5 @@
 FROM nginx:alpine
 COPY index.html /usr/share/nginx/html/index.html
+COPY img/ /usr/share/nginx/html/img/
 COPY nginx.conf /etc/nginx/conf.d/default.conf
 EXPOSE 80
diff --git a/img/accra-motorcycle.jpg b/img/accra-motorcycle.jpg
new file mode 100644
index 0000000..eed793f
Binary files /dev/null and b/img/accra-motorcycle.jpg differ
diff --git a/img/architecture-warm.jpg b/img/architecture-warm.jpg
new file mode 100644
index 0000000..b8c4ec9
Binary files /dev/null and b/img/architecture-warm.jpg differ
diff --git a/img/chaos.jpg b/img/chaos.jpg
new file mode 100644
index 0000000..fd1bcc5
Binary files /dev/null and b/img/chaos.jpg differ
diff --git a/img/characters-page1.jpg b/img/characters-page1.jpg
new file mode 100644
index 0000000..abbeccf
Binary files /dev/null and b/img/characters-page1.jpg differ
diff --git a/img/characters-page2.jpg b/img/characters-page2.jpg
new file mode 100644
index 0000000..fd58808
Binary files /dev/null and b/img/characters-page2.jpg differ
diff --git a/img/comp-arrival.jpg b/img/comp-arrival.jpg
new file mode 100644
index 0000000..6be39f2
Binary files /dev/null and b/img/comp-arrival.jpg differ
diff --git a/img/comp-children-of-men.jpg b/img/comp-children-of-men.jpg
new file mode 100644
index 0000000..8aec3e3
Binary files /dev/null and b/img/comp-children-of-men.jpg differ
diff --git a/img/comp-district9.jpg b/img/comp-district9.jpg
new file mode 100644
index 0000000..4d3616d
Binary files /dev/null and b/img/comp-district9.jpg differ
diff --git a/img/corridor.jpg b/img/corridor.jpg
new file mode 100644
index 0000000..e985256
Binary files /dev/null and b/img/corridor.jpg differ
diff --git a/img/family-dinner.jpg b/img/family-dinner.jpg
new file mode 100644
index 0000000..627277e
Binary files /dev/null and b/img/family-dinner.jpg differ
diff --git a/img/field.jpg b/img/field.jpg
new file mode 100644
index 0000000..f825bf4
Binary files /dev/null and b/img/field.jpg differ
diff --git a/img/golden-silhouette.jpg b/img/golden-silhouette.jpg
new file mode 100644
index 0000000..9cd62cf
Binary files /dev/null and b/img/golden-silhouette.jpg differ
diff --git a/img/hero.jpg b/img/hero.jpg
new file mode 100644
index 0000000..d55eda1
Binary files /dev/null and b/img/hero.jpg differ
diff --git a/img/ivy-wall.jpg b/img/ivy-wall.jpg
new file mode 100644
index 0000000..90d1b29
Binary files /dev/null and b/img/ivy-wall.jpg differ
diff --git a/img/michelle-sam.jpg b/img/michelle-sam.jpg
new file mode 100644
index 0000000..ce901c1
Binary files /dev/null and b/img/michelle-sam.jpg differ
diff --git a/img/mood-board.jpg b/img/mood-board.jpg
new file mode 100644
index 0000000..f0d01fd
Binary files /dev/null and b/img/mood-board.jpg differ
diff --git a/img/purple-mood.jpg b/img/purple-mood.jpg
new file mode 100644
index 0000000..09777b7
Binary files /dev/null and b/img/purple-mood.jpg differ
diff --git a/img/space.jpg b/img/space.jpg
new file mode 100644
index 0000000..1f0a831
Binary files /dev/null and b/img/space.jpg differ
diff --git a/img/strategy-1.jpg b/img/strategy-1.jpg
new file mode 100644
index 0000000..76991ec
Binary files /dev/null and b/img/strategy-1.jpg differ
diff --git a/img/strategy-2.jpg b/img/strategy-2.jpg
new file mode 100644
index 0000000..a1d5a7e
Binary files /dev/null and b/img/strategy-2.jpg differ
diff --git a/img/strategy-3.jpg b/img/strategy-3.jpg
new file mode 100644
index 0000000..27d799b
Binary files /dev/null and b/img/strategy-3.jpg differ
diff --git a/img/team-1.jpg b/img/team-1.jpg
new file mode 100644
index 0000000..33a4784
Binary files /dev/null and b/img/team-1.jpg differ
diff --git a/img/team-2.jpg b/img/team-2.jpg
new file mode 100644
index 0000000..fa1ab75
Binary files /dev/null and b/img/team-2.jpg differ
diff --git a/img/team-3.jpg b/img/team-3.jpg
new file mode 100644
index 0000000..10194cd
Binary files /dev/null and b/img/team-3.jpg differ
diff --git a/img/tunnel.jpg b/img/tunnel.jpg
new file mode 100644
index 0000000..1b136c6
Binary files /dev/null and b/img/tunnel.jpg differ
diff --git a/index.html b/index.html
index 8f18dcc..f150aed 100644
--- a/index.html
+++ b/index.html
@@ -129,10 +129,8 @@
             position: absolute;
             inset: 0;
             background:
-                radial-gradient(ellipse at 30% 20%, rgba(206, 17, 38, 0.15) 0%, transparent 60%),
-                radial-gradient(ellipse at 70% 80%, rgba(0, 107, 63, 0.1) 0%, transparent 50%),
-                radial-gradient(ellipse at 50% 50%, rgba(252, 209, 22, 0.05) 0%, transparent 70%),
-                var(--midnight);
+                linear-gradient(180deg, rgba(10,10,15,0.4) 0%, rgba(10,10,15,0.2) 40%, rgba(10,10,15,0.7) 100%),
+                url('img/hero.jpg') center center / cover no-repeat;
         }
 
         #hero-canvas {
@@ -242,6 +240,35 @@
             margin-bottom: 2rem;
         }
 
+        /* ═══════ CINEMATIC IMAGE BREAK ═══════ */
+        .img-break {
+            max-width: 100%;
+            position: relative;
+            overflow: hidden;
+        }
+
+        .img-break img {
+            width: 100%;
+            height: auto;
+            display: block;
+            opacity: 0.85;
+        }
+
+        .img-break.parallax {
+            height: 60vh;
+            min-height: 400px;
+        }
+
+        .img-break.parallax img {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            width: 100%;
+            height: 120%;
+            object-fit: cover;
+        }
+
         /* ═══════ QUESTION ═══════ */
         .question-section {
             position: relative;
@@ -249,8 +276,8 @@
             text-align: center;
             max-width: 100%;
             background:
-                radial-gradient(ellipse at center, rgba(0, 107, 63, 0.08) 0%, transparent 70%),
-                var(--midnight);
+                linear-gradient(180deg, rgba(10,10,15,0.5) 0%, rgba(10,10,15,0.3) 50%, rgba(10,10,15,0.6) 100%),
+                url('img/ivy-wall.jpg') center center / cover no-repeat;
         }
 
         .question-section .question {
@@ -269,7 +296,9 @@
             position: relative;
             max-width: 100%;
             padding: 6rem 2rem;
-            background: linear-gradient(180deg, var(--deep-red) 0%, var(--midnight) 100%);
+            background:
+                linear-gradient(180deg, rgba(139,0,0,0.85) 0%, rgba(10,10,15,0.9) 100%),
+                url('img/chaos.jpg') center center / cover no-repeat;
         }
 
         .logline-inner {
@@ -324,8 +353,8 @@
         /* ═══════ INSPIRATION ═══════ */
         .inspiration-section {
             background:
-                linear-gradient(180deg, var(--midnight) 0%, rgba(13, 13, 20, 0.95) 30%, var(--midnight) 100%),
-                radial-gradient(ellipse at 50% 0%, rgba(206, 17, 38, 0.06) 0%, transparent 60%);
+                linear-gradient(180deg, rgba(10,10,15,0.92) 0%, rgba(13,13,20,0.88) 50%, rgba(10,10,15,0.95) 100%),
+                url('img/corridor.jpg') center center / cover no-repeat;
         }
 
         .inspiration-text {
@@ -343,8 +372,8 @@
         /* ═══════ THEMES ═══════ */
         .themes-section {
             background:
-                radial-gradient(ellipse at 20% 50%, rgba(252, 209, 22, 0.05) 0%, transparent 50%),
-                var(--midnight);
+                linear-gradient(180deg, rgba(10,10,15,0.88) 0%, rgba(10,10,15,0.82) 50%, rgba(10,10,15,0.92) 100%),
+                url('img/golden-silhouette.jpg') center center / cover no-repeat;
         }
 
         .themes-text {
@@ -373,9 +402,28 @@
         /* ═══════ STORY WORLD ═══════ */
         .world-section {
             background:
-                radial-gradient(ellipse at 70% 30%, rgba(0, 107, 63, 0.08) 0%, transparent 50%),
-                radial-gradient(ellipse at 30% 70%, rgba(160, 82, 45, 0.08) 0%, transparent 50%),
-                var(--midnight);
+                linear-gradient(180deg, rgba(10,10,15,0.85) 0%, rgba(10,10,15,0.8) 50%, rgba(10,10,15,0.9) 100%),
+                url('img/space.jpg') center center / cover no-repeat;
+        }
+
+        .world-images {
+            display: grid;
+            grid-template-columns: 1fr 1fr;
+            gap: 1.5rem;
+            margin-top: 3rem;
+        }
+
+        .world-images img {
+            width: 100%;
+            height: 280px;
+            object-fit: cover;
+            opacity: 0.9;
+        }
+
+        @media (max-width: 768px) {
+            .world-images {
+                grid-template-columns: 1fr;
+            }
         }
 
         .world-text {
@@ -407,7 +455,9 @@
 
         /* ═══════ TONE ═══════ */
         .tone-section {
-            background: var(--midnight);
+            background:
+                linear-gradient(180deg, rgba(10,10,15,0.9) 0%, rgba(10,10,15,0.85) 50%, rgba(10,10,15,0.92) 100%),
+                url('img/tunnel.jpg') center center / cover no-repeat;
         }
 
         .tone-text {
@@ -431,16 +481,27 @@
 
         .comp-card {
             text-align: center;
-            padding: 2rem 1.5rem;
             background: var(--card-bg);
             border: 1px solid rgba(255,255,255,0.06);
             transition: border-color 0.3s;
+            overflow: hidden;
         }
 
         .comp-card:hover {
             border-color: rgba(252, 209, 22, 0.2);
         }
 
+        .comp-card img {
+            width: 100%;
+            height: 320px;
+            object-fit: cover;
+            object-position: top;
+        }
+
+        .comp-card-text {
+            padding: 1.2rem 1.5rem;
+        }
+
         .comp-title {
             font-family: 'Bebas Neue', sans-serif;
             font-size: 1.5rem;
@@ -525,8 +586,8 @@
             padding: 10rem 2rem;
             text-align: center;
             background:
-                radial-gradient(ellipse at 50% 50%, rgba(206, 17, 38, 0.1) 0%, transparent 60%),
-                var(--midnight);
+                linear-gradient(180deg, rgba(10,10,15,0.6) 0%, rgba(10,10,15,0.4) 50%, rgba(10,10,15,0.7) 100%),
+                url('img/purple-mood.jpg') center center / cover no-repeat;
         }
 
         .closing-question {
@@ -678,6 +739,11 @@
     </div>
 </section>
 
+<!-- FIELD IMAGE -->
+<div class="img-break">
+    <img src="img/field.jpg" alt="Girl standing in a field of yellow flowers" loading="lazy">
+</div>
+
 <!-- QUESTION -->
 <div class="question-section" id="question">
     <p class="question reveal">What if the fate of humanity rested on a lottery?</p>
@@ -691,7 +757,10 @@
     </div>
 </div>
 
-<div class="divider"></div>
+<!-- FAMILY DINNER IMAGE -->
+<div class="img-break">
+    <img src="img/family-dinner.jpg" alt="Family gathered around dinner table" loading="lazy">
+</div>
 
 <!-- SYNOPSIS -->
 <section class="synopsis-section" id="synopsis">
@@ -722,7 +791,10 @@
     </div>
 </section>
 
-<div class="divider"></div>
+<!-- MOOD BOARD IMAGE -->
+<div class="img-break">
+    <img src="img/mood-board.jpg" alt="Visual mood board — architecture and community in Ghana" loading="lazy">
+</div>
 
 <!-- INSPIRATION -->
 <div class="full-bleed inspiration-section" id="inspiration">
@@ -797,6 +869,10 @@
             <span class="p-green"></span>
             <span class="p-gold"></span>
         </div>
+        <div class="world-images reveal">
+            <img src="img/accra-motorcycle.jpg" alt="Woman on motorcycle riding through Accra" loading="lazy">
+            <img src="img/architecture-warm.jpg" alt="Warm architectural interior in Ghana" loading="lazy">
+        </div>
     </div>
 </div>
 
@@ -817,16 +893,25 @@
         </div>
         <div class="comps-grid reveal">
             <div class="comp-card">
-                <h3 class="comp-title">District 9</h3>
-                <p class="comp-detail">Social commentary through sci-fi allegory set in Africa</p>
+                <img src="img/comp-district9.jpg" alt="District 9 poster" loading="lazy">
+                <div class="comp-card-text">
+                    <h3 class="comp-title">District 9</h3>
+                    <p class="comp-detail">Social commentary through sci-fi allegory set in Africa</p>
+                </div>
             </div>
             <div class="comp-card">
-                <h3 class="comp-title">Arrival</h3>
-                <p class="comp-detail">Cerebral sci-fi driven by emotional truth and communication</p>
+                <img src="img/comp-arrival.jpg" alt="Arrival poster" loading="lazy">
+                <div class="comp-card-text">
+                    <h3 class="comp-title">Arrival</h3>
+                    <p class="comp-detail">Cerebral sci-fi driven by emotional truth and communication</p>
+                </div>
             </div>
             <div class="comp-card">
-                <h3 class="comp-title">Children of Men</h3>
-                <p class="comp-detail">Gritty immediacy in a collapsing world, hope against despair</p>
+                <img src="img/comp-children-of-men.jpg" alt="Children of Men poster" loading="lazy">
+                <div class="comp-card-text">
+                    <h3 class="comp-title">Children of Men</h3>
+                    <p class="comp-detail">Gritty immediacy in a collapsing world, hope against despair</p>
+                </div>
             </div>
         </div>
     </div>