From 22a54a8478544cfa60626b2888db84ecf5176bfc Mon Sep 17 00:00:00 2001
From: Calum Muir <calumamuir@outlook.com>
Date: Thu, 30 Apr 2026 19:47:41 +0000
Subject: [PATCH] Hide hero donate button and scroll indicator on mobile/tablet
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Both absolutely-positioned elements were overlapping on viewports
≤767px. Extended hide breakpoint from 640px to 767px for the scroll
indicator and applied same breakpoint to the donate button. The
JustGiving button remains accessible via the intro strip below.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/pages/index.astro | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/pages/index.astro b/src/pages/index.astro
index b103c5c..8ee4446 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -135,8 +135,9 @@ const ctaCards = [
             text-transform: uppercase;
         }
 
-        @media (max-width: 640px) {
+        @media (max-width: 767px) {
             .scroll-indicator { display: none; }
+            .hero-donate { display: none; }
         }
     </style>
 
@@ -194,12 +195,12 @@ const ctaCards = [
                     </div>
                 </div>
 
-                <!-- Donate button (absolute) -->
+                <!-- Donate button (absolute, hidden on mobile) -->
                 <a
                     href="https://www.justgiving.com/charity/highlandgrouprda"
                     target="_blank"
                     rel="noreferrer"
-                    class="absolute"
+                    class="absolute hero-donate"
                     style="bottom: 40px; right: 28px;"
                 >
                     <img