From 4a8a71d3c9e60f3cbeca25e7aca7b785d5c3da23 Mon Sep 17 00:00:00 2001
From: Jeff Emmett <jeffemmett@gmail.com>
Date: Mon, 13 Apr 2026 16:23:08 -0400
Subject: [PATCH] fix: constrain offering card image heights, fix layout
 overflow

Remove min-height: 300px from all images (caused massive overflow).
Only apply min-height to image wraps in grid context. Add max-height
constraints at responsive breakpoints to prevent images from
dominating the layout.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 styles.css | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/styles.css b/styles.css
index d244942..c3c0fd2 100644
--- a/styles.css
+++ b/styles.css
@@ -709,14 +709,17 @@ p:last-child {
 
 .offering-img-wrap {
     overflow: hidden;
-    min-height: 300px;
+}
+
+.offering-card-image > .offering-img-wrap {
+    min-height: 250px;
 }
 
 .offering-img {
     width: 100%;
     height: 100%;
-    min-height: 300px;
     object-fit: cover;
+    display: block;
 }
 
 /* Gallery layout for Fliegenfischen */
@@ -732,7 +735,8 @@ p:last-child {
 }
 
 .offering-gallery .offering-img {
-    min-height: 150px;
+    min-height: 100px;
+    max-height: 200px;
 }
 
 /* Wertschätzung */
@@ -1126,8 +1130,9 @@ p:last-child {
         grid-template-columns: 1fr;
     }
 
-    .offering-img-wrap {
-        max-height: 300px;
+    .offering-card-image > .offering-img-wrap {
+        min-height: 0;
+        max-height: 280px;
     }
 
     .contact-grid {