From b1c94960823f4abd8860a4bcece4864cd6dc1696 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Mon, 6 Apr 2026 08:14:01 +0000
Subject: [PATCH] Lighten dark mode gradients from brand-700/800 to brand-600
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Hero dark gradient start: brand-700 → brand-600
- Blog SVG image background fill: brand-800 → brand-600
- BlogCard grid gradient end: brand-800 → brand-600
- ArticleHero gradient end: brand-800 → brand-600

https://claude.ai/code/session_019mp7rTrQPx9yxp17hgjsYb
---
 src/components/blog/ArticleHero.astro  | 2 +-
 src/components/blog/BlogCard.astro     | 2 +-
 src/components/blog/BlogImageSVG.astro | 2 +-
 src/styles/global.css                  | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/blog/ArticleHero.astro b/src/components/blog/ArticleHero.astro
index 2edb4eb..beee6ea 100644
--- a/src/components/blog/ArticleHero.astro
+++ b/src/components/blog/ArticleHero.astro
@@ -109,7 +109,7 @@ const readingTime = Math.max(1, Math.ceil(estimatedWords / wordsPerMinute));
       {svgSlug ? (
         <div
           class="relative overflow-hidden rounded-xl border border-border shadow-2xl
-            bg-gradient-to-br from-brand-100/50 to-brand-50/30 dark:from-brand-900/50 dark:to-brand-800/30"
+            bg-gradient-to-br from-brand-100/50 to-brand-50/30 dark:from-brand-900/50 dark:to-brand-600/30"
           style="color: var(--brand-500);"
         >
           <BlogImageSVG slug={svgSlug} title={imageAlt || title} />
diff --git a/src/components/blog/BlogCard.astro b/src/components/blog/BlogCard.astro
index f4c12cc..7dd61f9 100644
--- a/src/components/blog/BlogCard.astro
+++ b/src/components/blog/BlogCard.astro
@@ -39,7 +39,7 @@ const readingTime = Math.max(1, Math.ceil(estimatedWords / wordsPerMinute));
   <a href={href} class="block">
     <div
       class="relative mb-4 overflow-hidden rounded-md
-        bg-background-secondary bg-gradient-to-br from-brand-100/65 to-transparent dark:from-brand-900/60 dark:to-brand-800/25"
+        bg-background-secondary bg-gradient-to-br from-brand-100/65 to-transparent dark:from-brand-900/60 dark:to-brand-600/25"
       style="color: var(--brand-500);"
     >
       {svgSlug ? (
diff --git a/src/components/blog/BlogImageSVG.astro b/src/components/blog/BlogImageSVG.astro
index 455988a..3ab2553 100644
--- a/src/components/blog/BlogImageSVG.astro
+++ b/src/components/blog/BlogImageSVG.astro
@@ -44,7 +44,7 @@ const svgContent = svgs[`/src/assets/blog/${slug}.svg`] ?? '';
   /* ── Dark mode ───────────────────────────────────────────────────────────
      Deep background with all brand colors at full opacity — vivid, not faded.
   ── */
-  :global(html.dark) .svg-host :global(.bg)  { fill: var(--brand-800); }
+  :global(html.dark) .svg-host :global(.bg)  { fill: var(--brand-600); }
   :global(html.dark) .svg-host :global(.ico) { stroke: var(--brand-200); }
   :global(html.dark) .svg-host :global(.txt) { fill: var(--brand-50); }
   :global(html.dark) .svg-host :global(.ln)  { stroke: var(--brand-300); stroke-opacity: 0.5; }
diff --git a/src/styles/global.css b/src/styles/global.css
index f2c6e07..cfe251d 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -298,7 +298,7 @@
   .dark .hero-dark-gradient {
     background: linear-gradient(
       to bottom,
-      var(--brand-700) 0%,
+      var(--brand-600) 0%,
       oklch(0% 0 0) 100%
     ) !important;
   }