From cf5959b4613fd4f7c45ebacd381b74e36ad23700 Mon Sep 17 00:00:00 2001
From: Calum Muir <calumamuir@outlook.com>
Date: Thu, 30 Apr 2026 19:54:21 +0000
Subject: [PATCH] Improve readability of Support Us card text with frosted
 panel

Added semi-opaque dark background (rgba 0,0,0,0.48) with blur(4px)
to the text panel on each editorial card so label, heading, body and
CTA are clearly legible regardless of the underlying image.

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

diff --git a/src/pages/support-us.astro b/src/pages/support-us.astro
index 6bc9a25..6eb4771 100644
--- a/src/pages/support-us.astro
+++ b/src/pages/support-us.astro
@@ -265,8 +265,8 @@ const faqs = [
                             loading="lazy"
                             decoding="async"
                         />
-                        <div style="position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.3) 55%, rgba(0,0,0,0.1) 100%);" />
-                        <div style="position: absolute; bottom: 0; left: 0; right: 0; padding: 28px 28px 34px;">
+                        <div style="position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.05) 100%);" />
+                        <div style="position: absolute; bottom: 0; left: 0; right: 0; padding: 28px 28px 34px; background: rgba(0,0,0,0.48); backdrop-filter: blur(4px);">
                             <p style="font-family: 'Public Sans', sans-serif; font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: #7DA371; margin-bottom: 8px;">
                                 {w.label}
                             </p>