diff --git a/html/css/style.css b/html/css/style.css
index 33209f7..15826b7 100644
--- a/html/css/style.css
+++ b/html/css/style.css
@@ -455,20 +455,20 @@ p { margin-bottom: 16px; max-width: 720px; }
 }
 .story-block.reverse { direction: rtl; }
 .story-block.reverse > * { direction: ltr; }
-/* story-photo is a grid-within-grid: rows = 1fr (image) + auto (caption) */
+/* story-photo: img fills via absolute, caption flows at bottom */
 .story-photo {
-  display: grid;
-  grid-template-rows: minmax(0, 1fr) auto;
-  overflow: hidden;
   position: relative;
+  overflow: hidden;
 }
+/* img fills via absolute fill — caption naturally shifts above */
 .story-photo img {
+  position: absolute;
+  inset: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.6s;
   display: block;
-  /* minmax(0,1fr) row = definite height → height:100% resolves correctly */
 }
 .story-block:hover .story-photo img {
   transform: scale(1.03);
@@ -1358,15 +1358,21 @@ p { margin-bottom: 16px; max-width: 720px; }
 }
 
 /* ─── Photo Caption Bar (brand mandatory) ─── */
-/* Sub-grid row 2 inside .story-photo — naturally below the img */
+/* Absolutely positioned at bottom of .story-photo (img is also absolute, caption z-index wins) */
 .story-caption {
-  background: red !important;
-  color: white !important;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 5;
+  background: rgba(61,31,21,0.88);
+  color: rgba(245,239,224,0.85);
   font-family: var(--font-body);
-  font-size: 14px !important;
-  padding: 12px 16px !important;
+  font-size: 11px;
+  font-style: italic;
+  letter-spacing: 0.01em;
+  padding: 7px 16px;
   line-height: 1.4;
-  z-index: 99;
 }
 
 /* ─── Community Voice (Caveat) — brand spec: community voices get handwritten treatment ─── */
diff --git a/html/index.html b/html/index.html
index 2e6d8af..bb11bd3 100644
--- a/html/index.html
+++ b/html/index.html
@@ -152,7 +152,7 @@
 <section class="story-block fade-up">
   <div class="story-photo">
     <img src="/images/community-planting.jpg" alt="Community members and team planting at the Lolo Farm site, April 2024" loading="lazy">
-    <div class="story-caption" style="background:red;color:white;font-size:16px;padding:12px;display:block;min-height:36px;">Community members and project team planting at Lolo Farm, Adamawa Region, April 2024</div>
+    <div class="story-caption">Community members and project team planting at Lolo Farm, Adamawa Region, April 2024</div>
   </div>
   <div class="story-text">
     <div class="section-label">Flagship Project</div>