From b2f0d8af5ce3cf6b252481528754d847e7634f78 Mon Sep 17 00:00:00 2001
From: Richie <richie.phillips@proton.me>
Date: Tue, 31 Mar 2026 20:42:25 +1100
Subject: [PATCH] =?UTF-8?q?Stack=20hero=20content=20vertically:=20heading?=
 =?UTF-8?q?=20=E2=86=92=20subheading=20=E2=86=92=20finder?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Hero flex-direction: row → column so finder sits below the text,
centred, with bottom half overlapping into the white section.
Matches reference layout: text on image, finder straddles boundary.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/components/pages/HomePage/HomePage.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/pages/HomePage/HomePage.tsx b/src/components/pages/HomePage/HomePage.tsx
index 6fd47a9..4527ae1 100644
--- a/src/components/pages/HomePage/HomePage.tsx
+++ b/src/components/pages/HomePage/HomePage.tsx
@@ -215,8 +215,9 @@ export const HomePage = React.forwardRef<HTMLDivElement, HomePageProps>(
                 position: 'relative',
                 minHeight: { xs: 480, md: 640 },
                 display: 'flex',
-                alignItems: 'flex-start',
-                justifyContent: 'center',
+                flexDirection: 'column',
+                alignItems: 'center',
+                justifyContent: 'flex-start',
                 backgroundImage: `url(${heroImageUrl})`,
                 backgroundSize: 'cover',
                 backgroundPosition: 'center',