From 7154e76bc469aa62165283cc178f35bb383f0648 Mon Sep 17 00:00:00 2001
From: Haewon Kam <haewonkam@Haewons-MacBook-Pro.local>
Date: Fri, 3 Apr 2026 23:45:28 +0900
Subject: [PATCH] fix: balance Hero blob sizes and opacity for symmetric layout
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Reduced blob size (w-64→w-48), lowered opacity (30%→20%), used
percentage positioning (left-10→left-[10%]), and wrapped in
overflow-clip container. Eliminates visual weight asymmetry.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/components/Hero.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx
index 452fcd0..2590896 100644
--- a/src/components/Hero.tsx
+++ b/src/components/Hero.tsx
@@ -78,10 +78,12 @@ export default function Hero() {
         </motion.div>
       </div>
 
-      {/* Decorative elements */}
-      <div className="absolute top-1/4 left-10 w-64 h-64 bg-purple-300 rounded-full mix-blend-multiply filter blur-3xl opacity-30 animate-blob pointer-events-none"></div>
-      <div className="absolute top-1/3 right-10 w-64 h-64 bg-pink-300 rounded-full mix-blend-multiply filter blur-3xl opacity-30 animate-blob animation-delay-2000 pointer-events-none"></div>
-      <div className="absolute -bottom-8 left-1/2 -translate-x-1/2 w-64 h-64 bg-indigo-300 rounded-full mix-blend-multiply filter blur-3xl opacity-30 animate-blob animation-delay-4000 pointer-events-none"></div>
+      {/* Decorative elements — symmetric and contained */}
+      <div className="absolute inset-0 overflow-clip pointer-events-none">
+        <div className="absolute top-1/4 left-[10%] w-48 h-48 bg-purple-300 rounded-full mix-blend-multiply filter blur-3xl opacity-20 animate-blob"></div>
+        <div className="absolute top-1/3 right-[10%] w-48 h-48 bg-pink-300 rounded-full mix-blend-multiply filter blur-3xl opacity-20 animate-blob animation-delay-2000"></div>
+        <div className="absolute -bottom-8 left-1/2 -translate-x-1/2 w-48 h-48 bg-indigo-300 rounded-full mix-blend-multiply filter blur-3xl opacity-20 animate-blob animation-delay-4000"></div>
+      </div>
     </section>
   );
 }