From 0d7275098273b3f28ebe715a881eb5cfa1497c78 Mon Sep 17 00:00:00 2001
From: Haewon Kam <haewonkam@Haewons-MacBook-Pro.local>
Date: Fri, 3 Apr 2026 23:56:58 +0900
Subject: [PATCH] revert: restore Hero, Modules, CSS to original state

All layout changes (blob modifications, overflow-x/clip, scrollbar-gutter)
reverted to the original version that was working correctly.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/components/Hero.tsx    | 11 +++++++----
 src/components/Modules.tsx | 12 +++++-------
 src/index.css              |  5 -----
 3 files changed, 12 insertions(+), 16 deletions(-)

diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx
index 72fd826..452fcd0 100644
--- a/src/components/Hero.tsx
+++ b/src/components/Hero.tsx
@@ -13,9 +13,9 @@ export default function Hero() {
   };
 
   return (
-    <section className="relative pt-28 pb-12 md:pt-36 md:pb-16 overflow-clip flex flex-col items-center justify-center text-center px-6">
-      {/* Background Gradient — centered and symmetric */}
-      <div className="absolute inset-0 -z-10 bg-[radial-gradient(ellipse_at_center_top,_rgba(224,231,255,0.5)_0%,_rgba(245,243,255,0.3)_40%,_transparent_70%)]"></div>
+    <section className="relative pt-28 pb-12 md:pt-36 md:pb-16 overflow-hidden flex flex-col items-center justify-center text-center px-6">
+      {/* Background Gradient */}
+      <div className="absolute inset-0 -z-10 bg-[radial-gradient(ellipse_at_top,_var(--tw-gradient-stops))] from-indigo-100 via-purple-50 to-pink-50 opacity-70"></div>
       
       <div className="max-w-4xl mx-auto">
         <motion.div
@@ -78,7 +78,10 @@ export default function Hero() {
         </motion.div>
       </div>
 
-      {/* No decorative blobs — clean symmetric background */}
+      {/* 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>
     </section>
   );
 }
diff --git a/src/components/Modules.tsx b/src/components/Modules.tsx
index f10c12e..0784cda 100644
--- a/src/components/Modules.tsx
+++ b/src/components/Modules.tsx
@@ -116,13 +116,11 @@ const ModuleCard: React.FC<{ mod: any, className?: string }> = ({ mod, className
 
 export default function Modules() {
   return (
-    <section id="modules" className="py-24 md:py-32 bg-white px-6 overflow-clip relative">
-      {/* Animated Background Blobs — contained within section via max-w and inset */}
-      <div className="absolute inset-0 overflow-clip pointer-events-none">
-        <div className="absolute top-[-10%] left-[-10%] w-[50vw] h-[50vw] max-w-[600px] max-h-[600px] rounded-full bg-[#fff3eb] opacity-80 blur-[120px] animate-blob-large"></div>
-        <div className="absolute top-[20%] right-[-5%] w-[40vw] h-[40vw] max-w-[500px] max-h-[500px] rounded-full bg-[#e4cfff] opacity-40 blur-[120px] animate-blob-large animation-delay-7000"></div>
-        <div className="absolute bottom-[-10%] left-[20%] w-[50vw] h-[50vw] max-w-[600px] max-h-[600px] rounded-full bg-[#f5f9ff] opacity-80 blur-[120px] animate-blob-large animation-delay-14000"></div>
-      </div>
+    <section id="modules" className="py-24 md:py-32 bg-white px-6 overflow-hidden relative">
+      {/* Animated Background Blobs */}
+      <div className="absolute top-[-10%] left-[-10%] w-[50vw] h-[50vw] min-w-[600px] min-h-[600px] rounded-full bg-[#fff3eb] opacity-80 blur-[120px] animate-blob-large pointer-events-none"></div>
+      <div className="absolute top-[20%] right-[-10%] w-[40vw] h-[40vw] min-w-[500px] min-h-[500px] rounded-full bg-[#e4cfff] opacity-40 blur-[120px] animate-blob-large animation-delay-7000 pointer-events-none"></div>
+      <div className="absolute bottom-[-10%] left-[20%] w-[60vw] h-[60vw] min-w-[700px] min-h-[700px] rounded-full bg-[#f5f9ff] opacity-80 blur-[120px] animate-blob-large animation-delay-14000 pointer-events-none"></div>
 
       <div className="max-w-7xl mx-auto relative z-10">
         <motion.div
diff --git a/src/index.css b/src/index.css
index 7457101..3c42999 100644
--- a/src/index.css
+++ b/src/index.css
@@ -62,12 +62,7 @@
 }
 
 @layer base {
-  html {
-    overflow-x: clip;
-    overflow-y: overlay;
-  }
   body {
-    overflow-x: clip;
     @apply font-sans text-slate-800 bg-slate-50 antialiased;
   }