css

src/App.css

@@ -135,6 +135,46 @@
     position: relative;
     overflow: hidden;
     animation: fadeIn 0.9s ease-out;
+    z-index: 1;
+}
+
+/* Hero 背景光圈效果 */
+.hero::before {
+    content: "";
+    position: absolute;
+    top: 40%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 700px;
+    height: 500px;
+    background: radial-gradient(
+        ellipse at center,
+        rgba(250, 227, 7, 0.4) 0%,
+        rgba(250, 227, 7, 0.2) 30%,
+        rgba(250, 227, 7, 0.15) 50%,
+        transparent 70%
+    );
+    border-radius: 50%;
+    filter: blur(80px);
+    pointer-events: none;
+    z-index: 0;
+    animation: glowPulse 8s ease-in-out infinite;
+}
+
+.hero .container {
+    position: relative;
+    z-index: 1;
+}
+
+@keyframes glowPulse {
+    0%, 100% {
+        opacity: 0.8;
+        transform: translate(-50%, -50%) scale(1);
+    }
+    50% {
+        opacity: 1;
+        transform: translate(-50%, -50%) scale(1.1);
+    }
 }
 
 
@@ -239,18 +279,22 @@
 
 .feature-tag {
     display: inline-block;
-    padding: 12px 24px;
-    background: rgba(255, 255, 255, 0.15);
-    border: 1px solid rgba(255, 255, 255, 0.3);
+    padding: 10px 28px;
+    background: rgba(250, 227, 7, 0.1);
+    border: 1px solid rgba(250, 227, 7, 0.4);
     border-radius: 24px;
-    font-size: 16px;
+    font-size: 15px;
+    color: rgba(255, 255, 255, 0.95);
     backdrop-filter: blur(10px);
     transition: all 0.3s ease;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2), 0 0 20px rgba(250, 227, 7, 0.1);
 }
 
 .feature-tag:hover {
-    background: rgba(255, 255, 255, 0.25);
-    transform: translateY(-2px);
+    background: rgba(250, 227, 7, 0.2);
+    border-color: rgba(250, 227, 7, 0.6);
+    transform: translateY(-3px);
+    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3), 0 0 30px rgba(250, 227, 7, 0.2);
 }
 
 .hero-cta {