feat: display photos on /photos/ listing page

- Render photo frontmatter as actual img tags
- Add photo gallery CSS with responsive grid
- Support multi-photo posts with 2-column grid
- Add photo caption styling

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

css/tailwind.css

@@ -255,6 +255,40 @@
     @apply pt-3 border-t border-surface-100 dark:border-surface-700;
   }
 
+  /* Photo gallery on listing pages */
+  .photo-list li {
+    @apply pb-8;
+  }
+
+  .photo-gallery {
+    @apply my-4 grid gap-2;
+  }
+
+  .photo-gallery img {
+    @apply w-full max-h-[500px] object-cover rounded-lg;
+  }
+
+  .photo-link {
+    @apply block;
+  }
+
+  .photo-caption {
+    @apply mt-3 text-surface-600 dark:text-surface-400;
+  }
+
+  /* Multi-photo grid */
+  .photo-gallery:has(img:nth-child(2)) {
+    @apply grid-cols-2;
+  }
+
+  .photo-gallery:has(img:nth-child(3)) {
+    @apply grid-cols-2;
+  }
+
+  .photo-gallery:has(img:nth-child(4)) {
+    @apply grid-cols-2;
+  }
+
   /* Pagination */
   .pagination {
     @apply mt-12 pt-8 border-t border-surface-200 dark:border-surface-700 flex flex-col sm:flex-row items-center justify-between gap-4;

photos.njk

@@ -9,7 +9,7 @@ permalink: /photos/
 </div>
 
 {% if collections.photos.length > 0 %}
-<ul class="post-list">
+<ul class="post-list photo-list">
   {% for post in collections.photos %}
   <li class="h-entry">
     <div class="post-meta">
@@ -17,7 +17,19 @@ permalink: /photos/
         {{ post.date | dateDisplay }}
       </time>
     </div>
-    <div class="e-content">{{ post.templateContent | safe }}</div>
+    {# Render photo(s) from frontmatter #}
+    {% if post.data.photo %}
+      <div class="photo-gallery">
+        {% for img in post.data.photo %}
+          <a href="{{ post.url }}" class="photo-link">
+            <img src="{{ img.url }}" alt="{{ img.alt | default('Photo') }}" class="u-photo" loading="lazy">
+          </a>
+        {% endfor %}
+      </div>
+    {% endif %}
+    {% if post.templateContent %}
+    <div class="e-content photo-caption">{{ post.templateContent | safe }}</div>
+    {% endif %}
   </li>
   {% endfor %}
 </ul>