diff --git a/index.html b/index.html
index 7f6c8c6..d5195fe 100644
--- a/index.html
+++ b/index.html
@@ -3,9 +3,9 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>极致优雅 - 奢华网页设计</title>
+    <title>霓虹极简 - 未来主义网页设计</title>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
-    <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=Montserrat:wght@300;400;500;600&display=swap" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700;900&family=Rajdhani:wght@300;400;500;600;700&display=swap" rel="stylesheet">
     <style>
         * {
             margin: 0;
@@ -14,22 +14,19 @@
         }
         
         :root {
-            --primary: #6e8efb;
-            --secondary: #a777e3;
-            --accent: #fc466b;
-            --dark: #0a0a18;
-            --light: #f8fafc;
-            --gold: #d4af37;
-            --gold-light: #f6e8b1;
-            --silver: #c0c0c0;
-            --platinum: #e5e4e2;
-            --diamond: #b9f2ff;
-            --transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+            --neon-blue: #00f3ff;
+            --neon-pink: #ff00ff;
+            --neon-purple: #bd00ff;
+            --neon-green: #39ff14;
+            --dark-bg: #0a0a12;
+            --dark-card: #12121f;
+            --light-text: #e6e6ff;
+            --transition: all 0.3s ease;
         }
         
         body {
-            background: linear-gradient(135deg, var(--dark), #0f0f2d);
-            color: var(--light);
+            background: var(--dark-bg);
+            color: var(--light-text);
             min-height: 100vh;
             display: flex;
             flex-direction: column;
@@ -39,11 +36,11 @@
             line-height: 1.6;
             overflow-x: hidden;
             position: relative;
-            font-family: 'Montserrat', sans-serif;
+            font-family: 'Rajdhani', sans-serif;
         }
         
-        /* 优雅背景效果 */
-        .elegant-bg {
+        /* 霓虹网格背景 */
+        .neon-grid {
             position: absolute;
             top: 0;
             left: 0;
@@ -51,168 +48,126 @@
             height: 100%;
             z-index: -3;
             overflow: hidden;
+            opacity: 0.3;
         }
         
-        .elegant-pattern {
+        .grid-line {
             position: absolute;
+            background: rgba(0, 243, 255, 0.1);
+        }
+        
+        .horizontal {
             width: 100%;
-            height: 100%;
-            background-image: 
-                radial-gradient(circle at 20% 30%, rgba(212, 175, 55, 0.03) 1px, transparent 1px),
-                radial-gradient(circle at 80% 70%, rgba(212, 175, 55, 0.03) 1px, transparent 1px);
-            background-size: 40px 40px;
-            opacity: 0.5;
-        }
-        
-        .gold-line {
-            position: absolute;
-            background: linear-gradient(90deg, transparent, var(--gold), transparent);
             height: 1px;
-            width: 100%;
         }
         
-        .line-1 {
-            top: 20%;
-            animation: lineMove 15s infinite linear;
+        .vertical {
+            width: 1px;
+            height: 100%;
         }
         
-        .line-2 {
-            top: 50%;
-            animation: lineMove 12s infinite linear reverse;
-        }
-        
-        .line-3 {
-            top: 80%;
-            animation: lineMove 18s infinite linear;
-        }
-        
-        @keyframes lineMove {
-            0% { background-position: -1000px 0; }
-            100% { background-position: 1000px 0; }
-        }
-        
-        /* 装饰元素 */
-        .ornament {
+        /* 霓虹灯效果装饰 */
+        .neon-circle {
             position: absolute;
-            font-size: 40px;
-            color: var(--gold);
-            opacity: 0.2;
-            z-index: -1;
+            border-radius: 50%;
+            border: 2px solid var(--neon-blue);
+            box-shadow: 0 0 10px var(--neon-blue), 0 0 20px var(--neon-blue);
+            opacity: 0.1;
+            animation: pulse 6s infinite alternate;
         }
         
-        .ornament-1 {
-            top: 10%;
-            left: 10%;
-            animation: float 8s infinite ease-in-out;
+        .circle-1 {
+            width: 300px;
+            height: 300px;
+            top: -100px;
+            left: -100px;
+            animation-delay: 0s;
         }
         
-        .ornament-2 {
-            bottom: 15%;
-            right: 12%;
-            animation: float 10s infinite ease-in-out reverse;
+        .circle-2 {
+            width: 200px;
+            height: 200px;
+            bottom: -50px;
+            right: -50px;
+            animation-delay: -2s;
+            border-color: var(--neon-pink);
+            box-shadow: 0 0 10px var(--neon-pink), 0 0 20px var(--neon-pink);
         }
         
-        .ornament-3 {
-            top: 25%;
-            right: 15%;
-            animation: float 12s infinite ease-in-out;
-        }
-        
-        @keyframes float {
-            0%, 100% { transform: translateY(0); }
-            50% { transform: translateY(-15px); }
+        @keyframes pulse {
+            0% { opacity: 0.05; transform: scale(0.95); }
+            100% { opacity: 0.2; transform: scale(1.05); }
         }
         
         .container {
             max-width: 1100px;
             width: 100%;
-            background: rgba(10, 10, 24, 0.7);
-            border-radius: 24px;
+            background: rgba(18, 18, 31, 0.8);
+            border-radius: 16px;
             box-shadow: 
-                0 0 0 1px rgba(255, 255, 255, 0.1),
-                0 20px 40px -12px rgba(0, 0, 0, 0.6),
-                inset 0 2px 4px rgba(255, 255, 255, 0.05);
-            backdrop-filter: blur(20px);
-            border: 1px solid rgba(255, 255, 255, 0.1);
+                0 0 0 1px rgba(0, 243, 255, 0.1),
+                0 0 30px rgba(0, 243, 255, 0.1);
+            backdrop-filter: blur(10px);
+            border: 1px solid rgba(0, 243, 255, 0.2);
             overflow: hidden;
             text-align: center;
-            padding: 60px 40px;
-            animation: containerAppear 1.2s ease-out;
+            padding: 50px 40px;
             position: relative;
             z-index: 1;
         }
         
-        @keyframes containerAppear {
-            from { 
-                opacity: 0; 
-                transform: translateY(40px);
-            }
-            to { 
-                opacity: 1; 
-                transform: translateY(0);
-            }
+        .neon-border {
+            position: absolute;
+            top: 10px;
+            left: 10px;
+            right: 10px;
+            bottom: 10px;
+            border: 1px solid rgba(0, 243, 255, 0.3);
+            border-radius: 12px;
+            pointer-events: none;
+            box-shadow: 0 0 15px rgba(0, 243, 255, 0.2);
+            animation: borderGlow 3s infinite alternate;
         }
         
-        .gold-border {
-            position: absolute;
-            top: 12px;
-            left: 12px;
-            right: 12px;
-            bottom: 12px;
-            border: 1px solid var(--gold);
-            border-radius: 16px;
-            pointer-events: none;
-            opacity: 0.4;
-            box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);
+        @keyframes borderGlow {
+            0% { box-shadow: 0 0 15px rgba(0, 243, 255, 0.2); }
+            100% { box-shadow: 0 0 25px rgba(0, 243, 255, 0.4), 0 0 40px rgba(0, 243, 255, 0.1); }
         }
         
         h1 {
-            font-family: 'Cormorant Garamond', serif;
-            font-size: 4.2rem;
+            font-family: 'Orbitron', sans-serif;
+            font-size: 4rem;
             font-weight: 700;
             margin-bottom: 20px;
-            background: linear-gradient(to right, var(--gold), var(--gold-light), var(--diamond), var(--gold));
-            -webkit-background-clip: text;
-            -webkit-text-fill-color: transparent;
-            text-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
+            color: var(--neon-blue);
+            text-shadow: 0 0 10px var(--neon-blue);
             letter-spacing: 2px;
             position: relative;
-            display: inline-block;
-        }
-        
-        h1::after {
-            content: '';
-            position: absolute;
-            bottom: -12px;
-            left: 30%;
-            width: 40%;
-            height: 2px;
-            background: linear-gradient(to right, transparent, var(--gold), transparent);
-            border-radius: 2px;
         }
         
         .subtitle {
-            font-size: 1.6rem;
-            color: var(--platinum);
-            margin-bottom: 50px;
+            font-size: 1.5rem;
+            color: var(--light-text);
+            margin-bottom: 40px;
             font-weight: 300;
-            letter-spacing: 2px;
+            letter-spacing: 3px;
+            text-transform: uppercase;
         }
         
         .divider {
-            height: 1px;
-            width: 180px;
-            background: linear-gradient(to right, transparent, var(--gold), transparent);
-            margin: 0 auto 50px;
+            height: 2px;
+            width: 200px;
+            background: linear-gradient(to right, transparent, var(--neon-blue), transparent);
+            margin: 0 auto 40px;
             position: relative;
         }
         
         .divider::before, .divider::after {
-            content: '✦';
+            content: '◆';
             position: absolute;
             top: -10px;
-            color: var(--gold);
-            font-size: 22px;
+            color: var(--neon-blue);
+            font-size: 20px;
         }
         
         .divider::before {
@@ -224,99 +179,66 @@
         }
         
         .content-box {
-            background: rgba(255, 255, 255, 0.03);
-            border-radius: 20px;
-            padding: 40px;
-            margin: 50px 0;
-            border: 1px solid rgba(255, 255, 255, 0.08);
+            background: rgba(0, 243, 255, 0.05);
+            border-radius: 12px;
+            padding: 30px;
+            margin: 40px 0;
+            border: 1px solid rgba(0, 243, 255, 0.1);
             position: relative;
             overflow: hidden;
             transition: var(--transition);
         }
         
-        .content-box::before {
-            content: '';
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            background: linear-gradient(45deg, transparent, rgba(212, 175, 55, 0.08), transparent);
-            transform: translateX(-100%) skewX(-15deg);
-            transition: transform 0.7s ease;
-        }
-        
-        .content-box:hover::before {
-            transform: translateX(100%) skewX(-15deg);
-        }
-        
         .content-box:hover {
             transform: translateY(-5px);
-            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.4);
+            box-shadow: 0 5px 20px rgba(0, 243, 255, 0.2);
         }
         
         .original-text {
-            font-family: 'Cormorant Garamond', serif;
-            font-size: 3rem;
-            font-weight: 600;
-            font-style: italic;
-            padding: 30px 50px;
-            background: rgba(0, 0, 0, 0.25);
-            border-radius: 16px;
+            font-family: 'Orbitron', sans-serif;
+            font-size: 2.5rem;
+            font-weight: 500;
+            padding: 25px 40px;
+            background: rgba(0, 0, 0, 0.3);
+            border-radius: 8px;
             display: inline-block;
             margin: 30px 0;
-            border: 1px solid var(--gold);
-            box-shadow: 0 0 30px rgba(212, 175, 55, 0.2);
+            border: 1px solid var(--neon-pink);
+            box-shadow: 0 0 15px rgba(255, 0, 255, 0.3);
             position: relative;
             transition: var(--transition);
             cursor: pointer;
-            overflow: hidden;
-        }
-        
-        .original-text::before {
-            content: '';
-            position: absolute;
-            top: -8px;
-            left: -8px;
-            right: -8px;
-            bottom: -8px;
-            background: linear-gradient(45deg, var(--gold), var(--diamond), var(--gold));
-            z-index: -1;
-            border-radius: 20px;
-            opacity: 0;
-            transition: var(--transition);
-        }
-        
-        .original-text:hover::before {
-            opacity: 0.2;
+            color: var(--neon-pink);
+            text-shadow: 0 0 8px var(--neon-pink);
         }
         
         .original-text:hover {
             transform: scale(1.03);
-            box-shadow: 0 0 40px rgba(212, 175, 55, 0.3);
+            box-shadow: 0 0 25px rgba(255, 0, 255, 0.5);
         }
         
         .quote-icon {
-            font-size: 2rem;
+            font-size: 1.8rem;
             margin: 0 15px;
-            color: var(--gold);
+            color: var(--neon-pink);
             vertical-align: middle;
+            text-shadow: 0 0 8px var(--neon-pink);
         }
         
         .features {
             display: grid;
             grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
-            gap: 30px;
-            margin: 60px 0;
+            gap: 25px;
+            margin: 50px 0;
         }
         
         .feature {
-            background: rgba(255, 255, 255, 0.03);
-            padding: 40px 30px;
-            border-radius: 20px;
-            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
+            background: rgba(18, 18, 31, 0.9);
+            padding: 30px 25px;
+            border-radius: 12px;
+            box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
             transition: var(--transition);
-            border: 1px solid rgba(255, 255, 255, 0.08);
+            border: 1px solid rgba(0, 243, 255, 0.1);
             position: relative;
             overflow: hidden;
         }
@@ -326,9 +248,9 @@
             position: absolute;
             top: 0;
             left: 0;
-            width: 4px;
+            width: 3px;
             height: 100%;
-            background: linear-gradient(to bottom, var(--gold), var(--diamond));
+            background: linear-gradient(to bottom, var(--neon-blue), var(--neon-purple));
             opacity: 0;
             transition: var(--transition);
         }
@@ -339,63 +261,48 @@
         
         .feature:hover {
             transform: translateY(-8px);
-            background: rgba(255, 255, 255, 0.05);
-            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.4);
+            box-shadow: 0 10px 25px rgba(0, 243, 255, 0.2);
         }
         
         .feature i {
-            font-size: 3.2rem;
-            margin-bottom: 25px;
-            background: linear-gradient(to right, var(--gold), var(--diamond));
-            -webkit-background-clip: text;
-            -webkit-text-fill-color: transparent;
-            position: relative;
-        }
-        
-        .feature i::after {
-            content: '';
-            position: absolute;
-            bottom: -12px;
-            left: 50%;
-            transform: translateX(-50%);
-            width: 40px;
-            height: 2px;
-            background: var(--gold);
-            border-radius: 2px;
+            font-size: 2.8rem;
+            margin-bottom: 20px;
+            color: var(--neon-blue);
+            text-shadow: 0 0 10px var(--neon-blue);
         }
         
         .feature h3 {
-            font-size: 1.6rem;
-            margin-bottom: 20px;
-            color: var(--light);
-            font-family: 'Cormorant Garamond', serif;
+            font-size: 1.5rem;
+            margin-bottom: 15px;
+            color: var(--light-text);
+            font-family: 'Orbitron', sans-serif;
         }
         
         .feature p {
-            color: #ccc;
+            color: #a0a0cc;
             font-size: 1.1rem;
-            line-height: 1.7;
+            line-height: 1.6;
         }
         
         .interactive-section {
-            margin: 50px 0;
-            padding: 40px;
-            background: rgba(255, 255, 255, 0.03);
-            border-radius: 20px;
-            border: 1px solid rgba(255, 255, 255, 0.08);
+            margin: 40px 0;
+            padding: 30px;
+            background: rgba(18, 18, 31, 0.9);
+            border-radius: 12px;
+            border: 1px solid rgba(0, 243, 255, 0.1);
             position: relative;
         }
         
         .interactive-section::before {
-            content: '✦ ✦ ✦';
+            content: '◆ ◆ ◆';
             position: absolute;
-            top: -18px;
+            top: -15px;
             left: 50%;
             transform: translateX(-50%);
-            color: var(--gold);
-            font-size: 24px;
-            background: var(--dark);
-            padding: 0 25px;
+            color: var(--neon-blue);
+            font-size: 20px;
+            background: var(--dark-bg);
+            padding: 0 20px;
         }
         
         .color-palette {
@@ -403,25 +310,25 @@
             justify-content: center;
             flex-wrap: wrap;
             gap: 15px;
-            margin: 30px 0;
+            margin: 25px 0;
         }
         
         .color-option {
-            width: 60px;
-            height: 60px;
+            width: 50px;
+            height: 50px;
             border-radius: 50%;
             cursor: pointer;
             transition: var(--transition);
             border: 2px solid transparent;
             position: relative;
             overflow: hidden;
-            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
+            box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
         }
         
         .color-option.active {
-            transform: scale(1.1);
-            border-color: var(--light);
-            box-shadow: 0 0 25px rgba(255, 255, 255, 0.4);
+            transform: scale(1.15);
+            border-color: var(--light-text);
+            box-shadow: 0 0 15px currentColor;
         }
         
         .color-option::after {
@@ -431,7 +338,7 @@
             left: 50%;
             transform: translate(-50%, -50%);
             color: white;
-            font-size: 1.8rem;
+            font-size: 1.5rem;
             opacity: 0;
             transition: var(--transition);
         }
@@ -440,103 +347,83 @@
             opacity: 1;
         }
         
-        .theme-1 { background: linear-gradient(135deg, #0a0a18, #0f0f2d, #1a1a40); }
-        .theme-2 { background: linear-gradient(135deg, #2d0f2d, #6a1b6d, #9b4b9b); }
-        .theme-3 { background: linear-gradient(135deg, #1a1a40, #2d2d7d, #4a4ab8); }
-        .theme-4 { background: linear-gradient(135deg, #1c2833, #566573, #85929e); }
-        .theme-5 { background: linear-gradient(135deg, #0d3b66, #1e6fa9, #2e86c1); }
+        .theme-1 { background: var(--neon-blue); }
+        .theme-2 { background: var(--neon-pink); }
+        .theme-3 { background: var(--neon-purple); }
+        .theme-4 { background: var(--neon-green); }
         
         footer {
-            margin-top: 70px;
-            color: var(--silver);
+            margin-top: 60px;
+            color: #a0a0cc;
             text-align: center;
-            font-size: 1.1rem;
+            font-size: 1rem;
             position: relative;
         }
         
         footer::before {
             content: '';
             position: absolute;
-            top: -35px;
+            top: -30px;
             left: 50%;
             transform: translateX(-50%);
-            width: 250px;
+            width: 200px;
             height: 1px;
-            background: linear-gradient(to right, transparent, var(--gold), transparent);
+            background: linear-gradient(to right, transparent, var(--neon-blue), transparent);
         }
         
         .social-links {
             display: flex;
             justify-content: center;
-            gap: 25px;
-            margin-top: 30px;
+            gap: 20px;
+            margin-top: 25px;
         }
         
         .social-links a {
             display: flex;
             align-items: center;
             justify-content: center;
-            width: 60px;
-            height: 60px;
+            width: 50px;
+            height: 50px;
             border-radius: 50%;
-            background: rgba(255, 255, 255, 0.08);
-            color: var(--light);
-            font-size: 1.5rem;
+            background: rgba(18, 18, 31, 0.9);
+            color: var(--neon-blue);
+            font-size: 1.3rem;
             transition: var(--transition);
             position: relative;
             overflow: hidden;
-        }
-        
-        .social-links a::before {
-            content: '';
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            background: linear-gradient(45deg, var(--gold), var(--diamond));
-            opacity: 0;
-            transition: var(--transition);
-            z-index: -1;
-        }
-        
-        .social-links a:hover::before {
-            opacity: 1;
+            border: 1px solid rgba(0, 243, 255, 0.2);
         }
         
         .social-links a:hover {
+            color: var(--neon-pink);
             transform: translateY(-5px);
-            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
+            box-shadow: 0 0 15px rgba(255, 0, 255, 0.3);
+            border-color: rgba(255, 0, 255, 0.3);
         }
         
         /* 响应式设计 */
         @media (max-width: 1200px) {
             h1 {
-                font-size: 3.8rem;
+                font-size: 3.5rem;
             }
             
             .original-text {
-                font-size: 2.8rem;
-                padding: 25px 45px;
+                font-size: 2.2rem;
             }
         }
         
         @media (max-width: 992px) {
             h1 {
-                font-size: 3.2rem;
+                font-size: 3rem;
             }
             
             .subtitle {
-                font-size: 1.4rem;
+                font-size: 1.3rem;
             }
             
             .original-text {
-                font-size: 2.4rem;
-                padding: 20px 35px;
-            }
-            
-            .feature {
-                padding: 35px 25px;
+                font-size: 2rem;
+                padding: 20px 30px;
             }
         }
         
@@ -546,16 +433,16 @@
             }
             
             h1 {
-                font-size: 2.8rem;
+                font-size: 2.5rem;
             }
             
             .subtitle {
-                font-size: 1.2rem;
+                font-size: 1.1rem;
             }
             
             .original-text {
-                font-size: 2rem;
-                padding: 20px 30px;
+                font-size: 1.8rem;
+                padding: 15px 25px;
             }
             
             .features {
@@ -563,182 +450,148 @@
             }
             
             .color-option {
-                width: 50px;
-                height: 50px;
+                width: 45px;
+                height: 45px;
             }
             
             .social-links a {
-                width: 50px;
-                height: 50px;
-                font-size: 1.3rem;
+                width: 45px;
+                height: 45px;
+                font-size: 1.2rem;
             }
         }
         
-        /* 粒子效果 */
-        .particles {
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            z-index: -1;
+        /* 霓虹文字效果 */
+        .neon-text {
+            text-shadow: 
+                0 0 5px currentColor,
+                0 0 10px currentColor,
+                0 0 20px currentColor,
+                0 0 40px currentColor;
         }
         
-        .particle {
-            position: absolute;
-            border-radius: 50%;
-            background: rgba(255, 255, 255, 0.6);
-            animation: float-particle 20s infinite linear;
+        /* 霓虹按钮效果 */
+        .neon-btn {
+            display: inline-block;
+            padding: 12px 30px;
+            margin: 20px 10px;
+            background: transparent;
+            color: var(--neon-blue);
+            border: 2px solid var(--neon-blue);
+            border-radius: 30px;
+            font-family: 'Orbitron', sans-serif;
+            font-size: 1.1rem;
+            text-transform: uppercase;
+            letter-spacing: 2px;
+            cursor: pointer;
+            transition: var(--transition);
+            box-shadow: 
+                0 0 10px rgba(0, 243, 255, 0.3),
+                inset 0 0 10px rgba(0, 243, 255, 0.1);
+            text-shadow: 0 0 5px var(--neon-blue);
         }
         
-        @keyframes float-particle {
-            0% {
-                transform: translateY(0) translateX(0) rotate(0deg);
-                opacity: 0;
-            }
-            10% {
-                opacity: 1;
-            }
-            90% {
-                opacity: 1;
-            }
-            100% {
-                transform: translateY(-100vh) translateX(100px) rotate(360deg);
-                opacity: 0;
-            }
-        }
-        
-        /* 优雅的滚动条 */
-        ::-webkit-scrollbar {
-            width: 8px;
-        }
-        
-        ::-webkit-scrollbar-track {
-            background: rgba(10, 10, 24, 0.8);
-        }
-        
-        ::-webkit-scrollbar-thumb {
-            background: linear-gradient(to bottom, var(--gold), var(--diamond));
-            border-radius: 4px;
-        }
-        
-        ::-webkit-scrollbar-thumb:hover {
-            background: linear-gradient(to bottom, var(--gold-light), var(--diamond));
+        .neon-btn:hover {
+            background: var(--neon-blue);
+            color: var(--dark-bg);
+            box-shadow: 
+                0 0 20px var(--neon-blue),
+                0 0 40px var(--neon-blue),
+                inset 0 0 20px rgba(255, 255, 255, 0.3);
+            text-shadow: none;
         }
     </style>
 </head>
 <body>
-    <!-- 优雅背景 -->
-    <div class="elegant-bg">
-        <div class="elegant-pattern"></div>
-        <div class="gold-line line-1"></div>
-        <div class="gold-line line-2"></div>
-        <div class="gold-line line-3"></div>
-    </div>
+    <!-- 霓虹网格背景 -->
+    <div class="neon-grid"></div>
     
-    <!-- 粒子背景 -->
-    <div class="particles" id="particles"></div>
-    
-    <!-- 装饰元素 -->
-    <div class="ornament ornament-1">✦</div>
-    <div class="ornament ornament-2">❖</div>
-    <div class="ornament ornament-3">♚</div>
+    <!-- 霓虹圆圈装饰 -->
+    <div class="neon-circle circle-1"></div>
+    <div class="neon-circle circle-2"></div>
     
     <div class="container">
-        <div class="gold-border"></div>
+        <div class="neon-border"></div>
         
-        <h1>极致优雅</h1>
-        <p class="subtitle">简约之中见非凡，空灵之处显意境</p>
+        <h1 class="neon-text" style="color: var(--neon-blue)">霓虹极简</h1>
+        <p class="subtitle">未来主义美学与简约设计的完美融合</p>
         
         <div class="divider"></div>
         
         <div class="content-box">
-            <p>原始内容被重新赋予艺术生命：</p>
-            <div class="original-text">
+            <p>原始内容被赋予未来感：</p>
+            <div class="original-text neon-text">
                 <i class="fas fa-quote-left quote-icon"></i> 啥都没有 <i class="fas fa-quote-right quote-icon"></i>
             </div>
-            <p>在极简主义中，空白本身就是一种设计语言</p>
+            <p>在数字时代，极简主义获得了新的表达形式</p>
         </div>
         
         <div class="features">
             <div class="feature">
-                <i class="fas fa-gem"></i>
-                <h3>奢华设计</h3>
-                <p>采用顶级设计理念，融合金质元素与精致细节，创造非凡视觉体验</p>
+                <i class="fas fa-microchip"></i>
+                <h3>科技美学</h3>
+                <p>融合赛博朋克元素与未来主义设计语言，创造数字时代的视觉体验</p>
             </div>
             <div class="feature">
-                <i class="fas fa-crown"></i>
-                <h3>尊贵体验</h3>
-                <p>每一个交互细节都经过精心设计，提供无与伦比的用户体验</p>
+                <i class="fas fa-lightbulb"></i>
+                <h3>霓虹光影</h3>
+                <p>使用发光效果和鲜艳色彩，营造充满未来感的视觉氛围</p>
             </div>
             <div class="feature">
-                <i class="fas fa-palette"></i>
-                <h3>艺术美学</h3>
-                <p>将网页设计提升到艺术层面，每一个像素都体现着美学追求</p>
+                <i class="fas fa-code"></i>
+                <h3>数字简约</h3>
+                <p>在复杂的技术中寻找简约之美，创造清晰而有力的设计表达</p>
             </div>
         </div>
         
         <div class="interactive-section">
-            <h3>选择主题色彩</h3>
+            <h3>选择霓虹色彩</h3>
             <div class="color-palette">
-                <div class="color-option theme-1 active" data-theme="default"></div>
-                <div class="color-option theme-2" data-theme="royal"></div>
-                <div class="color-option theme-3" data-theme="majestic"></div>
-                <div class="color-option theme-4" data-theme="silver"></div>
-                <div class="color-option theme-5" data-theme="ocean"></div>
+                <div class="color-option theme-1 active" data-theme="blue"></div>
+                <div class="color-option theme-2" data-theme="pink"></div>
+                <div class="color-option theme-3" data-theme="purple"></div>
+                <div class="color-option theme-4" data-theme="green"></div>
+            </div>
+            <p>点击上方色块切换霓虹主题色彩</p>
+            
+            <div class="neon-btn-container">
+                <button class="neon-btn">探索更多</button>
+                <button class="neon-btn" style="color: var(--neon-pink); border-color: var(--neon-pink); box-shadow: 0 0 10px rgba(255, 0, 255, 0.3), inset 0 0 10px rgba(255, 0, 255, 0.1); text-shadow: 0 0 5px var(--neon-pink);">了解更多</button>
             </div>
-            <p>点击上方色块切换页面主题色彩</p>
         </div>
         
-        <p class="subtitle">少即是多，空即是满，无即是有</p>
+        <p class="subtitle">简约是终极的复杂</p>
     </div>
     
     <footer>
-        <p>© 2023 极致优雅美学 | 设计于当下，着眼于未来</p>
+        <p>© 2023 霓虹极简美学 | 设计于数字时代，着眼于未来</p>
         <div class="social-links">
             <a href="#"><i class="fab fa-twitter"></i></a>
             <a href="#"><i class="fab fa-instagram"></i></a>
-            <a href="#"><i class="fab fa-pinterest"></i></a>
             <a href="#"><i class="fab fa-github"></i></a>
+            <a href="#"><i class="fab fa-linkedin"></i></a>
         </div>
     </footer>
     
     <script>
-        // 创建粒子背景
-        function createParticles() {
-            const particlesContainer = document.getElementById('particles');
-            const particleCount = 40;
+        // 创建网格背景
+        function createGrid() {
+            const gridContainer = document.querySelector('.neon-grid');
             
-            for (let i = 0; i < particleCount; i++) {
-                const particle = document.createElement('div');
-                particle.classList.add('particle');
-                
-                // 随机大小和位置
-                const size = Math.random() * 5 + 2;
-                const posX = Math.random() * 100;
-                const duration = Math.random() * 15 + 20;
-                const delay = Math.random() * -20;
-                
-                particle.style.width = `${size}px`;
-                particle.style.height = `${size}px`;
-                particle.style.left = `${posX}%`;
-                particle.style.animationDuration = `${duration}s`;
-                particle.style.animationDelay = `${delay}s`;
-                
-                // 金色、银色或钻石色粒子
-                const colorChoice = Math.random();
-                if (colorChoice < 0.4) {
-                    particle.style.background = 'rgba(212, 175, 55, 0.7)';
-                    particle.style.boxShadow = '0 0 8px rgba(212, 175, 55, 0.4)';
-                } else if (colorChoice < 0.8) {
-                    particle.style.background = 'rgba(192, 192, 192, 0.7)';
-                    particle.style.boxShadow = '0 0 8px rgba(192, 192, 192, 0.4)';
-                } else {
-                    particle.style.background = 'rgba(185, 242, 255, 0.7)';
-                    particle.style.boxShadow = '0 0 8px rgba(185, 242, 255, 0.4)';
-                }
-                
-                particlesContainer.appendChild(particle);
+            // 创建水平线
+            for (let i = 0; i <= 100; i += 5) {
+                const line = document.createElement('div');
+                line.classList.add('grid-line', 'horizontal');
+                line.style.top = `${i}%`;
+                gridContainer.appendChild(line);
+            }
+            
+            // 创建垂直线
+            for (let i = 0; i <= 100; i += 5) {
+                const line = document.createElement('div');
+                line.classList.add('grid-line', 'vertical');
+                line.style.left = `${i}%`;
+                gridContainer.appendChild(line);
             }
         }
         
@@ -764,44 +617,62 @@
         // 切换主题函数
         function changeTheme(theme) {
             const root = document.documentElement;
+            const title = document.querySelector('h1');
+            const originalText = document.querySelector('.original-text');
+            const quoteIcons = document.querySelectorAll('.quote-icon');
+            const neonBtns = document.querySelectorAll('.neon-btn');
             
             // 根据主题更新CSS变量
             switch(theme) {
-                case 'royal':
-                    root.style.setProperty('--dark', '#2d0f2d');
-                    root.style.setProperty('--gold', '#9b4b9b');
-                    root.style.setProperty('--gold-light', '#d6a8d6');
-                    root.style.setProperty('--diamond', '#f7bef7');
+                case 'pink':
+                    root.style.setProperty('--neon-blue', '#ff00ff');
+                    root.style.setProperty('--neon-pink', '#ff00ff');
+                    root.style.setProperty('--neon-purple', '#ff00ff');
+                    title.style.color = '#ff00ff';
+                    originalText.style.color = '#ff00ff';
+                    originalText.style.borderColor = '#ff00ff';
+                    originalText.style.boxShadow = '0 0 15px rgba(255, 0, 255, 0.3)';
+                    quoteIcons.forEach(icon => icon.style.color = '#ff00ff');
+                    quoteIcons.forEach(icon => icon.style.textShadow = '0 0 8px #ff00ff');
                     break;
-                case 'majestic':
-                    root.style.setProperty('--dark', '#1a1a40');
-                    root.style.setProperty('--gold', '#4a4ab8');
-                    root.style.setProperty('--gold-light', '#a6a6f6');
-                    root.style.setProperty('--diamond', '#b9b9ff');
+                case 'purple':
+                    root.style.setProperty('--neon-blue', '#bd00ff');
+                    root.style.setProperty('--neon-pink', '#bd00ff');
+                    root.style.setProperty('--neon-purple', '#bd00ff');
+                    title.style.color = '#bd00ff';
+                    originalText.style.color = '#bd00ff';
+                    originalText.style.borderColor = '#bd00ff';
+                    originalText.style.boxShadow = '0 0 15px rgba(189, 0, 255, 0.3)';
+                    quoteIcons.forEach(icon => icon.style.color = '#bd00ff');
+                    quoteIcons.forEach(icon => icon.style.textShadow = '0 0 8px #bd00ff');
                     break;
-                case 'silver':
-                    root.style.setProperty('--dark', '#1c2833');
-                    root.style.setProperty('--gold', '#85929e');
-                    root.style.setProperty('--gold-light', '#d0d3d4');
-                    root.style.setProperty('--diamond', '#f4f6f7');
-                    break;
-                case 'ocean':
-                    root.style.setProperty('--dark', '#0d3b66');
-                    root.style.setProperty('--gold', '#2e86c1');
-                    root.style.setProperty('--gold-light', '#aed6f1');
-                    root.style.setProperty('--diamond', '#d6eaf8');
+                case 'green':
+                    root.style.setProperty('--neon-blue', '#39ff14');
+                    root.style.setProperty('--neon-pink', '#39ff14');
+                    root.style.setProperty('--neon-purple', '#39ff14');
+                    title.style.color = '#39ff14';
+                    originalText.style.color = '#39ff14';
+                    originalText.style.borderColor = '#39ff14';
+                    originalText.style.boxShadow = '0 0 15px rgba(57, 255, 20, 0.3)';
+                    quoteIcons.forEach(icon => icon.style.color = '#39ff14');
+                    quoteIcons.forEach(icon => icon.style.textShadow = '0 0 8px #39ff14');
                     break;
                 default:
-                    root.style.setProperty('--dark', '#0a0a18');
-                    root.style.setProperty('--gold', '#d4af37');
-                    root.style.setProperty('--gold-light', '#f6e8b1');
-                    root.style.setProperty('--diamond', '#b9f2ff');
+                    root.style.setProperty('--neon-blue', '#00f3ff');
+                    root.style.setProperty('--neon-pink', '#ff00ff');
+                    root.style.setProperty('--neon-purple', '#bd00ff');
+                    title.style.color = '#00f3ff';
+                    originalText.style.color = '#ff00ff';
+                    originalText.style.borderColor = '#ff00ff';
+                    originalText.style.boxShadow = '0 0 15px rgba(255, 0, 255, 0.3)';
+                    quoteIcons.forEach(icon => icon.style.color = '#ff00ff');
+                    quoteIcons.forEach(icon => icon.style.textShadow = '0 0 8px #ff00ff');
             }
         }
         
         // 初始化
         document.addEventListener('DOMContentLoaded', function() {
-            createParticles();
+            createGrid();
             setupThemeToggle();
             
             // 为原始文本添加点击动画
@@ -813,14 +684,14 @@
                 }, 300);
             });
             
-            // 添加滚动效果
-            window.addEventListener('scroll', function() {
-                const scrolled = window.pageYOffset;
-                const parallaxElements = document.querySelectorAll('.feature, .content-box');
-                
-                parallaxElements.forEach(element => {
-                    const speed = 0.05;
-                    element.style.transform = `translateY(${scrolled * speed}px)`;
+            // 为按钮添加点击效果
+            const buttons = document.querySelectorAll('.neon-btn');
+            buttons.forEach(button => {
+                button.addEventListener('click', function() {
+                    this.style.transform = 'scale(0.95)';
+                    setTimeout(() => {
+                        this.style.transform = 'scale(1)';
+                    }, 300);
                 });
             });
         });
