From ba686837dcbe1fc3e941d90134ac4cc552135929 Mon Sep 17 00:00:00 2001
From: David Nuescheler <david@nuescheler.ch>
Date: Mon, 13 Jul 2026 15:47:24 -0700
Subject: [PATCH 1/4] chore: responsive object position for split hero

---
 blocks/hero/hero.css | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/blocks/hero/hero.css b/blocks/hero/hero.css
index 34e62e41..4ee360b7 100644
--- a/blocks/hero/hero.css
+++ b/blocks/hero/hero.css
@@ -177,6 +177,15 @@
   padding: 0;
 }
 
+.hero.split.left-text picture[data-bg] img {
+  object-position: left;
+}
+
+.hero.split.right-text picture[data-bg] img {
+  object-position: right;
+}
+
+
 .hero.split .text-wrapper {
   position: relative;
   z-index: 3;
@@ -240,6 +249,15 @@
   .hero.split.right-text::after {
     background: linear-gradient(to left, transparent, var(--image-color) 50%);
   }
+
+  .hero.split.left-text picture[data-bg] img {
+    object-position: 25%;
+  }
+  
+  .hero.split.right-text picture[data-bg] img {
+    object-position: 75%;
+  }
+  
 }
 
 @media (width >= 1200px) {

From 3f180e6d2f15f1637cd46629c17810758b93e85f Mon Sep 17 00:00:00 2001
From: David Nuescheler <david@nuescheler.ch>
Date: Wed, 15 Jul 2026 11:49:04 -0700
Subject: [PATCH 2/4] chore: centered mobile layout

---
 blocks/hero/hero.css | 36 ++++++++++++++++++++++++++++++++++++
 blocks/hero/hero.js  |  1 +
 2 files changed, 37 insertions(+)

diff --git a/blocks/hero/hero.css b/blocks/hero/hero.css
index 4ee360b7..dd176de9 100644
--- a/blocks/hero/hero.css
+++ b/blocks/hero/hero.css
@@ -316,3 +316,39 @@
     max-width: 400px;
   }
 }
+
+@media (width <= 900px) {
+  .hero.center h1 {
+    font-size: var(--heading-size-l);
+  }
+
+  .hero.center p {
+    font-size: var(--body-size-m);
+  }
+
+  .hero.center picture[data-bg] img {
+    object-position: 90%;
+  }
+
+  .hero.center > div {
+    align-items: end;
+  }
+
+  .hero.center::after {
+    background: linear-gradient(to bottom, transparent 40%, var(--image-color) 80%);
+    opacity: 1;
+  }
+
+  .hero.center {
+    text-align: left;
+  }
+
+  .hero.center.no-overlay::after {
+    content: '';
+  }
+
+  .hero.center p.button-wrapper {
+    margin-top: var(--spacing-400);
+    justify-content: unset;
+  }
+}
\ No newline at end of file
diff --git a/blocks/hero/hero.js b/blocks/hero/hero.js
index 74ffede8..a13632c9 100644
--- a/blocks/hero/hero.js
+++ b/blocks/hero/hero.js
@@ -38,6 +38,7 @@ function detectLayout(block) {
     const imgIndex = cells.findIndex((c) => c.classList.contains('img-wrapper'));
     block.classList.add(imgIndex === 0 ? 'left-text' : 'right-text');
   } else {
+    block.classList.add('center');
     const cell = row.firstElementChild;
     if (!cell) return;
     const [picture] = [...cell.querySelectorAll('picture')];

From e2e8c52447f56d48d46f02adf54c7313e0c22690 Mon Sep 17 00:00:00 2001
From: David Nuescheler <david@nuescheler.ch>
Date: Wed, 15 Jul 2026 13:07:15 -0700
Subject: [PATCH 3/4] chore: add focus-selection

---
 blocks/hero/hero.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/blocks/hero/hero.css b/blocks/hero/hero.css
index dd176de9..117dc57f 100644
--- a/blocks/hero/hero.css
+++ b/blocks/hero/hero.css
@@ -327,9 +327,14 @@
   }
 
   .hero.center picture[data-bg] img {
+    object-position: 10%;
+  }
+
+  .hero.center.focus-right picture[data-bg] img {
     object-position: 90%;
   }
 
+
   .hero.center > div {
     align-items: end;
   }

From cf72cb5c859e04510891a510d5e2bc41b97de941 Mon Sep 17 00:00:00 2001
From: David Nuescheler <david@nuescheler.ch>
Date: Wed, 15 Jul 2026 14:00:45 -0700
Subject: [PATCH 4/4] chore: styling

---
 blocks/hero/hero.css | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/blocks/hero/hero.css b/blocks/hero/hero.css
index 117dc57f..7ba8d089 100644
--- a/blocks/hero/hero.css
+++ b/blocks/hero/hero.css
@@ -319,7 +319,7 @@
 
 @media (width <= 900px) {
   .hero.center h1 {
-    font-size: var(--heading-size-l);
+    font-size: var(--heading-size-xxxxl);
   }
 
   .hero.center p {
@@ -353,7 +353,8 @@
   }
 
   .hero.center p.button-wrapper {
-    margin-top: var(--spacing-400);
+    margin-top: var(--spacing-200);
+    margin-bottom: 0;
     justify-content: unset;
   }
 }
\ No newline at end of file