From 2ab3722439c0e64d62bf413eae4759e41ee82ebe Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Thu, 12 Mar 2026 08:00:52 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Aurora:=20Add=20glassmorphism=20?=
 =?UTF-8?q?glow=20effect=20to=20project=20card=20images?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

💡 What: Added an animated gradient blur behind the project card image containers.
🎯 Why: The project cards felt a bit flat. This provides visual depth and a premium feel.
✨ Impact: Increases perceived value through a subtle hover micro-interaction without breaking layout structure.
♿ Accessibility: No negative impact. Uses existing purely visual design system classes.

Co-authored-by: amar-295 <233091910+amar-295@users.noreply.github.com>
---
 src/components/ProjectCard.jsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/ProjectCard.jsx b/src/components/ProjectCard.jsx
index b2a0e3d..990b378 100644
--- a/src/components/ProjectCard.jsx
+++ b/src/components/ProjectCard.jsx
@@ -54,8 +54,9 @@ export default function ProjectCard({
         }`}
     >
       {/* ---- Image Column ---- */}
-      <div className="w-full lg:w-5/12">
-        <div className="relative group bg-light-surface dark:bg-card-bg rounded-xl overflow-hidden border-2 border-light-border dark:border-slate-800/50 shadow-sm aspect-video">
+      <div className="w-full lg:w-5/12 relative group">
+        <div className="absolute -inset-1 bg-gradient-to-r from-accent-dark/20 to-accent-dark/20 dark:from-primary-blue/30 dark:to-teal-400/30 rounded-xl blur opacity-25 group-hover:opacity-40 transition duration-1000 group-hover:duration-300"></div>
+        <div className="relative bg-light-surface dark:bg-card-bg rounded-xl overflow-hidden border-2 border-light-border dark:border-slate-800/50 shadow-sm aspect-video">
           <img
             alt={imageAlt || title}
             className="w-full h-full object-contain bg-gray-50 dark:bg-slate-900/50 transform group-hover:scale-105 transition-transform duration-500"