diff --git a/FPGA.html b/FPGA.html
new file mode 100644
index 0000000..3e08690
--- /dev/null
+++ b/FPGA.html
@@ -0,0 +1,427 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <title>产品详情 - 隼瞻科技</title>
+
+    <!-- Tailwind (kept, may be used for layout utilities) -->
+    <script src="https://cdn.tailwindcss.com"></script>
+
+    <!-- Font Awesome & Font -->
+    <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+
+    <!-- Main styles (changed to text/css so WordPress won't ignore it) -->
+    <style type="text/css">
+        /* Colour system used in this component - scoped under #sj-product-page to avoid collisions with WP theme CSS */
+        #sj-product-page {
+            --primary: #3b82f6;
+            --secondary: #2563eb;
+            --accent: #60a5fa;
+            --dark: #111827;
+            --darker: #0b1220; /* slightly darker than original to ensure contrast */
+            --light: #f8fafc;
+            --bg-dark: #1f2937;
+            --bg-darker: #111827;
+            font-family: "Inter", sans-serif;
+            background-color: var(--darker) !important;
+            color: #e5e7eb !important;
+        }
+
+        /* Force colours for commonly used utility-like classes INSIDE our scope so WP theme CSS won't override */
+        #sj-product-page .relative z-10er { background-color: var(--bg-darker) !important; }
+        #sj-product-page .relative z-10 { background-color: var(--bg-dark) !important; }
+        #sj-product-page .bg-darker { background-color: var(--bg-darker) !important; }
+        #sj-product-page .bg-dark { background-color: var(--bg-dark) !important; }
+
+        #sj-product-page .bg-primary { background-color: var(--primary) !important; }
+        #sj-product-page .text-blue-600 { color: var(--primary) !important; }
+        #sj-product-page .text-secondary { color: var(--secondary) !important; }
+        #sj-product-page .text-slate-800 { color: #ffffff !important; }
+
+        /* Replacements for Tailwind-like fractional opacity classes that use "/" (which can be tricky in CSS selectors).
+           In the markup we use bg-blue-50 border border-blue-100 and bg-blue-100 border border-blue-200, map them here. */
+        #sj-product-page .bg-blue-50 border border-blue-100 { background-color: rgba(59,130,246,0.20) !important; }
+        #sj-product-page .bg-blue-100 border border-blue-200 { background-color: rgba(59,130,246,0.10) !important; }
+
+        /* Text greys used in the content */
+        #sj-product-page .text-gray-100 { color: #f3f4f6 !important; }
+        #sj-product-page .text-slate-600 font-medium { color: #d1d5db !important; }
+        #sj-product-page .text-slate-500 font-bold { color: #9ca3af !important; }
+
+        /* Card and element overrides so WP theme won't change them unexpectedly */
+        #sj-product-page .rounded-xl { border-radius: 0.75rem !important; }
+        #sj-product-page .rounded-2xl { border-radius: 1rem !important; }
+        #sj-product-page .shadow-md { box-shadow: 0 6px 18px rgba(2,6,23,0.6) !important; }
+        #sj-product-page .shadow-lg { box-shadow: 0 10px 30px rgba(2,6,23,0.7) !important; }
+
+        /* Utility-ish things used in the layout */
+        #sj-product-page .container { max-width: 1200px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; }
+        @media (min-width: 768px) { #sj-product-page .container { padding-left: 1.5rem; padding-right: 1.5rem; } }
+        @media (min-width: 1024px) { #sj-product-page .container { padding-left: 2rem; padding-right: 2rem; } }
+
+        /* Grid safe defaults inside scope */
+        #sj-product-page .grid { display: grid; gap: 1.5rem; }
+        @media (min-width: 768px) {
+            #sj-product-page .md\\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
+            #sj-product-page .md\\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
+            #sj-product-page .md\\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
+            #sj-product-page .md\\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0,1fr)); }
+        }
+        @media (min-width: 1024px) {
+            #sj-product-page .lg\\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
+            #sj-product-page .lg\\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
+        }
+
+        /* Visual helpers included originally */
+        #sj-product-page .text-shadow { text-shadow: 0 2px 4px rgba(0,0,0,0.1); }
+        #sj-product-page .product-feature-card { transition: all 0.3s ease; }
+        #sj-product-page .product-feature-card:hover { transform: translateY(-5px); }
+        #sj-product-page .section-active { color: var(--secondary) !important; border-bottom: 2px solid var(--secondary) !important; }
+
+        /* Scroll animation - same as original but scoped */
+        #sj-product-page .animate-fade-in {
+            opacity: 0;
+            transform: translateY(20px);
+            transition: opacity 0.6s ease-out, transform 0.6s ease-out;
+        }
+        #sj-product-page .animate-fade-in.visible {
+            opacity: 1;
+            transform: translateY(0);
+        }
+
+        /* ripple and hover effects (scoped) */
+        #sj-product-page .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
+        #sj-product-page .hover-float:hover { transform: translateY(-5px); }
+
+        /* background grid graphic - keep scoped to avoid global overrides */
+        #sj-product-page .bg-grid {
+            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%239C92AC' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
+        }
+
+        /* gradient animation (scoped) */
+        @keyframes gradientFlow {
+            0% { background-position: 0% 50%; }
+            50% { background-position: 100% 50%; }
+            100% { background-position: 0% 50%; }
+        }
+        #sj-product-page .gradient-animate {
+            background-size: 200% 200% !important;
+            animation: gradientFlow 15s ease infinite !important;
+        }
+
+        /* subtle pulse */
+        @keyframes pulseSlow {
+            0%,100% { transform: scale(1); }
+            50% { transform: scale(1.05); }
+        }
+        #sj-product-page .animate-pulse-slow { animation: pulseSlow 3s ease-in-out infinite !important; }
+
+        /* Ensure links inside the scope have our primary colour by default */
+        #sj-product-page a { color: var(--primary) !important; text-decoration: none !important; }
+        #sj-product-page a:hover { color: var(--secondary) !important; }
+
+        /* Ensure images maintain high contrast against dark background */
+        #sj-product-page img { display: block; max-width: 100%; height: auto; }
+
+        /* Minor typography adjustments inside scope to avoid theme overrides */
+        #sj-product-page h1, #sj-product-page h2, #sj-product-page h3, #sj-product-page h4 {
+            color: #ffffff !important;
+        }
+
+        /* Make sure borders used in cards are visible on dark backgrounds */
+        #sj-product-page .border { border-color: rgba(255,255,255,0.06) !important; }
+        #sj-product-page .border-white { border-color: rgba(148,163,184,0.12) !important; }
+    </style>
+
+    <!-- Legacy utility styles (converted from original tailwind-layer rules) - kept scoped and with text/css -->
+    <style type="text/css">
+        /* small subset of custom utilities used by this page, scoped */
+        #sj-product-page .content-auto { content-visibility: auto; }
+        #sj-product-page .text-gradient { background-clip: text; -webkit-background-clip: text; color: transparent; }
+        #sj-product-page .product-feature-card { transition: all 0.3s ease; }
+        #sj-product-page .section-active { color: var(--secondary) !important; border-bottom: 2px solid var(--secondary) !important; }
+        #sj-product-page .count-up { transition: all 0.8s ease-out; }
+        #sj-product-page .ripple { position: relative; overflow: hidden; }
+        #sj-product-page .ripple:after {
+            content: "";
+            display: block;
+            position: absolute;
+            width: 100%;
+            height: 100%;
+            top: 0; left: 0;
+            pointer-events: none;
+            background-image: radial-gradient(circle, #fff 10%, transparent 10.01%);
+            background-repeat: no-repeat;
+            background-position: 50%;
+            transform: scale(10, 10);
+            opacity: 0;
+            transition: transform 0.5s, opacity 0.8s;
+        }
+        #sj-product-page .ripple:active:after { transform: scale(0,0); opacity: 0.3; transition: 0s; }
+    </style>
+</head>
+<body>
+    <!-- Wrapper with an ID so we can scope styles and avoid WP theme interference -->
+    <div id="sj-product-page" class="min-h-screen">
+
+        <!-- 产品页面头部 -->
+        <section class="pt-24 md:pt-32 pb-16 md:pb-24 bg-gradient-to-br gradient-animate" >
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto text-center">
+                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-bold text-slate-800 leading-tight text-shadow mb-6">
+                        FPGA开发板
+                    </h1>
+                    <div class="bg-blue-50 border border-blue-100 inline-block px-6 pt-4 rounded-full mb-6 animate-fade-in">
+                        <h2 class="text-xl font-semibold text-blue-600">Wing-FPGA-XCKU5P-EVB开发板</h2>
+                    </div>
+                    
+                    <!-- 产品图片 - 可替换为实际产品图片 -->
+                    <div class="mb-8 max-w-2xl mx-auto animate-fade-in">
+                        <div class="relative z-10er p-4 rounded-xl shadow-lg">
+                            <img src="https://www.beiyuxing.live/wp-content/uploads/2025/11/whiteboard_exported_image-21-1.png" alt="Wing-M130处理器IP" class="w-full h-auto rounded-lg max-h-64 object-contain mx-auto">
+                            <!-- 提示：请将上方src属性中的"your_product_image.png"替换为实际产品图片的路径 -->
+                        </div>
+                    </div>
+                    
+                    <p class="text-lg md:text-xl text-slate-600 font-medium mb-8 max-w-2xl mx-auto" style="line-height:1.6;">
+                        Wing-FPGA-XCKU5P-EVB是基于Xilinx Ultrascale+ FPGA家族的FPGA开发板，适用于隼瞻各系列内核的评估。
+                    </p>
+                    <div class="w-24 h-1 bg-primary mx-auto" style="background-color:var(--primary); height:4px;"></div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 1. 应用场景 -->
+        <section id="applications" class="section-content py-16 relative z-10" >
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">应用场景</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
+                        Wing-M130处理器IP凭借其高性能、低功耗特性，广泛应用于以下领域
+                    </p>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
+                </div>
+                
+                <!-- 应用场景标签 -->
+                <div class="flex flex-wrap justify-center gap-4 max-w-3xl mx-auto mb-16">
+                    <span class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2">
+                        <i class="fa fa-industry"></i> 工业控制
+                    </span>
+                    <span class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2" style="transition-delay: 0.1s">
+                        <i class="fa fa-connectdevelop"></i> 物联网
+                    </span>
+                </div>
+                
+                <!-- 详细应用场景描述 -->
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-tachometer text-blue-600 text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">性能展示</h4>
+                                <p class="text-slate-600 font-medium">
+                                    通过多种基准测试，评估wing-A内核在不同工作负载下的计算性能和吞吐量。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-microchip text-blue-600 text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">内核评估</h4>
+                                <p class="text-slate-600 font-medium">
+                                    评估FPGA逻辑单元、存储器和DSP资源的使用情况，优化内核设计。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 2. 技术亮点 -->
+        <section id="features" class="section-content py-16 relative z-10" >
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">技术亮点</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
+                </div>
+
+                <div class="space-y-6 max-w-4xl mx-auto">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">丰富的片内资源，可支持wing-A系列内核运行Linux</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">丰富的外设资源，可适应各种评估场景</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">紧凑，小巧的外观</h4>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 1. 产品参数 -->
+        <section id="specifications" class="section-content py-16 relative z-10" >
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品参数</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
+                        Wing-M050 Processor IP的详细技术参数，为您提供全面的产品信息
+                    </p>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
+                </div>
+
+                <div class="relative z-10er rounded-xl shadow-md p-8 animate-fade-in">
+                    <div class="grid md:grid-cols-3 gap-6">
+                        <div class="space-y-4">
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">FPGA</span>
+                                <span class="font-medium text-slate-800">Xilinx XCKU5P</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">UART</span>
+                                <span class="font-medium text-slate-800">Yes</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">SD/MMC</span>
+                                <span class="font-medium text-slate-800">Yes</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Key</span>
+                                <span class="font-medium text-slate-800">4</span>
+                            </div>
+                            <div class="flex justify-between">
+                                <span class="text-slate-500 font-bold">LED</span>
+                                <span class="font-medium text-slate-800">2</span>
+                            </div>
+                        </div>
+                        <div class="space-y-4">
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Switch</span>
+                                <span class="font-medium text-slate-800">4</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">HDMI</span>
+                                <span class="font-medium text-slate-800">Yes, HDMI 1.4</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Ethernet</span>
+                                <span class="font-medium text-slate-800">Yes, 1Gb ethernet</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">USB</span>
+                                <span class="font-medium text-slate-800">Yes, Host or Slave</span>
+                            </div>
+                            <div class="flex justify-between">
+                                <span class="text-slate-500 font-bold">DDR</span>
+                                <span class="font-medium text-slate-800">Yes, DDR4 2GB</span>
+                            </div>
+                        </div>
+                        <div class="space-y-4">
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">HyperRAM</span>
+                                <span class="font-medium text-slate-800">Yes, 32MB</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">QSPI Flash</span>
+                                <span class="font-medium text-slate-800">Yes</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">LCD</span>
+                                <span class="font-medium text-slate-800">Yes, 800x480 with touch</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Audio</span>
+                                <span class="font-medium text-slate-800">Yes, I2S codec</span>
+                            </div>
+                            <div class="flex justify-between">
+                                <span class="text-slate-500 font-bold">PMOD</span>
+                                <span class="font-medium text-slate-800">Yes, 2x 3.3V, 1x 1.8V</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <section class="py-16 relative z-10 overflow-hidden">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-3xl mx-auto text-center">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800">开启FPGA创新之旅</h2>
+                    <p class="text-xl text-slate-600 font-medium mb-10">
+                        无论您是进行原型验证、产品开发还是寻求高性能计算解决方案，FPGA都能为您的项目提供灵活、高效的硬件支持。
+                    </p>
+                </div>
+            </div>
+        </section> 
+    </div> <!-- end #sj-product-page -->
+    
+    <!-- 咨询按钮 -->
+    <div class="fixed bottom-12 right-12 z-50 popupbox">
+        <button id="consult-button" class="bg-blue-600 hover:bg-blue-700 text-white py-5 px-8 rounded-full shadow-xl transform transition-all duration-300 hover:scale-110 flex items-center gap-3 text-lg">
+            <i class="fa fa-comments-o text-2xl"></i>
+            <span class="font-bold">立刻咨询</span>
+        </button>
+    </div>
+
+    <!-- JavaScript - 仅保留滚动动画，移除标签页切换功能 -->
+    <script>
+        // 滚动动画 - scoped to the animate-fade-in elements inside #sj-product-page
+        document.addEventListener('DOMContentLoaded', function() {
+            const root = document.getElementById('sj-product-page');
+            if (!root) return;
+
+            const animateElements = root.querySelectorAll('.animate-fade-in');
+
+            function checkScroll() {
+                animateElements.forEach(element => {
+                    const elementTop = element.getBoundingClientRect().top;
+                    const elementVisible = 150;
+                    if (elementTop < window.innerHeight - elementVisible) {
+                        element.classList.add('visible');
+                    }
+                });
+            }
+
+            // initial check
+            checkScroll();
+            // add listener
+            window.addEventListener('scroll', checkScroll, { passive: true });
+            // also on resize/orientation change to catch changes
+            window.addEventListener('resize', checkScroll);
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/Wing-A500.html b/Wing-A500.html
index b5c3e59..70f61f8 100644
--- a/Wing-A500.html
+++ b/Wing-A500.html
@@ -6,57 +6,85 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>产品详情 - 隼瞻科技</title>
 
+    <!-- Tailwind (kept, may be used for layout utilities) -->
     <script src="https://cdn.tailwindcss.com"></script>
+
+    <!-- Font Awesome & Font -->
     <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
-    <script>
-        tailwind.config = {
-            theme: {
-                extend: {
-                    colors: { primary: '#3b82f6', secondary: '#2563eb', accent: '#60a5fa' },
-                    fontFamily: { inter: ['Inter', 'sans-serif'] }
-                }
-            }
-        }
-    </script>
+    <!-- Main styles -->
     <style type="text/tailwindcss">
         @layer utilities {
             .glass-panel {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
-                backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
+                backdrop-filter: blur(16px);
+                -webkit-backdrop-filter: blur(16px);
                 border: 1px solid rgba(255, 255, 255, 0.9);
                 box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
             }
             .glass-panel-light {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
-                backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
                 border: 1px solid rgba(255, 255, 255, 1);
                 box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
             }
-            .text-gradient {
+            .gradient-text {
                 background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
-                -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
+                -webkit-background-clip: text;
+                -webkit-text-fill-color: transparent;
+                background-clip: text;
+            }
+            .text-shadow {
+                text-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+            }
+            .product-feature-card {
+                transition: all 0.3s ease;
+            }
+            .product-feature-card:hover {
+                transform: translateY(-5px);
+            }
+            .section-active {
+                color: #2563eb !important;
+                border-bottom: 2px solid #2563eb !important;
+            }
+            .animate-fade-in {
+                opacity: 0;
+                transform: translateY(20px);
+                transition: opacity 0.6s ease-out, transform 0.6s ease-out;
+            }
+            .animate-fade-in.visible {
+                opacity: 1;
+                transform: translateY(0);
+            }
+            .hover-float {
+                transition: transform 0.3s ease, box-shadow 0.3s ease;
+            }
+            .hover-float:hover {
+                transform: translateY(-5px);
             }
         }
-        
-        #sj-product-page { font-family: 'Inter', sans-serif; color: #1e293b; background-color: transparent !important; }
-        #sj-product-page a { color: #3b82f6; transition: color 0.3s ease; }
-        #sj-product-page a:hover { color: #2563eb; }
-        .section-active { color: #2563eb !important; border-bottom: 2px solid #2563eb !important; }
-        .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
-        .hover-float:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1); }
-        .animate-fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
-        .animate-fade-in.visible { opacity: 1; transform: translateY(0); }
-        
-        .bg-grid {
-            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233b82f6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
-        }
     </style>
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#3b82f6',
+                        secondary: '#2563eb',
+                        accent: '#60a5fa',
+                    },
+                    fontFamily: {
+                        inter: ['Inter', 'sans-serif'],
+                    },
+                },
+            }
+        }
+    </script>
 </head>
 
-<body class="bg-slate-50 text-slate-800 font-inter antialiased overflow-x-hidden w-full">
-
+<body class="bg-slate-50 text-slate-800 font-inter antialiased">
     <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
     <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
         <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
@@ -66,338 +94,64 @@
     </div>
 
     <!-- Wrapper with an ID so we can scope styles and avoid WP theme interference -->
-    <div id="sj-product-page" class="relative z-10 w-full min-h-screen">
+    <div id="sj-product-page" class="min-h-screen relative z-10">
 
         <!-- 产品页面头部 -->
-        <section class="pt-24 md:pt-32 pb-16 md:pb-24 bg-gradient-to-br gradient-animate"
-            style="background: linear-gradient(135deg, rgba(248,250,252,0.95), rgba(239,246,255,1)); overflow:hidden;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section class="pt-24 md:pt-32 pb-16 md:pb-24 relative overflow-hidden">
+            <div class="absolute top-0 left-1/2 -translate-x-1/2 w-[80%] h-64 bg-primary/10 blur-[120px] rounded-full pointer-events-none"></div>
+            
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto text-center">
-                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-bold text-slate-800 leading-tight text-shadow mb-6">
-                        通用处理器IP
+                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-extrabold text-slate-800 leading-tight drop-shadow-sm mb-6">
+                        核心产品系列
                     </h1>
-                    <div class="bg-primary-20 inline-block px-6 pt-4 rounded-full mb-6 animate-fade-in">
-                        <h2 class="text-xl font-semibold text-primary">Wing-A Series</h2>
+                    <div class="glass-panel-light inline-flex items-center space-x-2 px-6 py-2 rounded-full border border-blue-200 mb-6 shadow-sm animate-fade-in">
+                        <h2 class="text-xl font-bold text-blue-700">Wing-A Series</h2>
                     </div>
-                    <h3 class="text-2xl md:text-3xl font-bold text-slate-800 mb-8">面向高能效应用的多核RISC-V应用处理器：</br>Wing-A500</h3>
-                    <p class="text-lg md:text-xl text-slate-600 mb-8 max-w-2xl mx-auto" style="line-height:1.6;">
-                        Wing-A500 是一款基于开源 RISC-V 架构打造的 64 位、双发射、9
-                        级流水处理器，其在架构设计、性能表现以及功能特性上的卓越表现，使其成为高能效应用处理器领域的佼佼者。同时，Wing-A500兼容 RVA23 规范，确保了与现有 RISC-V
-                        生态系统的良好兼容性，便于开发者快速集成和开发应用。产品适用于人工智能、具身智能、自动驾驶、5G/6G网络通讯、安全等领域。
+                    <h3 class="text-2xl md:text-3xl font-extrabold text-slate-800 mb-8 gradient-text inline-block">面向高能效应用的多核RISC-V应用处理器：<br/>Wing-A500</h3>
+
+                    <p class="text-lg md:text-xl text-slate-600 font-medium mb-8 max-w-2xl mx-auto leading-relaxed">
+                        Wing-A500 是一款基于开源 RISC-V 架构打造的 64 位、双发射、9 级流水处理器，其在架构设计、性能表现以及功能特性上的卓越表现，使其成为高能效应用处理器领域的佼佼者。同时，Wing-A500兼容 RVA23 规范，确保了与现有 RISC-V 生态系统的良好兼容性，便于开发者快速集成和开发应用。产品适用于人工智能、具身智能、自动驾驶、5G/6G网络通讯、安全等领域。
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto" style="background-color:var(--primary); height:4px;"></div>
-                </div>
-            </div>
-        </section>
-
-        <!-- 1. 架构 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
-                <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">架构</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
-                </div>
-
-                <!-- 架构大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
-                    <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
-                        <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-A500 处理器IP架构</h3>
-                    </div>
-                    <div class="p-4">
-                        <img src="https://www.beiyuxing.live/wp-content/uploads/2026/04/20260407-1705381.png"
-                            alt="Wing-A500 Processor IP架构图" class="w-full h-auto rounded-lg" />
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- 2. 产品参数 -->
-        <section id="specifications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
-                <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品参数</h2>
-                    <p class="text-slate-600 mb-6 text-center">
-                        Wing-A500 Processor IP的详细技术参数，为您提供全面的产品信息
-                    </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
-                </div>
-
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-2xl font-bold mb-6 text-slate-800">性能基准测试</h3>
-                    <div class="grid md:grid-cols-2 gap-6">
-                        <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">SPECint2006</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">5/GHz</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-xl font-bold mb-6 text-slate-800">功能参数</h3>
-                    <div class="grid md:grid-cols-2 gap-6">
-                        <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">ISA</span>
-                                <span class="font-medium text-slate-800">RV64GCBVK</span>
-                            </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Micro Arch</span>
-                                <span class="font-medium text-slate-800">9-stage, In-order, two-issue</span>
-                            </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">Privilege Mode</span>
-                                <span class="font-medium text-slate-800 text-right">Machine Mode, User Mode, Supervisor Mode
-                                    and
-                                    Hypervisor Extension</span>
-                            </div>
-                        </div>
-                        <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Ext. Interrupts</span>
-                                <span class="font-medium text-slate-800">Support AIA 1.0</span>
-                            </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Debug</span>
-                                <span class="font-medium text-slate-800">JTAG/APB </span>
-                            </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">External Bus</span>
-                                <span class="font-medium text-slate-800">2x AXI/CHI</span>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="mt-3 pt-3 border-t border-gray-100 flex justify-between">
-                        <span class="text-slate-500">Memory System</span>
-                        <span class="font-medium text-slate-800 text-right">I/D Cache(up to 64KB) L2 Cache (up to 2MB) MMU
-                            and optional PMP</span>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- 2. 关键特性 -->
-        <section id="key-features" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
-                <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">关键特性</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
-                </div>
-
-                <div class="grid grid-cols-1 md:grid-cols-3 gap-6 max-w-5xl mx-auto">
-                    <div
-                        class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in flex flex-col items-center text-center">
-                        <div class="w-16 h-16 bg-primary-10 rounded-full flex items-center justify-center mb-4">
-                            <i class="fa fa-file-code-o text-primary text-2xl"></i>
-                        </div>
-                        <h4 class="text-xl font-bold mb-2 text-slate-800">兼容RVA23 Profile规范</h4>
-                    </div>
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in flex flex-col items-center text-center"
-                        style="transition-delay: 0.1s">
-                        <div class="w-16 h-16 bg-primary-10 rounded-full flex items-center justify-center mb-4">
-                            <i class="fa fa-server text-primary text-2xl"></i>
-                        </div>
-                        <h4 class="text-xl font-bold mb-2 text-slate-800">支持Linux和Hypervisor扩展</h4>
-                    </div>
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in flex flex-col items-center text-center"
-                        style="transition-delay: 0.2s">
-                        <div class="w-16 h-16 bg-primary-10 rounded-full flex items-center justify-center mb-4">
-                            <i class="fa fa-sitemap text-primary text-2xl"></i>
-                        </div>
-                        <h4 class="text-xl font-bold mb-2 text-slate-800">支持异构多核平台</h4>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- 3. 产品特点 -->
-        <section id="features" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
-                <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品特点</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
-                </div>
-
-                <div class="space-y-6 max-w-4xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
-                        <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
-                            </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">64位顺序双发射架构的高能效RISC-V处理器</h4>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
-                        <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
-                            </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持丰富的调试机制，满足多样化的程序调试与分析需求</h4>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
-                        <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
-                            </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持运行Linux
-                                    OS，满足虚拟化要求，支持Sv39以及Sv48两种地址翻译模式</h4>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
-                        <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
-                            </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持符合AIA标准要求的中断控制器，支持配置线中断（Wired
-                                    Interrupts）以及消息中断（MSIs)</h4>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
-                        <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
-                            </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持可信执行环境（TEE），支持灵活地管理飞地（enclave）</h4>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
-                        <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
-                            </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持硬件多核一致性，支持多核异构平台，支持共享L3 Cache以及私有L2
-                                    Cache</h4>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.6s">
-                        <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
-                            </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持符合RISC-V Vector
-                                    1.0标准的矢量计算单元，可根据应用需求灵活配置矢量宽度</h4>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
-                        <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
-                            </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">基于ArchitStudio敏捷开发平台的客制化指令集扩展功能</h4>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- 4. 技术优势 -->
-        <section id="advantages" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
-                <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">技术优势</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
-                </div>
-
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
-                        <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-bolt text-primary text-xl"></i>
-                            </div>
-                            <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">高能效</h4>
-                                <p class="text-slate-600">
-                                    采用深度优化的顺序执行微架构与能效感知设计，在同等工艺下实现卓越的能效比，适用于从边缘计算到智能终端的广泛场景。
-                                </p>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
-                        <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-cogs text-primary text-xl"></i>
-                            </div>
-                            <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">高可配置性</h4>
-                                <p class="text-slate-600">
-                                    支持模块化扩展与本土化定制，结合RISC-V开放生态，为国产化系统提供安全可控、可持续演进的核心算力支撑。
-                                </p>
-                            </div>
-                        </div>
-                    </div>
                 </div>
             </div>
         </section>
 
         <!-- 1. 应用场景 -->
-        <section id="applications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+        <section id="applications" class="section-content py-16 relative z-10" >
             <div class="container mx-auto px-4 md:px-6 lg:px-8">
                 <div class="max-w-4xl mx-auto mb-16">
                     <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">应用场景</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-A500处理器IP凭借其高性能、低功耗特性，广泛应用于以下领域
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <!-- 应用场景标签 -->
                 <div class="flex flex-wrap justify-center gap-4 max-w-3xl mx-auto mb-16">
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2">
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2">
                         <i class="fa fa-cogs"></i> 人工智能
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
                         style="transition-delay: 0.1s">
                         <i class="fa fa-android"></i> 具身智能
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
                         style="transition-delay: 0.2s">
                         <i class="fa fa-car"></i> 自动驾驶
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
                         style="transition-delay: 0.3s">
                         <i class="fa fa-wifi"></i> 5G/6G网络通讯
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
                         style="transition-delay: 0.4s">
                         <i class="fa fa-shield"></i> 安全
                     </span>
@@ -405,70 +159,70 @@
 
                 <!-- 详细应用场景描述 -->
                 <div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-cogs text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-cogs text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">人工智能</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     提供强大的计算能力支持复杂的AI模型训练和推理，加速深度学习算法在边缘设备上的部署，满足AI应用对高性能和低延迟的需求。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-android text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-android text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">具身智能</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     为机器人和智能设备提供高效的感知-决策-执行能力，支持多模态数据处理和实时控制，赋能智能体在复杂环境中的自主行为。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-car text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-car text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">自动驾驶</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     支持复杂的环境感知和决策算法，提供实时处理能力和高可靠性，满足自动驾驶系统对计算性能和安全冗余的严格要求。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-wifi text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-wifi text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">5G/6G网络通讯</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     支持高速网络协议处理和数据传输，满足新一代通信技术对低延迟、高带宽和可靠连接的要求，为网络设备提供强大的计算支持。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-shield text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-shield text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">安全</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     提供可信执行环境和安全加密功能，保障敏感数据和关键应用的安全运行，满足对数据保护和系统安全的严格要求。
                                 </p>
                             </div>
@@ -478,24 +232,233 @@
             </div>
         </section>
 
+        <!-- 2. 关键特性 -->
+        <section id="key-features" class="section-content py-16 relative z-10" >
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">关键特性</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
+                    </div>
+                </div>
+
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-6 max-w-5xl mx-auto">
+                    <div
+                        class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in flex flex-col items-center text-center">
+                        <div class="w-16 h-16 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mb-4">
+                            <i class="fa fa-file-code-o text-blue-600 text-2xl"></i>
+                        </div>
+                        <h4 class="text-xl font-bold mb-2 text-slate-800">兼容RVA23 Profile规范</h4>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in flex flex-col items-center text-center"
+                        style="transition-delay: 0.1s">
+                        <div class="w-16 h-16 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mb-4">
+                            <i class="fa fa-server text-blue-600 text-2xl"></i>
+                        </div>
+                        <h4 class="text-xl font-bold mb-2 text-slate-800">支持Linux和Hypervisor扩展</h4>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in flex flex-col items-center text-center"
+                        style="transition-delay: 0.2s">
+                        <div class="w-16 h-16 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mb-4">
+                            <i class="fa fa-sitemap text-blue-600 text-2xl"></i>
+                        </div>
+                        <h4 class="text-xl font-bold mb-2 text-slate-800">支持异构多核平台</h4>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 3. 产品规格 -->
+        <section id="features" class="section-content py-16 relative z-10" >
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品规格</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
+                    </div>
+                </div>
+
+                <div class="space-y-6 max-w-4xl mx-auto">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">64位顺序双发射架构的高能效RISC-V处理器</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">支持丰富的调试机制，满足多样化的程序调试与分析需求</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">支持运行Linux
+                                    OS，满足虚拟化要求，支持Sv39以及Sv48两种地址翻译模式</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">基于ArchitStudio敏捷开发平台的客制化指令集扩展功能</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">支持可信执行环境（TEE），支持灵活地管理飞地（enclave）</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">支持硬件多核一致性，支持多核异构平台，支持共享L3 Cache以及私有L2
+                                    Cache</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.6s">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">支持符合RISC-V Vector
+                                    1.0标准的矢量计算单元，可根据应用需求灵活配置矢量宽度</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                        <div class="flex items-start">
+                            <div class="mt-1 bg-blue-100 border border-blue-200 p-2 rounded-lg">
+                                <i class="fa fa-check text-blue-600"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold mb-2 text-slate-800 mt-3">支持符合AIA标准要求的中断控制器，支持配置线中断（Wired
+                                    Interrupts）以及消息中断（MSIs)</h4>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 4. 技术优势 -->
+        <section id="advantages" class="section-content py-16 relative z-10" >
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">技术优势</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
+                    </div>
+                </div>
+
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-bolt text-blue-600 text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">高能效</h4>
+                                <p class="text-slate-600 font-medium">
+                                    采用深度优化的顺序执行微架构与能效感知设计，在同等工艺下实现卓越的能效比，适用于从边缘计算到智能终端的广泛场景。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-cogs text-blue-600 text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">高可配置性</h4>
+                                <p class="text-slate-600 font-medium">
+                                    支持模块化扩展与本土化定制，结合RISC-V开放生态，为国产化系统提供安全可控、可持续演进的核心算力支撑。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 4. 架构 -->
+        <section id="architecture" class="section-content py-16 relative z-10" >
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">架构</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
+                        Wing-A500 Processor IP的详细技术参数，为您提供全面的产品信息
+                    </p>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
+                    </div>
+                </div>
+
+                <!-- 架构大图 -->
+                <div class="max-w-4xl mx-auto relative z-10er rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6"
+                        >
+                        <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-A500 处理器IP架构</h3>
+                    </div>
+                    <div class="p-4">
+                        <img src="http://10.2.3.14/wp-content/uploads/2026/04/20260407-1705381.png"
+                            alt="Wing-A500 Processor IP架构图" class="w-full h-auto rounded-lg" />
+                    </div>
+                </div>
+            </div>
+        </section>
+
         <!-- 5. 交付包 -->
-        <section id="documentation" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+        <section id="documentation" class="section-content py-16 relative z-10" >
             <div class="container mx-auto px-4 md:px-6 lg:px-8">
                 <div class="max-w-4xl mx-auto mb-16">
                     <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">交付包</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         隼瞻科技提供全面的技术文档，帮助客户快速了解和使用我们的产品
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
                     <div
-                        class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
+                        class="relative z-10er rounded-xl border border-white shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-microchip text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-lg flex items-center justify-center mb-4">
+                                <i class="fa fa-microchip text-blue-600 text-xl"></i>
                             </div>
                             <h4 class="text-xl font-bold mb-3 text-slate-800">HDK</h4>
                             <ul class="space-y-3 mb-6">
@@ -523,11 +486,11 @@
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
+                    <div class="relative z-10er rounded-xl border border-white shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
                         style="transition-delay: 0.2s">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-sitemap text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-lg flex items-center justify-center mb-4">
+                                <i class="fa fa-sitemap text-blue-600 text-xl"></i>
                             </div>
                             <h4 class="text-xl font-bold mb-3 text-slate-800">SDK</h4>
                             <ul class="space-y-3 mb-6">
@@ -555,11 +518,11 @@
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
+                    <div class="relative z-10er rounded-xl border border-white shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
                         style="transition-delay: 0.4s">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-code text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-lg flex items-center justify-center mb-4">
+                                <i class="fa fa-code text-blue-600 text-xl"></i>
                             </div>
                             <h4 class="text-xl font-bold mb-3 text-slate-800">文档</h4>
                             <ul class="space-y-3 mb-6">
@@ -589,7 +552,7 @@
         <button id="consult-button"
             class="bg-primary hover:bg-primary/90 text-slate-800 py-5 px-8 rounded-full shadow-xl transform transition-all duration-300 hover:scale-110 flex items-center gap-3 text-lg">
             <i class="fa fa-comments-o text-2xl"></i>
-            <span class="font-bold">立刻咨询</span>
+            <span >立刻咨询</span>
         </button>
     </div>
 
diff --git a/Wing-M050.html b/Wing-M050.html
index 35bd072..d0e1ca4 100644
--- a/Wing-M050.html
+++ b/Wing-M050.html
@@ -6,57 +6,87 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>产品详情 - 隼瞻科技</title>
 
+    <!-- Tailwind (kept, may be used for layout utilities) -->
     <script src="https://cdn.tailwindcss.com"></script>
+
+    <!-- Font Awesome & Font -->
     <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
-    <script>
-        tailwind.config = {
-            theme: {
-                extend: {
-                    colors: { primary: '#3b82f6', secondary: '#2563eb', accent: '#60a5fa' },
-                    fontFamily: { inter: ['Inter', 'sans-serif'] }
-                }
-            }
-        }
-    </script>
     <style type="text/tailwindcss">
         @layer utilities {
             .glass-panel {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
-                backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
+                backdrop-filter: blur(16px);
+                -webkit-backdrop-filter: blur(16px);
                 border: 1px solid rgba(255, 255, 255, 0.9);
                 box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
             }
             .glass-panel-light {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
-                backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
                 border: 1px solid rgba(255, 255, 255, 1);
                 box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
             }
-            .text-gradient {
+            .gradient-text {
                 background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
-                -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
+                -webkit-background-clip: text;
+                -webkit-text-fill-color: transparent;
+                background-clip: text;
+            }
+            .text-shadow {
+                text-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+            }
+            .product-feature-card {
+                transition: all 0.3s ease;
+            }
+            .product-feature-card:hover {
+                transform: translateY(-5px);
+            }
+            .section-active {
+                color: #2563eb !important;
+                border-bottom: 2px solid #2563eb !important;
+            }
+            .animate-fade-in {
+                opacity: 0;
+                transform: translateY(20px);
+                transition: opacity 0.6s ease-out, transform 0.6s ease-out;
+            }
+            .animate-fade-in.visible {
+                opacity: 1;
+                transform: translateY(0);
+            }
+            .hover-float {
+                transition: transform 0.3s ease, box-shadow 0.3s ease;
+            }
+            .hover-float:hover {
+                transform: translateY(-5px);
+            }
+            .bg-grid {
+                background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%239C92AC' fill-opacity='0.15'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
             }
         }
-        
-        #sj-product-page { font-family: 'Inter', sans-serif; color: #1e293b; background-color: transparent !important; }
-        #sj-product-page a { color: #3b82f6; transition: color 0.3s ease; }
-        #sj-product-page a:hover { color: #2563eb; }
-        .section-active { color: #2563eb !important; border-bottom: 2px solid #2563eb !important; }
-        .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
-        .hover-float:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1); }
-        .animate-fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
-        .animate-fade-in.visible { opacity: 1; transform: translateY(0); }
-        
-        .bg-grid {
-            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233b82f6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
-        }
     </style>
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#3b82f6',
+                        secondary: '#2563eb',
+                        accent: '#60a5fa',
+                    },
+                    fontFamily: {
+                        inter: ['Inter', 'sans-serif'],
+                    },
+                },
+            }
+        }
+    </script>
 </head>
 
-<body class="bg-slate-50 text-slate-800 font-inter antialiased overflow-x-hidden w-full">
-
+<body class="bg-slate-50 text-slate-800 font-inter antialiased">
     <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
     <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
         <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
@@ -66,110 +96,113 @@
     </div>
 
     <!-- Wrapper with an ID so we can scope styles and avoid WP theme interference -->
-    <div id="sj-product-page" class="relative z-10 w-full min-h-screen">
+    <div id="sj-product-page" class="min-h-screen relative z-10">
 
         <!-- 产品页面头部 -->
-        <section class="pt-24 md:pt-32 pb-16 md:pb-24 bg-gradient-to-br gradient-animate"
-            style="background: linear-gradient(135deg, rgba(248,250,252,0.95), rgba(239,246,255,1)); overflow:hidden;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section class="pt-24 md:pt-32 pb-16 md:pb-24 relative overflow-hidden">
+            <div class="absolute top-0 left-1/2 -translate-x-1/2 w-[80%] h-64 bg-primary/10 blur-[120px] rounded-full pointer-events-none"></div>
+            
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto text-center">
-                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-bold text-slate-800 leading-tight text-shadow mb-6">
+                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-extrabold text-slate-800 leading-tight drop-shadow-sm mb-6">
                         通用处理器IP
                     </h1>
-                    <div class="bg-primary-20 inline-block px-6 pt-4 rounded-full mb-6 animate-fade-in">
-                        <h2 class="text-xl font-semibold text-primary">Wing-M Series</h2>
+                    <div class="glass-panel-light inline-flex items-center space-x-2 px-6 py-2 rounded-full border border-blue-200 mb-6 shadow-sm animate-fade-in">
+                        <h2 class="text-xl font-bold text-blue-700">Wing-M Series</h2>
                     </div>
-                    <h3 class="text-2xl md:text-3xl font-bold text-slate-800 mb-8">Wing-M050 Processor IP</h3>
-                    <p class="text-lg md:text-xl text-slate-600 mb-8 max-w-2xl mx-auto" style="line-height:1.6;">
+                    <h3 class="text-2xl md:text-3xl font-extrabold text-slate-800 mb-8 gradient-text inline-block">Wing-M050 Processor IP</h3>
+                    <p class="text-lg md:text-xl text-slate-600 font-medium mb-8 max-w-2xl mx-auto leading-relaxed">
                         Wing-M050 是基于RISC-V架构的32位、单发射、2级流水的处理器，适用于极低功耗和极小面积的嵌入式应用
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto" style="background-color:var(--primary); height:4px;"></div>
                 </div>
             </div>
         </section>
 
         <!-- 1. 架构 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="architecture" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">架构</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">架构</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <!-- 架构大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
-                    <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
-                        <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-M050 处理器IP架构</h3>
+                <div class="max-w-4xl mx-auto glass-panel rounded-3xl shadow-md border border-white hover:shadow-lg transition-shadow overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6 bg-slate-50 border-b border-slate-200">
+                        <h3 class="text-2xl font-extrabold text-slate-800 text-center">Wing-M050 处理器IP架构</h3>
                     </div>
-                    <div class="p-4">
+                    <div class="p-4 bg-white/50 backdrop-blur-sm">
                         <img src="https://www.beiyuxing.live/wp-content/uploads/2025/10/whiteboard_exported_image-7.png"
-                            alt="Wing-M050 Processor IP架构图" class="w-full h-auto rounded-lg" />
+                            alt="Wing-M050 Processor IP架构图" class="w-full h-auto rounded-2xl" />
                     </div>
                 </div>
             </div>
         </section>
 
         <!-- 2. 产品参数 -->
-        <section id="specifications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="specifications" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品参数</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">产品参数</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M050 Processor IP的详细技术参数，为您提供全面的产品信息
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-2xl font-bold mb-6 text-slate-800">性能基准测试</h3>
+                <div class="glass-panel-light border border-white rounded-3xl shadow-sm p-8 animate-fade-in hover:shadow-md transition-shadow mb-8">
+                    <h3 class="text-2xl font-extrabold mb-6 text-slate-800 flex items-center">
+                        <div class="w-2 h-6 bg-blue-500 rounded-full mr-3"></div> 性能基准测试
+                    </h3>
                     <div class="grid md:grid-cols-2 gap-6">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">Dhrystone</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">0.95 (legal)</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200">
+                                <span class="text-slate-500 font-bold text-xl">Dhrystone</span>
+                                <span class="font-extrabold text-2xl text-emerald-500">0.95 (legal)</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">Coremark</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">2.52</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200">
+                                <span class="text-slate-500 font-bold text-xl">Coremark</span>
+                                <span class="font-extrabold text-2xl text-emerald-500">2.52</span>
                             </div>
                         </div>
                     </div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-xl font-bold mb-6 text-slate-800">功能参数</h3>
+                <div class="glass-panel-light border border-white rounded-3xl shadow-sm p-8 animate-fade-in hover:shadow-md transition-shadow">
+                    <h3 class="text-xl font-extrabold mb-6 text-slate-800 flex items-center">
+                         <div class="w-2 h-6 bg-sky-500 rounded-full mr-3"></div> 功能参数
+                    </h3>
                     <div class="grid md:grid-cols-2 gap-6">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">ISA</span>
-                                <span class="font-medium text-slate-800">RV32E(M)B_zce_zicond_xwingc</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">ISA</span>
+                                <span class="font-bold text-slate-700">RV32E(M)B_zce_xwingc</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Micro Arch</span>
-                                <span class="font-medium text-slate-800">2-stage,In-order one-issue</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Micro Arch</span>
+                                <span class="font-bold text-slate-700">2-stage,In-order</span>
                             </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">Privilege Mode</span>
-                                <span class="font-medium text-slate-800">Machine Mode, User Mode (optional)</span>
+                            <div class="flex justify-between pb-1 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Privilege Mode</span>
+                                <span class="font-bold text-slate-700 text-right">Machine Mode, User Mode</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Ext. Interrupts</span>
-                                <span class="font-medium text-slate-800">Yes (Optional)</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Ext. Interrupts</span>
+                                <span class="font-bold text-slate-700">Yes (Optional)</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Debug</span>
-                                <span class="font-medium text-slate-800">cJTAG/JTAG</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Debug</span>
+                                <span class="font-bold text-slate-700">cJTAG/JTAG</span>
                             </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">External Bus</span>
-                                <span class="font-medium text-slate-800">AHB</span>
+                            <div class="flex justify-between pb-1 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">External Bus</span>
+                                <span class="font-bold text-slate-700">AHB</span>
                             </div>
                         </div>
                     </div>
@@ -178,94 +211,92 @@
         </section>
 
         <!-- 3. 产品特点 -->
-        <section id="features" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="features" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品特点</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">产品特点</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <div class="space-y-6 max-w-4xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">
+                                <h4 class="text-xl font-extrabold text-slate-800">
                                     支持RV32E（M）B_zce_zicond_xwingc指令集</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.1s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持多样化的在线/离线调试手段，可快速定位并解决故障</h4>
+                                <h4 class="text-xl font-extrabold text-slate-800">支持多样化的在线/离线调试手段，可快速定位并解决故障</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.2s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">
+                                <h4 class="text-xl font-extrabold text-slate-800">
                                     支持基于处理器自动化设计平台扩展领域专用指令集，可快速迭代专用处理器解决方案</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.3s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研中断实时性增强技术，提供优异的中断切换效率和中断处理实时性
+                                <h4 class="text-xl font-extrabold text-slate-800">支持隼瞻科技自研中断实时性增强技术，提供优异的中断切换效率和中断处理实时性
                                 </h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.4s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研代码压缩技术，直击RISC-V基础架构代码膨胀问题
+                                <h4 class="text-xl font-extrabold text-slate-800">支持隼瞻科技自研代码压缩技术，直击RISC-V基础架构代码膨胀问题
                                 </h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.5s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">拥有超低功耗与极小面积，实现极优面效比与能效比</h4>
+                                <h4 class="text-xl font-extrabold text-slate-800">拥有超低功耗与极小面积，实现极优面效比与能效比</h4>
                             </div>
                         </div>
                     </div>
 
-
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.7s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">满足车规ISO26262 ASIL-D要求</h4>
+                                <h4 class="text-xl font-extrabold text-slate-800">满足车规ISO26262 ASIL-D要求</h4>
                             </div>
                         </div>
                     </div>
@@ -274,35 +305,35 @@
         </section>
 
         <!-- 4. 应用场景 -->
-        <section id="applications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="applications" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">应用场景</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">应用场景</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M050处理器IP凭借其高性能、低功耗特性，广泛应用于以下领域
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <!-- 应用场景标签 -->
                 <div class="flex flex-wrap justify-center gap-4 max-w-3xl mx-auto mb-16">
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2">
+                        class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors">
                         <i class="fa fa-wifi"></i> IoT
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors"
                         style="transition-delay: 0.1s">
                         <i class="fa fa-connectdevelop"></i> 物联网
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors"
                         style="transition-delay: 0.2s">
                         <i class="fa fa-mobile"></i> 消费电子
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors"
                         style="transition-delay: 0.3s">
                         <i class="fa fa-microchip"></i> 系统伴核
                     </span>
@@ -310,56 +341,56 @@
 
                 <!-- 详细应用场景描述 -->
                 <div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm animate-fade-in hover:shadow-md transition-shadow group">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-wifi text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-full flex items-center justify-center mr-4 group-hover:scale-110 transition-transform">
+                                <i class="fa fa-wifi text-blue-600 text-xl"></i>
                             </div>
                             <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">IoT设备</h4>
-                                <p class="text-slate-600">
+                                <h4 class="text-xl font-extrabold mb-2 text-slate-800">IoT设备</h4>
+                                <p class="text-slate-600 font-medium">
                                     为各类物联网终端提供高效可靠的计算能力，支持传感器数据采集、处理和传输，满足智能物联网设备的低功耗需求。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm animate-fade-in hover:shadow-md transition-shadow group" style="transition-delay: 0.1s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-connectdevelop text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-full flex items-center justify-center mr-4 group-hover:scale-110 transition-transform">
+                                <i class="fa fa-connectdevelop text-blue-600 text-xl"></i>
                             </div>
                             <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">物联网网关</h4>
-                                <p class="text-slate-600">
+                                <h4 class="text-xl font-extrabold mb-2 text-slate-800">物联网网关</h4>
+                                <p class="text-slate-600 font-medium">
                                     作为物联网网关的核心处理单元，负责设备管理、协议转换和数据分析，确保物联网系统的高效稳定运行。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm animate-fade-in hover:shadow-md transition-shadow group" style="transition-delay: 0.2s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-mobile text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-full flex items-center justify-center mr-4 group-hover:scale-110 transition-transform">
+                                <i class="fa fa-mobile text-blue-600 text-xl"></i>
                             </div>
                             <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">消费电子</h4>
-                                <p class="text-slate-600">
+                                <h4 class="text-xl font-extrabold mb-2 text-slate-800">消费电子</h4>
+                                <p class="text-slate-600 font-medium">
                                     广泛应用于智能家电、可穿戴设备、智能音箱等消费电子产品，提供卓越的用户体验和电池续航能力。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm animate-fade-in hover:shadow-md transition-shadow group" style="transition-delay: 0.3s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-microchip text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-full flex items-center justify-center mr-4 group-hover:scale-110 transition-transform">
+                                <i class="fa fa-microchip text-blue-600 text-xl"></i>
                             </div>
                             <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">系统伴核</h4>
-                                <p class="text-slate-600">
+                                <h4 class="text-xl font-extrabold mb-2 text-slate-800">系统伴核</h4>
+                                <p class="text-slate-600 font-medium">
                                     作为主处理器的辅助核心，负责系统管理、电源控制、安全监控等任务，提升整个系统的性能和可靠性。
                                 </p>
                             </div>
@@ -370,26 +401,26 @@
         </section>
 
         <!-- 5. 交付包 -->
-        <section id="documentation" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="documentation" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">交付包</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">交付包</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         隼瞻科技提供全面的技术文档，帮助客户快速了解和使用我们的产品
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
                     <div
-                        class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
+                        class="glass-panel-light border border-white rounded-3xl shadow-sm hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-microchip text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-xl flex items-center justify-center mb-4 shadow-sm">
+                                <i class="fa fa-microchip text-blue-600 text-xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">HDK</h4>
-                            <ul class="space-y-3 mb-6">
+                            <h4 class="text-xl font-extrabold mb-3 text-slate-800">HDK</h4>
+                            <ul class="space-y-3 mb-6 text-slate-600 font-medium">
                                 <li class="flex items-center text-sm">
                                     <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
                                     <span>Wing-M050 RTL代码</span>
@@ -399,7 +430,7 @@
                                     <span>仿真验证环境</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
+                                    <i class="fa fa-file-code-o text-emerald-500 mr-2"></i>
                                     <span>DC综合参考环境</span>
                                 </li>
                                 <li class="flex items-center text-sm">
@@ -407,21 +438,21 @@
                                     <span>Formality形式验证参考环境</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
+                                    <i class="fa fa-file-video-o text-amber-500 mr-2"></i>
                                     <span>FPGA配置文件</span>
                                 </li>
                             </ul>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
+                    <div class="glass-panel-light border border-white rounded-3xl shadow-sm hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
                         style="transition-delay: 0.2s">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-sitemap text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-xl flex items-center justify-center mb-4 shadow-sm">
+                                <i class="fa fa-sitemap text-blue-600 text-xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">SDK</h4>
-                            <ul class="space-y-3 mb-6">
+                            <h4 class="text-xl font-extrabold mb-3 text-slate-800">SDK</h4>
+                            <ul class="space-y-3 mb-6 text-slate-600 font-medium">
                                 <li class="flex items-center text-sm">
                                     <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
                                     <span>Wing IDE</span>
@@ -431,7 +462,7 @@
                                     <span>编译工具链</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
+                                    <i class="fa fa-file-code-o text-emerald-500 mr-2"></i>
                                     <span>调试器</span>
                                 </li>
                                 <li class="flex items-center text-sm">
@@ -439,21 +470,21 @@
                                     <span>BSP</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
+                                    <i class="fa fa-file-video-o text-amber-500 mr-2"></i>
                                     <span>IA/CA 仿真器</span>
                                 </li>
                             </ul>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
+                    <div class="glass-panel-light border border-white rounded-3xl shadow-sm hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
                         style="transition-delay: 0.4s">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-code text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-xl flex items-center justify-center mb-4 shadow-sm">
+                                <i class="fa fa-code text-blue-600 text-xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">文档</h4>
-                            <ul class="space-y-3 mb-6">
+                            <h4 class="text-xl font-extrabold mb-3 text-slate-800">文档</h4>
+                            <ul class="space-y-3 mb-6 text-slate-600 font-medium">
                                 <li class="flex items-center text-sm">
                                     <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
                                     <span>Wing-M050 处理器技术文档</span>
@@ -463,7 +494,7 @@
                                     <span>Wing-M050 处理器集成文档</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
+                                    <i class="fa fa-file-code-o text-emerald-500 mr-2"></i>
                                     <span>Wing-M050 SDK手册</span>
                                 </li>
                             </ul>
@@ -478,9 +509,9 @@
     <!-- 咨询按钮 -->
     <div class="fixed bottom-12 right-12 z-50 popupbox">
         <button id="consult-button"
-            class="bg-primary hover:bg-primary/90 text-slate-800 py-5 px-8 rounded-full shadow-xl transform transition-all duration-300 hover:scale-110 flex items-center gap-3 text-lg">
+            class="bg-blue-600 hover:bg-blue-700 text-white py-5 px-8 rounded-full shadow-lg transform transition-all duration-300 hover:-translate-y-1 hover:shadow-xl flex items-center gap-3 text-lg font-extrabold">
             <i class="fa fa-comments-o text-2xl"></i>
-            <span class="font-bold">立刻咨询</span>
+            <span>立刻咨询</span>
         </button>
     </div>
 
diff --git a/Wing-M050s安全核.html b/Wing-M050s安全核.html
index 1da078f..1bb082a 100644
--- a/Wing-M050s安全核.html
+++ b/Wing-M050s安全核.html
@@ -10,53 +10,78 @@
     <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
-    <script>
-        tailwind.config = {
-            theme: {
-                extend: {
-                    colors: { primary: '#3b82f6', secondary: '#2563eb', accent: '#60a5fa' },
-                    fontFamily: { inter: ['Inter', 'sans-serif'] }
-                }
-            }
-        }
-    </script>
+    <!-- Main styles -->
     <style type="text/tailwindcss">
         @layer utilities {
             .glass-panel {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
-                backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
+                backdrop-filter: blur(16px);
+                -webkit-backdrop-filter: blur(16px);
                 border: 1px solid rgba(255, 255, 255, 0.9);
                 box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
             }
             .glass-panel-light {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
-                backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
                 border: 1px solid rgba(255, 255, 255, 1);
                 box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
             }
-            .text-gradient {
+            .gradient-text {
                 background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
-                -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
+                -webkit-background-clip: text;
+                -webkit-text-fill-color: transparent;
+                background-clip: text;
+            }
+            .text-shadow {
+                text-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+            }
+            .product-feature-card {
+                transition: all 0.3s ease;
+            }
+            .product-feature-card:hover {
+                transform: translateY(-5px);
+            }
+            .section-active {
+                color: #2563eb !important;
+                border-bottom: 2px solid #2563eb !important;
+            }
+            .animate-fade-in {
+                opacity: 0;
+                transform: translateY(20px);
+                transition: opacity 0.6s ease-out, transform 0.6s ease-out;
+            }
+            .animate-fade-in.visible {
+                opacity: 1;
+                transform: translateY(0);
+            }
+            .hover-float {
+                transition: transform 0.3s ease, box-shadow 0.3s ease;
+            }
+            .hover-float:hover {
+                transform: translateY(-5px);
             }
         }
-        
-        #sj-product-page { font-family: 'Inter', sans-serif; color: #1e293b; background-color: transparent !important; }
-        #sj-product-page a { color: #3b82f6; transition: color 0.3s ease; }
-        #sj-product-page a:hover { color: #2563eb; }
-        .section-active { color: #2563eb !important; border-bottom: 2px solid #2563eb !important; }
-        .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
-        .hover-float:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1); }
-        .animate-fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
-        .animate-fade-in.visible { opacity: 1; transform: translateY(0); }
-        
-        .bg-grid {
-            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233b82f6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
-        }
     </style>
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#3b82f6',
+                        secondary: '#2563eb',
+                        accent: '#60a5fa',
+                    },
+                    fontFamily: {
+                        inter: ['Inter', 'sans-serif'],
+                    },
+                },
+            }
+        }
+    </script>
 </head>
 
-<body class="bg-slate-50 text-slate-800 font-inter antialiased overflow-x-hidden w-full">
-
+<body class="bg-slate-50 text-slate-800 font-inter antialiased">
     <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
     <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
         <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
@@ -66,120 +91,127 @@
     </div>
 
     <!-- Wrapper with an ID so we can scope styles and avoid WP theme interference -->
-    <div id="sj-product-page" class="relative z-10 w-full min-h-screen">
+    <div id="sj-product-page" class="min-h-screen relative z-10">
 
         <!-- 产品页面头部 -->
-        <section class="pt-24 md:pt-32 pb-16 md:pb-24 bg-gradient-to-br gradient-animate"
-            style="background: linear-gradient(135deg, rgba(248,250,252,0.95), rgba(239,246,255,1)); overflow:hidden;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section class="pt-24 md:pt-32 pb-16 md:pb-24 relative overflow-hidden">
+            <div class="absolute top-0 left-1/2 -translate-x-1/2 w-[80%] h-64 bg-primary/10 blur-[120px] rounded-full pointer-events-none"></div>
+            
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto text-center">
-                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-bold text-slate-800 leading-tight text-shadow mb-6">
+                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-extrabold text-slate-800 leading-tight drop-shadow-sm mb-6">
                         安全处理器IP
                     </h1>
-                    <div class="bg-primary-20 inline-block px-6 pt-4 rounded-full mb-6 animate-fade-in">
-                        <h2 class="text-xl font-semibold text-primary">Wing-M Series</h2>
+                    <div class="glass-panel-light inline-flex items-center space-x-2 px-6 py-2 rounded-full border border-blue-200 mb-6 shadow-sm animate-fade-in">
+                        <h2 class="text-xl font-bold text-blue-700">Wing-M Series</h2>
                     </div>
-                    <h3 class="text-2xl md:text-3xl font-bold text-slate-800 mb-8">Wing-M050S安全核 Processor IP</h3>
-                    <p class="text-lg md:text-xl text-slate-600 mb-8 max-w-2xl mx-auto" style="line-height:1.6;">
+                    <h3 class="text-2xl md:text-3xl font-extrabold text-slate-800 mb-8 gradient-text inline-block">Wing-M050S Processor IP</h3>
+
+                    <p class="text-lg md:text-xl text-slate-600 font-medium mb-8 max-w-2xl mx-auto leading-relaxed">
                         Wing-M050S是一款专为物理安全、信息安全设计的超低功耗嵌入式RISC-V处理器IP。其兼顾低功耗、高性能、及丰富安全特性，不仅能满足企业对安全性的严格要求，同时能协助芯片厂商快速、低成本地把产品推向市场，为物联网等众多领域发展提供源源不断的安全动力。
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto" style="background-color:var(--primary); height:4px;"></div>
                 </div>
             </div>
         </section>
 
         <!-- 1. 架构 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="architecture" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">架构</h2>
-                    <p class="text-slate-600 mb-6 text-center">
-                    </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">架构</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center"></p>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
                 <!-- 架构大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
-                    <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
-                        <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-M050S 处理器IP架构</h3>
+                <div class="max-w-4xl mx-auto glass-panel rounded-3xl shadow-md border border-white hover:shadow-lg transition-shadow overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6 bg-slate-50 border-b border-slate-200">
+                        <h3 class="text-2xl font-extrabold text-slate-800 text-center">Wing-M050S 处理器IP架构</h3>
                     </div>
-                    <div class="p-4">
+                    <div class="p-4 bg-white/50 backdrop-blur-sm">
                         <img src="https://www.beiyuxing.live/wp-content/uploads/2025/10/whiteboard_exported_image-7.png"
-                            alt="Wing-M050 Processor IP架构图" class="w-full h-auto rounded-lg" />
+                            alt="Wing-M050 Processor IP架构图" class="w-full h-auto rounded-2xl" />
                     </div>
                 </div>
             </div>
         </section>
 
         <!-- 2. 产品参数 -->
-        <section id="specifications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="specifications" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品参数</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">产品参数</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M050S Processor IP的详细技术参数，为您提供全面的产品信息
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-2xl font-bold mb-6 text-slate-800">性能基准测试</h3>
+                <div class="glass-panel-light rounded-3xl shadow-sm border border-white p-8 animate-fade-in hover:shadow-md transition-shadow mb-8">
+                    <h3 class="text-2xl font-extrabold mb-6 text-slate-800 flex items-center gap-3">
+                        <div class="w-10 h-10 bg-blue-100 rounded-lg flex items-center justify-center shrink-0">
+                            <i class="fa fa-tachometer text-blue-600 text-xl"></i>
+                        </div>
+                        性能基准测试
+                    </h3>
                     <div class="grid md:grid-cols-2 gap-6">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">Dhrystone</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">0.95 (legal)</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200">
+                                <span class="text-slate-500 font-bold text-xl">Dhrystone</span>
+                                <span class="font-extrabold text-xl text-blue-600">0.95 (legal)</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">Coremark</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">2.52</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200">
+                                <span class="text-slate-500 font-bold text-xl">Coremark</span>
+                                <span class="font-extrabold text-xl text-blue-600">2.52</span>
                             </div>
                         </div>
                     </div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-xl font-bold mb-6 text-slate-800">功能参数</h3>
-                    <div class="grid md:grid-cols-2 gap-6">
+                <div class="glass-panel-light rounded-3xl shadow-sm border border-white p-8 animate-fade-in hover:shadow-md transition-shadow">
+                    <h3 class="text-xl font-extrabold mb-6 text-slate-800 flex items-center gap-3">
+                        <div class="w-10 h-10 bg-sky-100 rounded-lg flex items-center justify-center shrink-0">
+                            <i class="fa fa-cogs text-sky-600 text-xl"></i>
+                        </div>
+                        功能参数
+                    </h3>
+                    <div class="grid md:grid-cols-2 gap-8">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">基础ISA</span>
-                                <span class="font-medium text-slate-800">RV32EB_zifencei_zicsr_zce_zicond</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-white/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">基础ISA</span>
+                                <span class="font-bold text-slate-700 text-right">RV32EB_zifencei_zicsr_zce_zicond</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">乘除法</span>
-                                <span class="font-medium text-slate-800">可配置M-ext/zmmul</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-white/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">乘除法</span>
+                                <span class="font-bold text-slate-700 text-right">可配置M-ext/zmmul</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Codesize 增强</span>
-                                <span class="font-medium text-slate-800">支持隼瞻自定义代码密度增强</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-white/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Codesize 增强</span>
+                                <span class="font-bold text-slate-700 text-right">支持隼瞻自定义代码密度增强</span>
                             </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">安全特性</span>
-                                <span class="font-medium text-slate-800">寄存器保护:防数据泄露攻击;防功耗攻击:调试接口保护</span>
+                            <div class="flex justify-between hover:bg-white/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">安全特性</span>
+                                <span class="font-bold text-slate-700 text-right w-2/3">寄存器保护:防数据泄露攻击;防功耗攻击:调试接口保护</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">特权模式</span>
-                                <span class="font-medium text-slate-800">支持M-mode和U-mode</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-white/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">特权模式</span>
+                                <span class="font-bold text-slate-700 text-right">支持M-mode和U-mode</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Debug</span>
-                                <span class="font-medium text-slate-800">支持可配置2线或者4线JTAG</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-white/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Debug</span>
+                                <span class="font-bold text-slate-700 text-right">支持可配置2线或者4线JTAG</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">中断</span>
-                                <span class="font-medium text-slate-800">支持矢量中断，支持快速的中断现场切换</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-white/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">中断</span>
+                                <span class="font-bold text-slate-700 text-right">支持矢量中断，支持快速的中断现场切换</span>
                             </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">面积</span>
-                                <span class="font-medium text-slate-800">30k-35k</span>
+                            <div class="flex justify-between hover:bg-white/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">面积</span>
+                                <span class="font-bold text-slate-700 text-right">30k-35k</span>
                             </div>
                         </div>
                     </div>
@@ -188,94 +220,87 @@
         </section>
 
         <!-- 3. 产品特点 -->
-        <section id="features" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="features" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品特点</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">产品特点</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
                 <div class="space-y-6 max-w-4xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">
-                                    支持RV32E（M）B_zce_zicond_xwingc指令集</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持RV32E（M）B_zce_zicond_xwingc指令集</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.1s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持多样化的在线/离线调试手段，可快速定位并解决故障</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持多样化的在线/离线调试手段，可快速定位并解决故障</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.2s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">
-                                    支持基于处理器自动化设计平台扩展领域专用指令集，可快速迭代专用处理器解决方案</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持基于处理器自动化设计平台扩展领域专用指令集，可快速迭代专用处理器解决方案</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.3s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研中断实时性增强技术，提供优异的中断切换效率和中断处理实时性
-                                </h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持隼瞻科技自研中断实时性增强技术，提供优异的中断切换效率和中断处理实时性</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.4s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研代码压缩技术，直击RISC-V基础架构代码膨胀问题
-                                </h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持隼瞻科技自研代码压缩技术，直击RISC-V基础架构代码膨胀问题</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.5s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">拥有超低功耗与极小面积，实现极优面效比与能效比</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">拥有超低功耗与极小面积，实现极优面效比与能效比</h4>
                             </div>
                         </div>
                     </div>
 
-
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.6s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">满足车规ISO26262 ASIL-D要求</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">满足车规ISO26262 ASIL-D要求</h4>
                             </div>
                         </div>
                     </div>
@@ -284,51 +309,37 @@
         </section>
 
         <!-- 4. 应用场景 -->
-        <section id="applications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="applications" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">应用场景</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">应用场景</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M050S处理器IP凭借其高性能、高安全性特性，广泛应用于以下领域
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
                 <!-- 应用场景标签 -->
                 <div class="flex flex-wrap justify-center gap-4 max-w-5xl mx-auto mb-16">
-                    <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2">
+                    <span class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 hover:bg-blue-100 transition-colors shadow-sm cursor-default">
                         <i class="fa fa-car"></i> 汽车电子
                     </span>
-                    <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
-                        style="transition-delay: 0.1s">
+                    <span class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 hover:bg-blue-100 transition-colors shadow-sm cursor-default" style="transition-delay: 0.1s">
                         <i class="fa fa-credit-card"></i> SIM卡
                     </span>
-                    <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
-                        style="transition-delay: 0.2s">
+                    <span class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 hover:bg-blue-100 transition-colors shadow-sm cursor-default" style="transition-delay: 0.2s">
                         <i class="fa fa-shield"></i> 网络安全
                     </span>
-                    <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
-                        style="transition-delay: 0.3s">
+                    <span class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 hover:bg-blue-100 transition-colors shadow-sm cursor-default" style="transition-delay: 0.3s">
                         <i class="fa fa-building"></i> 企业应用
                     </span>
-                    <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
-                        style="transition-delay: 0.4s">
+                    <span class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 hover:bg-blue-100 transition-colors shadow-sm cursor-default" style="transition-delay: 0.4s">
                         <i class="fa fa-exchange"></i> 移动支付
                     </span>
-                    <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
-                        style="transition-delay: 0.5s">
+                    <span class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 hover:bg-blue-100 transition-colors shadow-sm cursor-default" style="transition-delay: 0.5s">
                         <i class="fa fa-music"></i> 多媒体
                     </span>
-                    <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
-                        style="transition-delay: 0.6s">
+                    <span class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 hover:bg-blue-100 transition-colors shadow-sm cursor-default" style="transition-delay: 0.6s">
                         <i class="fa fa-lock"></i> 安全存储
                     </span>
                 </div>
@@ -349,84 +360,84 @@
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.1s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-credit-card text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mr-4 shrink-0 border border-blue-200">
+                                <i class="fa fa-credit-card text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">SIM卡</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 leading-relaxed font-medium">
                                     为SIM卡和eSIM芯片提供极小面积、高安全性的处理核心，支持加密算法加速，保障用户身份认证和通信安全。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.2s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-shield text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mr-4 shrink-0 border border-blue-200">
+                                <i class="fa fa-shield text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">网络安全</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 leading-relaxed font-medium">
                                     作为网络安全设备的安全核心，支持数据加密/解密、防火墙功能和入侵检测，为网络通信提供端到端的安全保障。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.3s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-building text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mr-4 shrink-0 border border-blue-200">
+                                <i class="fa fa-building text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">企业应用</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 leading-relaxed font-medium">
                                     为企业级安全管理系统、密钥管理服务器和访问控制系统提供高可靠的安全处理能力，保护企业核心数据资产。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.4s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-exchange text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mr-4 shrink-0 border border-blue-200">
+                                <i class="fa fa-exchange text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">移动支付</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 leading-relaxed font-medium">
                                     为移动支付终端和安全芯片提供强大的密码学运算能力，支持快速安全的交易处理，防止交易信息泄露和篡改。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.5s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-music text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mr-4 shrink-0 border border-blue-200">
+                                <i class="fa fa-music text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">多媒体</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 leading-relaxed font-medium">
                                     为多媒体设备提供内容保护和版权管理功能，支持DRM加密和媒体数据安全传输，防止数字内容被盗版。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.6s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.6s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-lock text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mr-4 shrink-0 border border-blue-200">
+                                <i class="fa fa-lock text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">安全存储</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 leading-relaxed font-medium">
                                     为安全存储设备提供数据加密和访问控制功能，保护敏感数据不被未授权访问，支持多种加密算法和密钥管理机制。
                                 </p>
                             </div>
@@ -437,129 +448,116 @@
         </section>
 
         <!-- 5. 安全 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="security" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">安全</h2>
-                    <p class="text-slate-600 mb-6 text-center">
-                    </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">安全</h2>
+                    <p class="text-slate-600 mb-6 text-center"></p>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
                 <!-- 安全特性大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
-                    <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
-                        <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-M050S的安全特性</h3>
+                <div class="max-w-4xl mx-auto glass-panel rounded-3xl shadow-md border border-white hover:shadow-lg transition-shadow overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6 bg-slate-50 border-b border-slate-200">
+                        <h3 class="text-2xl font-extrabold text-slate-800 text-center">Wing-M050S的安全特性</h3>
                     </div>
-                    <div class="p-4">
+                    <div class="p-4 bg-white/50 backdrop-blur-sm">
                         <img src="https://www.beiyuxing.live/wp-content/uploads/2025/11/green2.png"
-                            alt="Wing-M050 Processor IP架构图" class="w-full h-auto rounded-lg" />
+                            alt="Wing-M050 Processor IP架构图" class="w-full h-auto rounded-2xl" />
                     </div>
                 </div>
             </div>
         </section>
 
-        <!-- 5. 交付包 -->
-        <section id="documentation" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <!-- 6. 交付包 -->
+        <section id="documentation" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">交付包</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">交付包</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         隼瞻科技提供全面的技术文档，帮助客户快速了解和使用我们的产品
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
                 <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
-                    <div
-                        class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
-                        <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-microchip text-primary text-xl"></i>
-                            </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">HDK</h4>
-                            <ul class="space-y-3 mb-6">
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
-                                    <span>Wing-M050 RTL代码</span>
-                                </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
-                                    <span>仿真验证环境</span>
-                                </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
-                                    <span>DC综合参考环境</span>
-                                </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-image-o text-purple-500 mr-2"></i>
-                                    <span>Formality形式验证参考环境</span>
-                                </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
-                                    <span>FPGA配置文件</span>
-                                </li>
-                            </ul>
+                    <div class="glass-panel-light p-8 rounded-3xl border border-white shadow-sm hover:shadow-xl transition-all duration-300 hover-float animate-fade-in">
+                        <div class="w-14 h-14 bg-gradient-to-br from-blue-100 to-blue-50 rounded-2xl flex items-center justify-center mb-6 shadow-sm border border-blue-100">
+                            <i class="fa fa-microchip text-blue-600 text-2xl"></i>
                         </div>
+                        <h4 class="text-2xl font-extrabold mb-4 text-slate-800">HDK</h4>
+                        <ul class="space-y-4 font-medium">
+                            <li class="flex items-center text-slate-600 hover:text-blue-600 transition-colors">
+                                <i class="fa fa-file-pdf-o text-red-500 mr-3 text-lg"></i>
+                                <span>Wing-M050 RTL代码</span>
+                            </li>
+                            <li class="flex items-center text-slate-600 hover:text-blue-600 transition-colors">
+                                <i class="fa fa-file-text-o text-blue-500 mr-3 text-lg"></i>
+                                <span>仿真验证环境</span>
+                            </li>
+                            <li class="flex items-center text-slate-600 hover:text-blue-600 transition-colors">
+                                <i class="fa fa-file-code-o text-emerald-500 mr-3 text-lg"></i>
+                                <span>DC综合参考环境</span>
+                            </li>
+                            <li class="flex items-center text-slate-600 hover:text-blue-600 transition-colors">
+                                <i class="fa fa-file-image-o text-purple-500 mr-3 text-lg"></i>
+                                <span>Formality形式验证参考环境</span>
+                            </li>
+                            <li class="flex items-center text-slate-600 hover:text-blue-600 transition-colors">
+                                <i class="fa fa-file-video-o text-orange-500 mr-3 text-lg"></i>
+                                <span>FPGA配置文件</span>
+                            </li>
+                        </ul>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
-                        style="transition-delay: 0.2s">
-                        <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-sitemap text-primary text-xl"></i>
-                            </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">SDK</h4>
-                            <ul class="space-y-3 mb-6">
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
-                                    <span>Wing IDE</span>
-                                </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
-                                    <span>编译工具链</span>
-                                </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
-                                    <span>调试器</span>
-                                </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-image-o text-purple-500 mr-2"></i>
-                                    <span>BSP</span>
-                                </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
-                                    <span>IA/CA 仿真器</span>
-                                </li>
-                            </ul>
+                    <div class="glass-panel-light p-8 rounded-3xl border border-white shadow-sm hover:shadow-xl transition-all duration-300 hover-float animate-fade-in" style="transition-delay: 0.1s">
+                        <div class="w-14 h-14 bg-gradient-to-br from-indigo-100 to-indigo-50 rounded-2xl flex items-center justify-center mb-6 shadow-sm border border-indigo-100">
+                            <i class="fa fa-sitemap text-indigo-600 text-2xl"></i>
                         </div>
+                        <h4 class="text-2xl font-extrabold mb-4 text-slate-800">SDK</h4>
+                        <ul class="space-y-4 font-medium">
+                            <li class="flex items-center text-slate-600 hover:text-indigo-600 transition-colors">
+                                <i class="fa fa-file-pdf-o text-red-500 mr-3 text-lg"></i>
+                                <span>Wing IDE</span>
+                            </li>
+                            <li class="flex items-center text-slate-600 hover:text-indigo-600 transition-colors">
+                                <i class="fa fa-file-text-o text-blue-500 mr-3 text-lg"></i>
+                                <span>编译工具链</span>
+                            </li>
+                            <li class="flex items-center text-slate-600 hover:text-indigo-600 transition-colors">
+                                <i class="fa fa-file-code-o text-emerald-500 mr-3 text-lg"></i>
+                                <span>调试器</span>
+                            </li>
+                            <li class="flex items-center text-slate-600 hover:text-indigo-600 transition-colors">
+                                <i class="fa fa-file-image-o text-purple-500 mr-3 text-lg"></i>
+                                <span>BSP</span>
+                            </li>
+                            <li class="flex items-center text-slate-600 hover:text-indigo-600 transition-colors">
+                                <i class="fa fa-file-video-o text-orange-500 mr-3 text-lg"></i>
+                                <span>IA/CA 仿真器</span>
+                            </li>
+                        </ul>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
-                        style="transition-delay: 0.4s">
-                        <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-code text-primary text-xl"></i>
-                            </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">文档</h4>
-                            <ul class="space-y-3 mb-6">
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
-                                    <span>Wing-M050 处理器技术文档</span>
-                                </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
-                                    <span>Wing-M050 处理器集成文档</span>
-                                </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
-                                    <span>Wing-M050 SDK手册</span>
-                                </li>
-                            </ul>
+                    <div class="glass-panel-light p-8 rounded-3xl border border-white shadow-sm hover:shadow-xl transition-all duration-300 hover-float animate-fade-in" style="transition-delay: 0.2s">
+                        <div class="w-14 h-14 bg-gradient-to-br from-sky-100 to-sky-50 rounded-2xl flex items-center justify-center mb-6 shadow-sm border border-sky-100">
+                            <i class="fa fa-code text-sky-600 text-2xl"></i>
                         </div>
+                        <h4 class="text-2xl font-extrabold mb-4 text-slate-800">文档</h4>
+                        <ul class="space-y-4 font-medium">
+                            <li class="flex items-center text-slate-600 hover:text-sky-600 transition-colors">
+                                <i class="fa fa-file-pdf-o text-red-500 mr-3 text-lg"></i>
+                                <span>Wing-M050 处理器技术文档</span>
+                            </li>
+                            <li class="flex items-center text-slate-600 hover:text-sky-600 transition-colors">
+                                <i class="fa fa-file-text-o text-blue-500 mr-3 text-lg"></i>
+                                <span>Wing-M050 处理器集成文档</span>
+                            </li>
+                            <li class="flex items-center text-slate-600 hover:text-sky-600 transition-colors">
+                                <i class="fa fa-file-code-o text-emerald-500 mr-3 text-lg"></i>
+                                <span>Wing-M050 SDK手册</span>
+                            </li>
+                        </ul>
                     </div>
                 </div>
             </div>
@@ -570,9 +568,9 @@
     <!-- 咨询按钮 -->
     <div class="fixed bottom-12 right-12 z-50 popupbox">
         <button id="consult-button"
-            class="bg-primary hover:bg-primary/90 text-slate-800 py-5 px-8 rounded-full shadow-xl transform transition-all duration-300 hover:scale-110 flex items-center gap-3 text-lg">
+            class="bg-white hover:bg-blue-50 text-blue-600 py-4 px-8 rounded-full shadow-lg border border-blue-100 transform transition-all duration-300 hover:scale-105 flex items-center gap-3 text-lg font-bold">
             <i class="fa fa-comments-o text-2xl"></i>
-            <span class="font-bold">立刻咨询</span>
+            立刻咨询
         </button>
     </div>
 
diff --git a/Wing-M130.html b/Wing-M130.html
index 9152ea9..cbb3ba9 100644
--- a/Wing-M130.html
+++ b/Wing-M130.html
@@ -6,57 +6,85 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>产品详情 - 隼瞻科技</title>
 
+    <!-- Tailwind (kept, may be used for layout utilities) -->
     <script src="https://cdn.tailwindcss.com"></script>
+
+    <!-- Font Awesome & Font -->
     <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
-    <script>
-        tailwind.config = {
-            theme: {
-                extend: {
-                    colors: { primary: '#3b82f6', secondary: '#2563eb', accent: '#60a5fa' },
-                    fontFamily: { inter: ['Inter', 'sans-serif'] }
-                }
-            }
-        }
-    </script>
+    <!-- Main styles -->
     <style type="text/tailwindcss">
         @layer utilities {
             .glass-panel {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
-                backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
+                backdrop-filter: blur(16px);
+                -webkit-backdrop-filter: blur(16px);
                 border: 1px solid rgba(255, 255, 255, 0.9);
                 box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
             }
             .glass-panel-light {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
-                backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
                 border: 1px solid rgba(255, 255, 255, 1);
                 box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
             }
-            .text-gradient {
+            .gradient-text {
                 background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
-                -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
+                -webkit-background-clip: text;
+                -webkit-text-fill-color: transparent;
+                background-clip: text;
+            }
+            .text-shadow {
+                text-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+            }
+            .product-feature-card {
+                transition: all 0.3s ease;
+            }
+            .product-feature-card:hover {
+                transform: translateY(-5px);
+            }
+            .section-active {
+                color: #2563eb !important;
+                border-bottom: 2px solid #2563eb !important;
+            }
+            .animate-fade-in {
+                opacity: 0;
+                transform: translateY(20px);
+                transition: opacity 0.6s ease-out, transform 0.6s ease-out;
+            }
+            .animate-fade-in.visible {
+                opacity: 1;
+                transform: translateY(0);
+            }
+            .hover-float {
+                transition: transform 0.3s ease, box-shadow 0.3s ease;
+            }
+            .hover-float:hover {
+                transform: translateY(-5px);
             }
         }
-        
-        #sj-product-page { font-family: 'Inter', sans-serif; color: #1e293b; background-color: transparent !important; }
-        #sj-product-page a { color: #3b82f6; transition: color 0.3s ease; }
-        #sj-product-page a:hover { color: #2563eb; }
-        .section-active { color: #2563eb !important; border-bottom: 2px solid #2563eb !important; }
-        .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
-        .hover-float:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1); }
-        .animate-fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
-        .animate-fade-in.visible { opacity: 1; transform: translateY(0); }
-        
-        .bg-grid {
-            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233b82f6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
-        }
     </style>
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#3b82f6',
+                        secondary: '#2563eb',
+                        accent: '#60a5fa',
+                    },
+                    fontFamily: {
+                        inter: ['Inter', 'sans-serif'],
+                    },
+                },
+            }
+        }
+    </script>
 </head>
 
-<body class="bg-slate-50 text-slate-800 font-inter antialiased overflow-x-hidden w-full">
-
+<body class="bg-slate-50 text-slate-800 font-inter antialiased">
     <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
     <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
         <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
@@ -66,163 +94,162 @@
     </div>
 
     <!-- Wrapper with an ID so we can scope styles and avoid WP theme interference -->
-    <div id="sj-product-page" class="relative z-10 w-full min-h-screen">
+    <div id="sj-product-page" class="min-h-screen relative z-10">
 
         <!-- 产品页面头部 -->
-        <section class="pt-24 md:pt-32 pb-16 md:pb-24 bg-gradient-to-br gradient-animate"
-            style="background: linear-gradient(135deg, rgba(248,250,252,0.95), rgba(239,246,255,1)); overflow:hidden;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section class="pt-24 md:pt-32 pb-16 md:pb-24 relative overflow-hidden">
+            <div class="absolute top-0 left-1/2 -translate-x-1/2 w-[80%] h-64 bg-primary/10 blur-[120px] rounded-full pointer-events-none"></div>
+            
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto text-center">
-                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-bold text-slate-800 leading-tight text-shadow mb-6">
+                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-extrabold text-slate-800 leading-tight drop-shadow-sm mb-6">
                         通用处理器IP
                     </h1>
-                    <div class="bg-primary-20 inline-block px-6 pt-4 rounded-full mb-6 animate-fade-in">
-                        <h2 class="text-xl font-semibold text-primary">Wing-M Series</h2>
+                    <div class="glass-panel-light inline-flex items-center space-x-2 px-6 py-2 rounded-full border border-blue-200 mb-6 shadow-sm animate-fade-in">
+                        <h2 class="text-xl font-bold text-blue-700">Wing-M Series</h2>
                     </div>
-                    <h3 class="text-2xl md:text-3xl font-bold text-slate-800 mb-8">Wing-M130 Processor IP</h3>
+                    <h3 class="text-2xl md:text-3xl font-extrabold text-slate-800 mb-8 gradient-text inline-block">Wing-M130 Processor IP</h3>
 
-                    <p class="text-lg md:text-xl text-slate-600 mb-8 max-w-2xl mx-auto" style="line-height:1.6;">
+                    <p class="text-lg md:text-xl text-slate-600 font-medium mb-8 max-w-2xl mx-auto leading-relaxed">
                         Wing-M130是基于RISC-V架构的32位、单发射、3级流水线的支持浮点应用的微控制器。该处理具备业界领先的同级别处理器性能，兼顾功耗和成本，并具备全面的可配置性和可扩展性，适用于工业控制，物联网，可穿戴设备等领域。
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto" style="background-color:var(--primary); height:4px;"></div>
                 </div>
             </div>
         </section>
 
         <!-- 1. 架构 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="architecture" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">架构</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">架构</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M130是基于RISC-V架构的32位、单发射、3级流水线的支持浮点应用的微控制器。
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <!-- 架构大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
-                    <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
-                        <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-M130 处理器IP架构</h3>
+                <div class="max-w-4xl mx-auto glass-panel rounded-3xl shadow-md border border-white hover:shadow-lg transition-shadow overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6 bg-slate-50 border-b border-slate-200">
+                        <h3 class="text-2xl font-extrabold text-slate-800 text-center">Wing-M130 处理器IP架构</h3>
                     </div>
-                    <div class="p-4">
+                    <div class="p-4 bg-white/50 backdrop-blur-sm">
                         <img src="https://www.beiyuxing.live/wp-content/uploads/2025/11/whiteboard_exported_image-14.png"
-                            alt="Wing-M050 Processor IP架构图" class="w-full h-auto rounded-lg" />
+                            alt="Wing-M130 Processor IP架构图" class="w-full h-auto rounded-2xl" />
                     </div>
                 </div>
             </div>
         </section>
 
         <!-- 2. 产品特点 -->
-        <section id="features" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="features" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品特点</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">产品特点</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <div class="space-y-6 max-w-4xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">业界领先的架构性能，与ARM比肩的面效比与能效比</h4>
+                                <h4 class="text-xl font-extrabold text-slate-800">业界领先的架构性能，与ARM比肩的面效比与能效比</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.1s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">
+                                <h4 class="text-xl font-extrabold text-slate-800">
                                     支持基于处理器自动化设计平台扩展领域专用指令集，可快速迭代专用处理器解决方案</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.2s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研代码压缩技术，直击RISC-V基础架构代码膨胀问题
+                                <h4 class="text-xl font-extrabold text-slate-800">支持隼瞻科技自研代码压缩技术，直击RISC-V基础架构代码膨胀问题
                                 </h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.3s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研中断实时性增强技术，提供优异的中断切换效率和中断处理实时性
+                                <h4 class="text-xl font-extrabold text-slate-800">支持隼瞻科技自研中断实时性增强技术，提供优异的中断切换效率和中断处理实时性
                                 </h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.4s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持多样化的在线/离线调试手段，可快速定位并解决故障</h4>
+                                <h4 class="text-xl font-extrabold text-slate-800">支持多样化的在线/离线调试手段，可快速定位并解决故障</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.5s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持统一的Wlink调试工具，一站式解决不同调试接口的兼容性问题</h4>
+                                <h4 class="text-xl font-extrabold text-slate-800">支持统一的Wlink调试工具，一站式解决不同调试接口的兼容性问题</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.6s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.6s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持配置丰富的功能，可针对客户目标应用“量体裁衣”</h4>
+                                <h4 class="text-xl font-extrabold text-slate-800">支持配置丰富的功能，可针对客户目标应用“量体裁衣”</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.7s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持丰富的安全机制，满足信息安全国际CC认证</h4>
+                                <h4 class="text-xl font-extrabold text-slate-800">支持丰富的安全机制，满足信息安全国际CC认证</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm hover:shadow-md hover:-translate-y-1 transition-all animate-fade-in group" style="transition-delay: 0.7s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-50 border border-blue-100 p-2 rounded-xl shrink-0 shadow-inner group-hover:bg-blue-100 transition-colors">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">车规核获ISO26262 ASIL-D等级认证</h4>
+                                <h4 class="text-xl font-extrabold text-slate-800">车规核获ISO26262 ASIL-D等级认证</h4>
                             </div>
                         </div>
                     </div>
@@ -231,65 +258,69 @@
         </section>
 
         <!-- 3. 产品参数 -->
-        <section id="specifications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="specifications" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品参数</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">产品参数</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M130 Processor IP的详细技术参数，为您提供全面的产品信息
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-2xl font-bold mb-6 text-slate-800">性能基准测试</h3>
+                <div class="glass-panel-light border border-white rounded-3xl shadow-sm p-8 animate-fade-in hover:shadow-md transition-shadow mb-8">
+                    <h3 class="text-2xl font-extrabold mb-6 text-slate-800 flex items-center">
+                        <div class="w-2 h-6 bg-blue-500 rounded-full mr-3"></div> 性能基准测试
+                    </h3>
                     <div class="grid md:grid-cols-2 gap-6">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">Dhrystone</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">2.23（Legal）</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200">
+                                <span class="text-slate-500 font-bold text-xl">Dhrystone</span>
+                                <span class="font-extrabold text-2xl text-emerald-500">2.23（Legal）</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">Coremark</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">4.47</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200">
+                                <span class="text-slate-500 font-bold text-xl">Coremark</span>
+                                <span class="font-extrabold text-2xl text-emerald-500">4.47</span>
                             </div>
                         </div>
                     </div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-xl font-bold mb-6 text-slate-800">功能参数</h3>
+                <div class="glass-panel-light border border-white rounded-3xl shadow-sm p-8 animate-fade-in hover:shadow-md transition-shadow">
+                    <h3 class="text-xl font-extrabold mb-6 text-slate-800 flex items-center">
+                         <div class="w-2 h-6 bg-sky-500 rounded-full mr-3"></div> 功能参数
+                    </h3>
                     <div class="grid md:grid-cols-2 gap-6">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">ISA</span>
-                                <span class="font-medium text-slate-800">RV32I（M）（A）B（F）_zce_zicond_xwingc</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">ISA</span>
+                                <span class="font-bold text-slate-700">RV32I（M）（A）B（F）_zce_xwingc</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Micro Arch</span>
-                                <span class="font-medium text-slate-800">3-stage, In-order, one-issue</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Micro Arch</span>
+                                <span class="font-bold text-slate-700">3-stage, In-order, one-issue</span>
                             </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">Memory System</span>
-                                <span class="font-medium text-slate-800">I Cache(up to 64KB); I/D TCM(up to 128KB);</br>
+                            <div class="flex justify-between pb-1 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Memory System</span>
+                                <span class="font-bold text-slate-700 text-right">I Cache(up to 64KB); I/D TCM(up to 128KB);</br>
                                     Optional Memory Protect Unit(PMP)</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Ext. Interrupts</span>
-                                <span class="font-medium text-slate-800">Up to 4064 IRQs</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Ext. Interrupts</span>
+                                <span class="font-bold text-slate-700">Up to 4064 IRQs</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Debug</span>
-                                <span class="font-medium text-slate-800">CJTAG/JTAG</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Debug</span>
+                                <span class="font-bold text-slate-700">CJTAG/JTAG</span>
                             </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">External Bus</span>
-                                <span class="font-medium text-slate-800">3x AHB</span>
+                            <div class="flex justify-between pb-1 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">External Bus</span>
+                                <span class="font-bold text-slate-700">3x AHB</span>
                             </div>
                         </div>
                     </div>
@@ -298,40 +329,40 @@
         </section>
 
         <!-- 1. 应用场景 -->
-        <section id="applications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="applications" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">应用场景</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">应用场景</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M130处理器IP凭借其高性能、低功耗特性，广泛应用于以下领域
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <!-- 应用场景标签 -->
                 <div class="flex flex-wrap justify-center gap-4 max-w-3xl mx-auto mb-16">
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2">
+                        class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors">
                         <i class="fa fa-industry"></i> 工业控制
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors"
                         style="transition-delay: 0.1s">
                         <i class="fa fa-connectdevelop"></i> 物联网
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors"
                         style="transition-delay: 0.2s">
                         <i class="fa fa-mobile"></i> 可穿戴设备
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors"
                         style="transition-delay: 0.3s">
                         <i class="fa fa-shield"></i> 物理安全
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 text-blue-600 border border-blue-100 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors"
                         style="transition-delay: 0.4s">
                         <i class="fa fa-car"></i> 车规功能安全
                     </span>
@@ -339,70 +370,70 @@
 
                 <!-- 详细应用场景描述 -->
                 <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 max-w-5xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm animate-fade-in hover:shadow-md transition-shadow group">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-industry text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-full flex items-center justify-center mr-4 group-hover:scale-110 transition-transform">
+                                <i class="fa fa-industry text-blue-600 text-xl"></i>
                             </div>
                             <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">工业控制</h4>
-                                <p class="text-slate-600">
+                                <h4 class="text-xl font-extrabold mb-2 text-slate-800">工业控制</h4>
+                                <p class="text-slate-600 font-medium">
                                     提供高精度、实时性强的工业控制系统解决方案，支持复杂的工业自动化和控制算法，确保工业环境下的稳定可靠运行。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm animate-fade-in hover:shadow-md transition-shadow group" style="transition-delay: 0.1s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-connectdevelop text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-full flex items-center justify-center mr-4 group-hover:scale-110 transition-transform">
+                                <i class="fa fa-connectdevelop text-blue-600 text-xl"></i>
                             </div>
                             <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">物联网</h4>
-                                <p class="text-slate-600">
+                                <h4 class="text-xl font-extrabold mb-2 text-slate-800">物联网</h4>
+                                <p class="text-slate-600 font-medium">
                                     为物联网终端设备提供高效的计算能力，支持多协议通信和边缘计算，满足物联网设备的低功耗和高可靠性需求。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm animate-fade-in hover:shadow-md transition-shadow group" style="transition-delay: 0.2s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-mobile text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-full flex items-center justify-center mr-4 group-hover:scale-110 transition-transform">
+                                <i class="fa fa-mobile text-blue-600 text-xl"></i>
                             </div>
                             <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">可穿戴设备</h4>
-                                <p class="text-slate-600">
+                                <h4 class="text-xl font-extrabold mb-2 text-slate-800">可穿戴设备</h4>
+                                <p class="text-slate-600 font-medium">
                                     针对智能手表、健康监测设备等可穿戴电子产品优化，提供低功耗运行和高效的数据处理能力，保障长时间电池续航。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm animate-fade-in hover:shadow-md transition-shadow group" style="transition-delay: 0.3s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-shield text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-full flex items-center justify-center mr-4 group-hover:scale-110 transition-transform">
+                                <i class="fa fa-shield text-blue-600 text-xl"></i>
                             </div>
                             <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">物理安全</h4>
-                                <p class="text-slate-600">
+                                <h4 class="text-xl font-extrabold mb-2 text-slate-800">物理安全</h4>
+                                <p class="text-slate-600 font-medium">
                                     提供硬件级安全防护能力，支持安全启动、加密存储和安全通信，为物理安全设备提供可靠的安全计算基础。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="glass-panel border border-white p-6 rounded-3xl shadow-sm animate-fade-in hover:shadow-md transition-shadow group" style="transition-delay: 0.4s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-car text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-full flex items-center justify-center mr-4 group-hover:scale-110 transition-transform">
+                                <i class="fa fa-car text-blue-600 text-xl"></i>
                             </div>
                             <div>
-                                <h4 class="text-xl font-bold mb-2 text-slate-800">车规功能安全</h4>
-                                <p class="text-slate-600">
+                                <h4 class="text-xl font-extrabold mb-2 text-slate-800">车规功能安全</h4>
+                                <p class="text-slate-600 font-medium">
                                     符合ISO 26262等车规安全标准，为车载电子系统提供高可靠性的计算平台，支持自动驾驶和智能座舱等安全关键应用。
                                 </p>
                             </div>
@@ -413,26 +444,26 @@
         </section>
 
         <!-- 5. 交付包 -->
-        <section id="documentation" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="documentation" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">交付包</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">交付包</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         隼瞻科技提供全面的技术文档，帮助客户快速了解和使用我们的产品
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
                     <div
-                        class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
+                        class="glass-panel-light border border-white rounded-3xl shadow-sm hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-microchip text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-xl flex items-center justify-center mb-4 shadow-sm">
+                                <i class="fa fa-microchip text-blue-600 text-xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">HDK</h4>
-                            <ul class="space-y-3 mb-6">
+                            <h4 class="text-xl font-extrabold mb-3 text-slate-800">HDK</h4>
+                            <ul class="space-y-3 mb-6 text-slate-600 font-medium">
                                 <li class="flex items-center text-sm">
                                     <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
                                     <span>Wing-M130 RTL代码</span>
@@ -442,7 +473,7 @@
                                     <span>仿真验证环境</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
+                                    <i class="fa fa-file-code-o text-emerald-500 mr-2"></i>
                                     <span>DC综合参考环境</span>
                                 </li>
                                 <li class="flex items-center text-sm">
@@ -450,21 +481,21 @@
                                     <span>Formality形式验证参考环境</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
+                                    <i class="fa fa-file-video-o text-amber-500 mr-2"></i>
                                     <span>FPGA配置文件</span>
                                 </li>
                             </ul>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
+                    <div class="glass-panel-light border border-white rounded-3xl shadow-sm hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
                         style="transition-delay: 0.2s">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-sitemap text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-xl flex items-center justify-center mb-4 shadow-sm">
+                                <i class="fa fa-sitemap text-blue-600 text-xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">SDK</h4>
-                            <ul class="space-y-3 mb-6">
+                            <h4 class="text-xl font-extrabold mb-3 text-slate-800">SDK</h4>
+                            <ul class="space-y-3 mb-6 text-slate-600 font-medium">
                                 <li class="flex items-center text-sm">
                                     <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
                                     <span>Wing IDE</span>
@@ -474,7 +505,7 @@
                                     <span>编译工具链</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
+                                    <i class="fa fa-file-code-o text-emerald-500 mr-2"></i>
                                     <span>调试器</span>
                                 </li>
                                 <li class="flex items-center text-sm">
@@ -482,21 +513,21 @@
                                     <span>BSP</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
+                                    <i class="fa fa-file-video-o text-amber-500 mr-2"></i>
                                     <span>IA/CA 仿真器</span>
                                 </li>
                             </ul>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
+                    <div class="glass-panel-light border border-white rounded-3xl shadow-sm hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
                         style="transition-delay: 0.4s">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-code text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-50 border border-blue-100 rounded-xl flex items-center justify-center mb-4 shadow-sm">
+                                <i class="fa fa-code text-blue-600 text-xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">文档</h4>
-                            <ul class="space-y-3 mb-6">
+                            <h4 class="text-xl font-extrabold mb-3 text-slate-800">文档</h4>
+                            <ul class="space-y-3 mb-6 text-slate-600 font-medium">
                                 <li class="flex items-center text-sm">
                                     <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
                                     <span>Wing-M130 处理器技术文档</span>
@@ -506,7 +537,7 @@
                                     <span>Wing-M130 处理器集成文档</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
+                                    <i class="fa fa-file-code-o text-emerald-500 mr-2"></i>
                                     <span>Wing-M130 SDK手册</span>
                                 </li>
                             </ul>
@@ -521,9 +552,9 @@
     <!-- 咨询按钮 -->
     <div class="fixed bottom-12 right-12 z-50 popupbox">
         <button id="consult-button"
-            class="bg-primary hover:bg-primary/90 text-slate-800 py-5 px-8 rounded-full shadow-xl transform transition-all duration-300 hover:scale-110 flex items-center gap-3 text-lg">
+            class="bg-blue-600 hover:bg-blue-700 text-white py-5 px-8 rounded-full shadow-lg transform transition-all duration-300 hover:-translate-y-1 hover:shadow-xl flex items-center gap-3 text-lg font-extrabold">
             <i class="fa fa-comments-o text-2xl"></i>
-            <span class="font-bold">立刻咨询</span>
+            <span>立刻咨询</span>
         </button>
     </div>
 
diff --git a/Wing-M130A.html b/Wing-M130A.html
index 7917951..6ad13c4 100644
--- a/Wing-M130A.html
+++ b/Wing-M130A.html
@@ -6,57 +6,85 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>产品详情 - 隼瞻科技</title>
 
+    <!-- Tailwind (kept, may be used for layout utilities) -->
     <script src="https://cdn.tailwindcss.com"></script>
+
+    <!-- Font Awesome & Font -->
     <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
-    <script>
-        tailwind.config = {
-            theme: {
-                extend: {
-                    colors: { primary: '#3b82f6', secondary: '#2563eb', accent: '#60a5fa' },
-                    fontFamily: { inter: ['Inter', 'sans-serif'] }
-                }
-            }
-        }
-    </script>
+    <!-- Main styles -->
     <style type="text/tailwindcss">
         @layer utilities {
             .glass-panel {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
-                backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
+                backdrop-filter: blur(16px);
+                -webkit-backdrop-filter: blur(16px);
                 border: 1px solid rgba(255, 255, 255, 0.9);
                 box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
             }
             .glass-panel-light {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
-                backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
                 border: 1px solid rgba(255, 255, 255, 1);
                 box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
             }
-            .text-gradient {
+            .gradient-text {
                 background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
-                -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
+                -webkit-background-clip: text;
+                -webkit-text-fill-color: transparent;
+                background-clip: text;
+            }
+            .text-shadow {
+                text-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+            }
+            .product-feature-card {
+                transition: all 0.3s ease;
+            }
+            .product-feature-card:hover {
+                transform: translateY(-5px);
+            }
+            .section-active {
+                color: #2563eb !important;
+                border-bottom: 2px solid #2563eb !important;
+            }
+            .animate-fade-in {
+                opacity: 0;
+                transform: translateY(20px);
+                transition: opacity 0.6s ease-out, transform 0.6s ease-out;
+            }
+            .animate-fade-in.visible {
+                opacity: 1;
+                transform: translateY(0);
+            }
+            .hover-float {
+                transition: transform 0.3s ease, box-shadow 0.3s ease;
+            }
+            .hover-float:hover {
+                transform: translateY(-5px);
             }
         }
-        
-        #sj-product-page { font-family: 'Inter', sans-serif; color: #1e293b; background-color: transparent !important; }
-        #sj-product-page a { color: #3b82f6; transition: color 0.3s ease; }
-        #sj-product-page a:hover { color: #2563eb; }
-        .section-active { color: #2563eb !important; border-bottom: 2px solid #2563eb !important; }
-        .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
-        .hover-float:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1); }
-        .animate-fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
-        .animate-fade-in.visible { opacity: 1; transform: translateY(0); }
-        
-        .bg-grid {
-            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233b82f6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
-        }
     </style>
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#3b82f6',
+                        secondary: '#2563eb',
+                        accent: '#60a5fa',
+                    },
+                    fontFamily: {
+                        inter: ['Inter', 'sans-serif'],
+                    },
+                },
+            }
+        }
+    </script>
 </head>
 
-<body class="bg-slate-50 text-slate-800 font-inter antialiased overflow-x-hidden w-full">
-
+<body class="bg-slate-50 text-slate-800 font-inter antialiased">
     <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
     <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
         <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
@@ -66,164 +94,156 @@
     </div>
 
     <!-- Wrapper with an ID so we can scope styles and avoid WP theme interference -->
-    <div id="sj-product-page" class="relative z-10 w-full min-h-screen">
+    <div id="sj-product-page" class="min-h-screen relative z-10">
 
         <!-- 产品页面头部 -->
-        <section class="pt-24 md:pt-32 pb-16 md:pb-24 bg-gradient-to-br gradient-animate"
-            style="background: linear-gradient(135deg, rgba(248,250,252,0.95), rgba(239,246,255,1)); overflow:hidden;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section class="pt-24 md:pt-32 pb-16 md:pb-24 relative overflow-hidden">
+            <div class="absolute top-0 left-1/2 -translate-x-1/2 w-[80%] h-64 bg-primary/10 blur-[120px] rounded-full pointer-events-none"></div>
+            
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto text-center">
-                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-bold text-slate-800 leading-tight text-shadow mb-6">
+                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-extrabold text-slate-800 leading-tight drop-shadow-sm mb-6">
                         车规处理器IP
                     </h1>
-                    <div class="bg-primary-20 inline-block px-6 pt-4 rounded-full mb-6 animate-fade-in">
-                        <h2 class="text-xl font-semibold text-primary">Wing-M Series</h2>
+                    <div class="glass-panel-light inline-flex items-center space-x-2 px-6 py-2 rounded-full border border-blue-200 mb-6 shadow-sm animate-fade-in">
+                        <h2 class="text-xl font-bold text-blue-700">Wing-M Series</h2>
                     </div>
-                    <h3 class="text-2xl md:text-3xl font-bold text-slate-800 mb-8">Wing-M130A Processor IP</h3>
-                    <p class="text-lg md:text-xl text-slate-600 mb-8 max-w-2xl mx-auto" style="line-height:1.6;">
-                        Wing-M130A是基于RISC-V架构的32位、3级流水线的的微控制器。其采用双核锁步机制,提高单点故障覆盖率和潜在故障覆盖率,满足车规安全等级要求。该产品能够显著减少客户在汽车安全标准认证上的时间成本。同时，依托于RISC-V架构的模块化和高度可定制的特性，它能够适应多样化的车载系统级芯片(SoC)设计需求。
+                    <h3 class="text-2xl md:text-3xl font-extrabold text-slate-800 mb-8 gradient-text inline-block">Wing-M130A Processor IP</h3>
+
+                    <p class="text-lg md:text-xl text-slate-600 font-medium mb-8 max-w-2xl mx-auto leading-relaxed">
+                        Wing-M130A是基于RISC-V架构的32位、3级流水线的支持浮点应用的微控制器。其采用双核锁步机制,提高单点故障覆盖率和潜在故障覆盖率,满足车规安全等级要求。该产品能够显著减少客户在汽车安全标准认证上的时间成本。同时，依托于RISC-V架构的模块化和高度可定制的特性，它能够适应多样化的车载系统级芯片（SoC）设计需求。
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto" style="background-color:var(--primary); height:4px;"></div>
                 </div>
             </div>
         </section>
 
         <!-- 4. 架构 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="architecture" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">架构</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">架构</h2>
+                    <p class="text-slate-600 mb-6 text-center font-medium">
                         Wing-M130A是基于RISC-V架构的32位、单发射、3级流水线的支持浮点应用的微控制器。
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
                 <!-- 架构大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
-                    <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
-                        <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-M130A 处理器IP架构</h3>
+                <div class="max-w-4xl mx-auto glass-panel rounded-3xl shadow-md border border-white hover:shadow-lg transition-shadow overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6 bg-slate-50 border-b border-slate-200">
+                        <h3 class="text-2xl font-extrabold text-slate-800 text-center">Wing-M130A 处理器IP架构</h3>
                     </div>
-                    <div class="p-4">
+                    <div class="p-4 bg-white/50 backdrop-blur-sm">
                         <img src="https://www.beiyuxing.live/wp-content/uploads/2025/11/whiteboard_exported_image-16-scaled.png"
-                            alt="Wing-M050 Processor IP架构图" class="w-full h-auto rounded-lg" />
+                            alt="Wing-M130A Processor IP架构图" class="w-full h-auto rounded-2xl border border-slate-100 shadow-sm" />
                     </div>
                 </div>
             </div>
         </section>
 
         <!-- 2. 产品特点 -->
-        <section id="features" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="features" class="section-content py-16 bg-slate-50/50 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品特点</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">产品特点</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
                 <div class="space-y-6 max-w-4xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 text-blue-600 p-3 rounded-xl shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-xl"></i>
                             </div>
-                            <div class="ml-4">
+                            <div class="ml-5">
                                 <h4 class="text-xl font-bold text-slate-800">业界领先的架构性能，与ARM比肩的面效比与能效比</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.1s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 text-blue-600 p-3 rounded-xl shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">
-                                    支持基于隼瞻科技自研处理器自动化设计平台扩展领域专用指令集，可快速迭代专用处理器解决方案</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-800">支持基于隼瞻科技自研处理器自动化设计平台扩展领域专用指令集，可快速迭代专用处理器解决方案</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.2s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 text-blue-600 p-3 rounded-xl shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研代码压缩技术，直击RISC-V基础架构代码膨胀问题
-                                </h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研代码压缩技术，直击RISC-V基础架构代码膨胀问题</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.3s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 text-blue-600 p-3 rounded-xl shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研中断实时性增强技术，提供优异的中断切换效率和中断处理实时性
-                                </h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研中断实时性增强技术，提供优异的中断切换效率和中断处理实时性</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.4s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 text-blue-600 p-3 rounded-xl shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-xl"></i>
                             </div>
-                            <div class="ml-4">
+                            <div class="ml-5">
                                 <h4 class="text-xl font-bold text-slate-800">支持多样化的在线/离线调试手段，可快速定位并解决故障</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.5s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 text-blue-600 p-3 rounded-xl shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持统一的WingLink调试工具，一站式解决不同调试接口的兼容性问题
-                                </h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-800">支持统一的WingLink调试工具，一站式解决不同调试接口的兼容性问题</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.6s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.6s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 text-blue-600 p-3 rounded-xl shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-xl"></i>
                             </div>
-                            <div class="ml-4">
+                            <div class="ml-5">
                                 <h4 class="text-xl font-bold text-slate-800">支持配置丰富的功能，可针对客户目标应用“量体裁衣”</h4>
                             </div>
                         </div>
                     </div>
 
-
-
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.7s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 text-blue-600 p-3 rounded-xl shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-xl"></i>
                             </div>
-                            <div class="ml-4">
+                            <div class="ml-5">
                                 <h4 class="text-xl font-bold text-slate-800">支持丰富的安全机制，满足信息安全国际CC认证</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.8s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 text-blue-600 p-3 rounded-xl shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-xl"></i>
                             </div>
-                            <div class="ml-4">
+                            <div class="ml-5">
                                 <h4 class="text-xl font-bold text-slate-800">车规核获ISO26262 ASIL-D等级认证</h4>
                             </div>
                         </div>
@@ -233,65 +253,73 @@
         </section>
 
         <!-- 3. 产品参数 -->
-        <section id="specifications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="specifications" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品参数</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">产品参数</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M130A Processor IP的详细技术参数，为您提供全面的产品信息
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-2xl font-bold mb-6 text-slate-800">性能基准测试</h3>
-                    <div class="grid md:grid-cols-2 gap-6">
+                <div class="glass-panel rounded-3xl shadow-sm border border-white p-8 animate-fade-in mb-8">
+                    <h3 class="text-2xl font-extrabold mb-6 text-slate-800 flex items-center gap-3">
+                        <div class="w-10 h-10 bg-indigo-100 rounded-lg flex items-center justify-center text-indigo-600">
+                            <i class="fa fa-tachometer"></i>
+                        </div>
+                        性能基准测试
+                    </h3>
+                    <div class="grid md:grid-cols-2 gap-8">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">Dhrystone</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">2.23（Legal）</span>
+                            <div class="flex justify-between items-end pb-3 border-b border-slate-200 hover:border-blue-300 transition-colors">
+                                <span class="text-slate-500 font-medium text-xl">Dhrystone</span>
+                                <span class="font-extrabold text-2xl text-blue-600">2.23（Legal）</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">Coremark</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">4.47</span>
+                            <div class="flex justify-between items-end pb-3 border-b border-slate-200 hover:border-blue-300 transition-colors">
+                                <span class="text-slate-500 font-medium text-xl">Coremark</span>
+                                <span class="font-extrabold text-2xl text-blue-600">4.47</span>
                             </div>
                         </div>
                     </div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-xl font-bold mb-6 text-slate-800">功能参数</h3>
-                    <div class="grid md:grid-cols-2 gap-6">
-                        <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">ISA</span>
-                                <span class="font-medium text-slate-800">RV32I（M）（A）B（F）_zce_zicond_xwingc</span>
+                <div class="glass-panel rounded-3xl shadow-sm border border-white p-8 animate-fade-in">
+                    <h3 class="text-2xl font-extrabold mb-8 text-slate-800 flex items-center gap-3">
+                        <div class="w-10 h-10 bg-sky-100 rounded-lg flex items-center justify-center text-sky-600">
+                            <i class="fa fa-cogs"></i>
+                        </div>
+                        功能参数
+                    </h3>
+                    <div class="grid md:grid-cols-2 gap-x-12 gap-y-6">
+                        <div class="space-y-5">
+                            <div class="flex flex-col sm:flex-row sm:justify-between sm:items-center pb-3 border-b border-slate-200 hover:border-blue-300 transition-colors">
+                                <span class="text-slate-500 font-medium mb-1 sm:mb-0">ISA</span>
+                                <span class="font-bold text-slate-800 text-right">RV32I（M）（A）B（F）_zce_zicond_xwingc</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Micro Arch</span>
-                                <span class="font-medium text-slate-800">3-stage, In-order, one-issue</span>
+                            <div class="flex flex-col sm:flex-row sm:justify-between sm:items-center pb-3 border-b border-slate-200 hover:border-blue-300 transition-colors">
+                                <span class="text-slate-500 font-medium mb-1 sm:mb-0">Micro Arch</span>
+                                <span class="font-bold text-slate-800 text-right">3-stage, In-order, one-issue</span>
                             </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">Memory System</span>
-                                <span class="font-medium text-slate-800">I Cache(up to 64KB); I/D TCM(up to 128KB);</br>
-                                    Optional Memory Protect Unit(PMP)</span>
+                            <div class="flex flex-col sm:flex-row sm:justify-between pb-3 border-b border-slate-200 hover:border-blue-300 transition-colors">
+                                <span class="text-slate-500 font-medium mt-1">Memory System</span>
+                                <span class="font-bold text-slate-800 text-right">I Cache(up to 64KB); I/D TCM(up to 128KB);<br/>Optional Memory Protect Unit(PMP)</span>
                             </div>
                         </div>
-                        <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Ext. Interrupts</span>
-                                <span class="font-medium text-slate-800">Up to 4064 IRQs</span>
+                        <div class="space-y-5">
+                            <div class="flex flex-col sm:flex-row sm:justify-between sm:items-center pb-3 border-b border-slate-200 hover:border-blue-300 transition-colors">
+                                <span class="text-slate-500 font-medium mb-1 sm:mb-0">Ext. Interrupts</span>
+                                <span class="font-bold text-slate-800 text-right">Up to 4064 IRQs</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Debug</span>
-                                <span class="font-medium text-slate-800">CJTAG/JTAG</span>
+                            <div class="flex flex-col sm:flex-row sm:justify-between sm:items-center pb-3 border-b border-slate-200 hover:border-blue-300 transition-colors">
+                                <span class="text-slate-500 font-medium mb-1 sm:mb-0">Debug</span>
+                                <span class="font-bold text-slate-800 text-right">CJTAG/JTAG</span>
                             </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">External Bus</span>
-                                <span class="font-medium text-slate-800">3x AHB</span>
+                            <div class="flex flex-col sm:flex-row sm:justify-between sm:items-center pb-3 border-b border-slate-200 hover:border-blue-300 transition-colors">
+                                <span class="text-slate-500 font-medium mb-1 sm:mb-0">External Bus</span>
+                                <span class="font-bold text-slate-800 text-right">3x AHB</span>
                             </div>
                         </div>
                     </div>
@@ -300,40 +328,40 @@
         </section>
 
         <!-- 1. 应用场景 -->
-        <section id="applications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <!-- 1. 应用场景 -->
+        <section id="applications" class="section-content py-16 bg-slate-50/50 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">应用场景</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">应用场景</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M130A处理器IP凭借其高性能、低功耗特性，广泛应用于以下领域
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
                 <!-- 应用场景标签 -->
                 <div class="flex flex-wrap justify-center gap-4 max-w-3xl mx-auto mb-16">
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2">
+                        class="bg-blue-50 border border-blue-200 text-blue-700 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors pointer-events-none">
                         <i class="fa fa-industry"></i> 工业控制
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-200 text-blue-700 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors pointer-events-none"
                         style="transition-delay: 0.1s">
                         <i class="fa fa-connectdevelop"></i> 物联网
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-200 text-blue-700 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors pointer-events-none"
                         style="transition-delay: 0.2s">
                         <i class="fa fa-mobile"></i> 可穿戴设备
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-200 text-blue-700 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors pointer-events-none"
                         style="transition-delay: 0.3s">
                         <i class="fa fa-shield"></i> 物理安全
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-200 text-blue-700 px-6 py-3 rounded-full text-lg font-bold animate-fade-in flex items-center gap-2 shadow-sm hover:bg-blue-100 transition-colors pointer-events-none"
                         style="transition-delay: 0.4s">
                         <i class="fa fa-car"></i> 车规功能安全
                     </span>
@@ -341,70 +369,70 @@
 
                 <!-- 详细应用场景描述 -->
                 <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 max-w-5xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1 group">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-industry text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mr-4 group-hover:bg-blue-500 transition-colors border border-blue-200">
+                                <i class="fa fa-industry text-blue-600 text-xl group-hover:text-white transition-colors"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">工业控制</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     提供高精度、实时性强的工业控制系统解决方案，支持复杂的工业自动化和控制算法，确保工业环境下的稳定可靠运行。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1 group" style="transition-delay: 0.1s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-connectdevelop text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-sky-100 rounded-xl flex items-center justify-center mr-4 group-hover:bg-sky-500 transition-colors border border-sky-200">
+                                <i class="fa fa-connectdevelop text-sky-600 text-xl group-hover:text-white transition-colors"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">物联网</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     为物联网终端设备提供高效的计算能力，支持多协议通信和边缘计算，满足物联网设备的低功耗和高可靠性需求。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1 group" style="transition-delay: 0.2s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-mobile text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-indigo-100 rounded-xl flex items-center justify-center mr-4 group-hover:bg-indigo-500 transition-colors border border-indigo-200">
+                                <i class="fa fa-mobile text-indigo-600 text-xl group-hover:text-white transition-colors"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">可穿戴设备</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     针对智能手表、健康监测设备等可穿戴电子产品优化，提供低功耗运行和高效的数据处理能力，保障长时间电池续航。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1 group" style="transition-delay: 0.3s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-shield text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-teal-100 rounded-xl flex items-center justify-center mr-4 group-hover:bg-teal-500 transition-colors border border-teal-200">
+                                <i class="fa fa-shield text-teal-600 text-xl group-hover:text-white transition-colors"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">物理安全</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     提供硬件级安全防护能力，支持安全启动、加密存储和安全通信，为物理安全设备提供可靠的安全计算基础。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="glass-panel p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1 group" style="transition-delay: 0.4s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-car text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mr-4 group-hover:bg-blue-600 transition-colors border border-blue-200">
+                                <i class="fa fa-car text-blue-600 text-xl group-hover:text-white transition-colors"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">车规功能安全</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     符合ISO 26262等车规安全标准，为车载电子系统提供高可靠性的计算平台，支持自动驾驶和智能座舱等安全关键应用。
                                 </p>
                             </div>
@@ -415,126 +443,118 @@
         </section>
 
         <!-- 4. 认证 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="certification" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">安全</h2>
-                    <p class="text-slate-600 mb-6 text-center">
-                    </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">安全认证</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
                 <!-- 认证大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
-                    <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
-                        <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-M130A的车规认证</h3>
+                <div class="max-w-4xl mx-auto glass-panel rounded-3xl shadow-md border border-white hover:shadow-lg transition-shadow overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6 bg-slate-50 border-b border-slate-200">
+                        <h3 class="text-2xl font-extrabold text-slate-800 text-center">Wing-M130A的车规认证</h3>
                     </div>
-                    <div class="p-4">
+                    <div class="p-4 bg-white/50 backdrop-blur-sm">
                         <img src="https://www.beiyuxing.live/wp-content/uploads/2025/11/FS_71_220_24_1422_scan_00.jpg"
-                            alt="Wing-M130A Processor IP架构图" class="w-full h-auto rounded-lg" />
+                            alt="Wing-M130A 认证图" class="w-full h-auto rounded-2xl border border-slate-100 shadow-sm" />
                     </div>
                 </div>
             </div>
         </section>
 
         <!-- 5. 交付包 -->
-        <section id="documentation" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="documentation" class="section-content py-16 bg-slate-50/50 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">交付包</h2>
-                    <p class="text-slate-600 mb-6 text-center">
-                        隼瞻科技提供全面的技术文档，帮助客户快速了解和使用我们的产品
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">交付包</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
+                        隼瞻科技提供全面的技术交付包，帮助客户快速集成和使用我们的产品
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
-                    </div>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full"></div>
                 </div>
 
                 <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
-                    <div
-                        class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
-                        <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-microchip text-primary text-xl"></i>
+                    <div class="glass-panel rounded-2xl border border-white shadow-sm hover:shadow-lg transition-all duration-300 overflow-hidden hover-float animate-fade-in">
+                        <div class="p-8">
+                            <div class="w-14 h-14 bg-blue-100 rounded-xl flex items-center justify-center mb-6 border border-blue-200 shadow-sm">
+                                <i class="fa fa-microchip text-blue-600 text-2xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">HDK</h4>
-                            <ul class="space-y-3 mb-6">
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
-                                    <span>Wing-M130A RTL代码</span>
+                            <h4 class="text-2xl font-extrabold mb-4 text-slate-800 border-b border-slate-200 pb-2">HDK</h4>
+                            <ul class="space-y-4 mb-2">
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-red-50 text-red-500 flex items-center justify-center mr-3"><i class="fa fa-file-pdf-o"></i></div>
+                                    <span class="font-medium">Wing-M130A RTL代码</span>
                                 </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
-                                    <span>仿真验证环境</span>
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-blue-50 text-blue-500 flex items-center justify-center mr-3"><i class="fa fa-file-text-o"></i></div>
+                                    <span class="font-medium">仿真验证环境</span>
                                 </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
-                                    <span>DC综合参考环境</span>
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-green-50 text-green-500 flex items-center justify-center mr-3"><i class="fa fa-file-code-o"></i></div>
+                                    <span class="font-medium">DC综合参考环境</span>
                                 </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-image-o text-purple-500 mr-2"></i>
-                                    <span>Formality形式验证参考环境</span>
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-purple-50 text-purple-500 flex items-center justify-center mr-3"><i class="fa fa-file-image-o"></i></div>
+                                    <span class="font-medium">Formality形式验证参考环境</span>
                                 </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
-                                    <span>FPGA配置文件</span>
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-orange-50 text-orange-500 flex items-center justify-center mr-3"><i class="fa fa-file-video-o"></i></div>
+                                    <span class="font-medium">FPGA配置文件</span>
                                 </li>
                             </ul>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
-                        style="transition-delay: 0.2s">
-                        <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-sitemap text-primary text-xl"></i>
+                    <div class="glass-panel rounded-2xl border border-white shadow-sm hover:shadow-lg transition-all duration-300 overflow-hidden hover-float animate-fade-in" style="transition-delay: 0.2s">
+                        <div class="p-8">
+                            <div class="w-14 h-14 bg-sky-100 rounded-xl flex items-center justify-center mb-6 border border-sky-200 shadow-sm">
+                                <i class="fa fa-sitemap text-sky-600 text-2xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">SDK</h4>
-                            <ul class="space-y-3 mb-6">
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
-                                    <span>Wing IDE</span>
+                            <h4 class="text-2xl font-extrabold mb-4 text-slate-800 border-b border-slate-200 pb-2">SDK</h4>
+                            <ul class="space-y-4 mb-2">
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-red-50 text-red-500 flex items-center justify-center mr-3"><i class="fa fa-file-pdf-o"></i></div>
+                                    <span class="font-medium">Wing IDE</span>
                                 </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
-                                    <span>编译工具链</span>
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-blue-50 text-blue-500 flex items-center justify-center mr-3"><i class="fa fa-file-text-o"></i></div>
+                                    <span class="font-medium">编译工具链</span>
                                 </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
-                                    <span>调试器</span>
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-green-50 text-green-500 flex items-center justify-center mr-3"><i class="fa fa-file-code-o"></i></div>
+                                    <span class="font-medium">调试器</span>
                                 </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-image-o text-purple-500 mr-2"></i>
-                                    <span>BSP</span>
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-purple-50 text-purple-500 flex items-center justify-center mr-3"><i class="fa fa-file-image-o"></i></div>
+                                    <span class="font-medium">BSP</span>
                                 </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
-                                    <span>IA/CA 仿真器</span>
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-orange-50 text-orange-500 flex items-center justify-center mr-3"><i class="fa fa-file-video-o"></i></div>
+                                    <span class="font-medium">IA/CA 仿真器</span>
                                 </li>
                             </ul>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
-                        style="transition-delay: 0.4s">
-                        <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-code text-primary text-xl"></i>
+                    <div class="glass-panel rounded-2xl border border-white shadow-sm hover:shadow-lg transition-all duration-300 overflow-hidden hover-float animate-fade-in" style="transition-delay: 0.4s">
+                        <div class="p-8">
+                            <div class="w-14 h-14 bg-indigo-100 rounded-xl flex items-center justify-center mb-6 border border-indigo-200 shadow-sm">
+                                <i class="fa fa-code text-indigo-600 text-2xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">文档</h4>
-                            <ul class="space-y-3 mb-6">
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
-                                    <span>Wing-M130A 处理器技术文档</span>
+                            <h4 class="text-2xl font-extrabold mb-4 text-slate-800 border-b border-slate-200 pb-2">文档</h4>
+                            <ul class="space-y-4 mb-2">
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-red-50 text-red-500 flex items-center justify-center mr-3"><i class="fa fa-file-pdf-o"></i></div>
+                                    <span class="font-medium">Wing-M130A 处理器技术文档</span>
                                 </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
-                                    <span>Wing-M130A 处理器集成文档</span>
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-blue-50 text-blue-500 flex items-center justify-center mr-3"><i class="fa fa-file-text-o"></i></div>
+                                    <span class="font-medium">Wing-M130A 处理器集成文档</span>
                                 </li>
-                                <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
-                                    <span>Wing-M130A SDK手册</span>
+                                <li class="flex items-center text-slate-700 bg-white/60 p-2 rounded-lg shadow-sm border border-slate-100">
+                                    <div class="w-8 h-8 rounded bg-green-50 text-green-500 flex items-center justify-center mr-3"><i class="fa fa-file-code-o"></i></div>
+                                    <span class="font-medium">Wing-M130A SDK手册</span>
                                 </li>
                             </ul>
                         </div>
@@ -548,9 +568,9 @@
     <!-- 咨询按钮 -->
     <div class="fixed bottom-12 right-12 z-50 popupbox">
         <button id="consult-button"
-            class="bg-primary hover:bg-primary/90 text-slate-800 py-5 px-8 rounded-full shadow-xl transform transition-all duration-300 hover:scale-110 flex items-center gap-3 text-lg">
+            class="bg-blue-600 hover:bg-blue-700 text-white py-5 px-8 rounded-full shadow-lg hover:shadow-xl transform transition-all duration-300 hover:-translate-y-1 flex items-center gap-3 text-lg font-bold border border-blue-500 hover:border-blue-400 focus:outline-none focus:ring-4 focus:ring-blue-100">
             <i class="fa fa-comments-o text-2xl"></i>
-            <span class="font-bold">立刻咨询</span>
+            <span>立刻咨询</span>
         </button>
     </div>
 
diff --git a/Wing-M130s安全核.html b/Wing-M130s安全核.html
index 5c1a351..933ea8f 100644
--- a/Wing-M130s安全核.html
+++ b/Wing-M130s安全核.html
@@ -6,57 +6,85 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>产品详情 - 隼瞻科技</title>
 
+    <!-- Tailwind (kept, may be used for layout utilities) -->
     <script src="https://cdn.tailwindcss.com"></script>
+
+    <!-- Font Awesome & Font -->
     <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
-    <script>
-        tailwind.config = {
-            theme: {
-                extend: {
-                    colors: { primary: '#3b82f6', secondary: '#2563eb', accent: '#60a5fa' },
-                    fontFamily: { inter: ['Inter', 'sans-serif'] }
-                }
-            }
-        }
-    </script>
+    <!-- Main styles -->
     <style type="text/tailwindcss">
         @layer utilities {
             .glass-panel {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
-                backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
+                backdrop-filter: blur(16px);
+                -webkit-backdrop-filter: blur(16px);
                 border: 1px solid rgba(255, 255, 255, 0.9);
                 box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
             }
             .glass-panel-light {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
-                backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
                 border: 1px solid rgba(255, 255, 255, 1);
                 box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
             }
-            .text-gradient {
+            .gradient-text {
                 background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
-                -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
+                -webkit-background-clip: text;
+                -webkit-text-fill-color: transparent;
+                background-clip: text;
+            }
+            .text-shadow {
+                text-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+            }
+            .product-feature-card {
+                transition: all 0.3s ease;
+            }
+            .product-feature-card:hover {
+                transform: translateY(-5px);
+            }
+            .section-active {
+                color: #2563eb !important;
+                border-bottom: 2px solid #2563eb !important;
+            }
+            .animate-fade-in {
+                opacity: 0;
+                transform: translateY(20px);
+                transition: opacity 0.6s ease-out, transform 0.6s ease-out;
+            }
+            .animate-fade-in.visible {
+                opacity: 1;
+                transform: translateY(0);
+            }
+            .hover-float {
+                transition: transform 0.3s ease, box-shadow 0.3s ease;
+            }
+            .hover-float:hover {
+                transform: translateY(-5px);
             }
         }
-        
-        #sj-product-page { font-family: 'Inter', sans-serif; color: #1e293b; background-color: transparent !important; }
-        #sj-product-page a { color: #3b82f6; transition: color 0.3s ease; }
-        #sj-product-page a:hover { color: #2563eb; }
-        .section-active { color: #2563eb !important; border-bottom: 2px solid #2563eb !important; }
-        .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
-        .hover-float:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1); }
-        .animate-fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
-        .animate-fade-in.visible { opacity: 1; transform: translateY(0); }
-        
-        .bg-grid {
-            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233b82f6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
-        }
     </style>
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#3b82f6',
+                        secondary: '#2563eb',
+                        accent: '#60a5fa',
+                    },
+                    fontFamily: {
+                        inter: ['Inter', 'sans-serif'],
+                    },
+                },
+            }
+        }
+    </script>
 </head>
 
-<body class="bg-slate-50 text-slate-800 font-inter antialiased overflow-x-hidden w-full">
-
+<body class="bg-slate-50 text-slate-800 font-inter antialiased">
     <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
     <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
         <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
@@ -66,45 +94,44 @@
     </div>
 
     <!-- Wrapper with an ID so we can scope styles and avoid WP theme interference -->
-    <div id="sj-product-page" class="relative z-10 w-full min-h-screen">
+    <div id="sj-product-page" class="min-h-screen relative z-10">
 
         <!-- 产品页面头部 -->
-        <section class="pt-24 md:pt-32 pb-16 md:pb-24 bg-gradient-to-br gradient-animate"
-            style="background: linear-gradient(135deg, rgba(248,250,252,0.95), rgba(239,246,255,1)); overflow:hidden;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section class="pt-24 md:pt-32 pb-16 md:pb-24 relative overflow-hidden">
+            <div class="absolute top-0 left-1/2 -translate-x-1/2 w-[80%] h-64 bg-primary/10 blur-[120px] rounded-full pointer-events-none"></div>
+            
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto text-center">
-                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-bold text-slate-800 leading-tight text-shadow mb-6">
+                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-extrabold text-slate-800 leading-tight drop-shadow-sm mb-6">
                         安全处理器IP
                     </h1>
-                    <div class="bg-primary-20 inline-block px-6 pt-4 rounded-full mb-6 animate-fade-in">
-                        <h2 class="text-xl font-semibold text-primary">Wing-M Series</h2>
+                    <div class="glass-panel-light inline-flex items-center space-x-2 px-6 py-2 rounded-full border border-blue-200 mb-6 shadow-sm animate-fade-in">
+                        <h2 class="text-xl font-bold text-blue-700">Wing-M Series</h2>
                     </div>
-                    <h3 class="text-2xl md:text-3xl font-bold text-slate-800 mb-8">Wing-M130S安全核 Processor IP</h3>
-                    <p class="text-lg md:text-xl text-slate-600 mb-8 max-w-2xl mx-auto" style="line-height:1.6;">
-                        Wing-M130S是一款专为物理安全、信息安全设计的超低功耗嵌入式RISC-V处理器IP。其不仅继承了Wing-M130S的32
-                        位、单发射、3级流水线、支持浮点应用等特性，具备业界领先的同级别处理器性能。同时，它也充分考量了功耗和成本两者之间的平衡，并且兼容现存所有 RISC-V 工具。该处理器可以对标ARM
-                        Secure CPU SC300，适用于移动支付，多媒体以及移动存储等安全需求领域。
+                    <h3 class="text-2xl md:text-3xl font-extrabold text-slate-800 mb-8 gradient-text inline-block">Wing-M130S Processor IP</h3>
+
+                    <p class="text-lg md:text-xl text-slate-600 font-medium mb-8 max-w-2xl mx-auto leading-relaxed">
+                        Wing-M130S是一款专为物理安全、信息安全设计的超低功耗嵌入式RISC-V处理器IP。其不仅继承了Wing-M130A的32位、单发射、3级流水线、支持浮点应用等特性，具备业界领先的同级别处理器性能。同时，它也充分考量了功耗和成本两者之间的平衡，并且兼容现存所有 RISC-V 工具。该处理器可以对标ARM Secure CPU SC300，适用于移动支付，多媒体以及移动存储等安全需求领域。
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto" style="background-color:var(--primary); height:4px;"></div>
                 </div>
             </div>
         </section>
 
         <!-- 1. 架构 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+        <section id="architecture" class="section-content py-16 relative z-10" >
             <div class="container mx-auto px-4 md:px-6 lg:px-8">
                 <div class="max-w-4xl mx-auto mb-16">
                     <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">架构</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <!-- 架构大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
+                <div class="max-w-4xl mx-auto relative z-10er rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
                     <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
+                        >
                         <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-M130S 处理器IP架构</h3>
                     </div>
                     <div class="p-4">
@@ -116,79 +143,79 @@
         </section>
 
         <!-- 2. 产品参数 -->
-        <section id="specifications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+        <section id="specifications" class="section-content py-16 relative z-10" >
             <div class="container mx-auto px-4 md:px-6 lg:px-8">
                 <div class="max-w-4xl mx-auto mb-16">
                     <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品参数</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M130S Processor IP的详细技术参数，为您提供全面的产品信息
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
+                <div class="relative z-10er rounded-xl shadow-md p-8 animate-fade-in">
                     <h3 class="text-2xl font-bold mb-6 text-slate-800">性能基准测试</h3>
                     <div class="grid md:grid-cols-2 gap-6">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">Dhrystone</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">2.23（Legal）</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold text-2xl">Dhrystone</span>
+                                <span class="font-medium text-2xl" class="font-extrabold text-emerald-500">2.23（Legal）</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 text-2xl">Coremark</span>
-                                <span class="font-medium text-2xl" style="color: #4cd6b4;">4.47</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold text-2xl">Coremark</span>
+                                <span class="font-medium text-2xl" class="font-extrabold text-emerald-500">4.47</span>
                             </div>
                         </div>
                     </div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
+                <div class="relative z-10er rounded-xl shadow-md p-8 animate-fade-in">
                     <h3 class="text-xl font-bold mb-6 text-slate-800">功能参数</h3>
                     <div class="grid md:grid-cols-2 gap-6">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">基础ISA</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">基础ISA</span>
                                 <span class="font-medium text-slate-800">RV32EB_zifencei_zicsr_zce_zicond</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">乘除法</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">乘除法</span>
                                 <span class="font-medium text-slate-800">可配置M-ext/zmmul</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Codesize 增强</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Codesize 增强</span>
                                 <span class="font-medium text-slate-800">支持隼瞻自定义代码密度增强</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">安全特性</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">安全特性</span>
                                 <span class="font-medium text-slate-800">寄存器保护:防数据泄露攻击;防功耗攻击:调试接口保护</span>
                             </div>
                             <div class="flex justify-between">
-                                <span class="text-slate-500">浮点</span>
+                                <span class="text-slate-500 font-bold">浮点</span>
                                 <span class="font-medium text-slate-800">支持zfinx</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">特权模式</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">特权模式</span>
                                 <span class="font-medium text-slate-800">支持M-mode和U-mode</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Debug</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Debug</span>
                                 <span class="font-medium text-slate-800">支持可配置2线或者4线JTAG</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">中断</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">中断</span>
                                 <span class="font-medium text-slate-800">支持矢量中断，支持快速的中断现场切换</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">面积</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">面积</span>
                                 <span class="font-medium text-slate-800">78k-82k</span>
                             </div>
                             <div class="flex justify-between">
-                                <span class="text-slate-500">Trace</span>
+                                <span class="text-slate-500 font-bold">Trace</span>
                                 <span class="font-medium text-slate-800">支持</span>
                             </div>
                         </div>
@@ -198,19 +225,19 @@
         </section>
 
         <!-- 3. 产品特点 -->
-        <section id="features" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+        <section id="features" class="section-content py-16 relative z-10" >
             <div class="container mx-auto px-4 md:px-6 lg:px-8">
                 <div class="max-w-4xl mx-auto mb-16">
                     <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品特点</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <div class="space-y-6 max-w-4xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 border border-blue-200 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
                                 <h4 class="text-xl font-bold text-slate-800">
@@ -219,10 +246,10 @@
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 border border-blue-200 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
                                 <h4 class="text-xl font-bold text-slate-800">支持多样化的在线/离线调试手段，可快速定位并解决故障</h4>
@@ -230,10 +257,10 @@
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 border border-blue-200 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
                                 <h4 class="text-xl font-bold text-slate-800">
@@ -242,10 +269,10 @@
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 border border-blue-200 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
                                 <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研中断实时性增强技术，提供优异的中断切换效率和中断处理实时性
@@ -254,10 +281,10 @@
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 border border-blue-200 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
                                 <h4 class="text-xl font-bold text-slate-800">支持隼瞻科技自研代码压缩技术，直击RISC-V基础架构代码膨胀问题
@@ -266,10 +293,10 @@
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 border border-blue-200 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
                                 <h4 class="text-xl font-bold text-slate-800">拥有超低功耗与极小面积，实现极优面效比与能效比</h4>
@@ -279,10 +306,10 @@
 
 
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="bg-blue-100 border border-blue-200 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-blue-600"></i>
                             </div>
                             <div class="ml-4">
                                 <h4 class="text-xl font-bold text-slate-800">满足车规ISO26262 ASIL-D要求</h4>
@@ -294,50 +321,50 @@
         </section>
 
         <!-- 1. 应用场景 -->
-        <section id="applications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+        <section id="applications" class="section-content py-16 relative z-10" >
             <div class="container mx-auto px-4 md:px-6 lg:px-8">
                 <div class="max-w-4xl mx-auto mb-16">
                     <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">应用场景</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M130S处理器IP凭借其高性能、高安全性特性，广泛应用于以下领域
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <!-- 应用场景标签 -->
                 <div class="flex flex-wrap justify-center gap-4 max-w-5xl mx-auto mb-16">
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2">
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2">
                         <i class="fa fa-car"></i> 汽车电子
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
                         style="transition-delay: 0.1s">
                         <i class="fa fa-credit-card"></i> SIM卡
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
                         style="transition-delay: 0.2s">
                         <i class="fa fa-shield"></i> 网络安全
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
                         style="transition-delay: 0.3s">
                         <i class="fa fa-building"></i> 企业应用
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
                         style="transition-delay: 0.4s">
                         <i class="fa fa-exchange"></i> 移动支付
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
                         style="transition-delay: 0.5s">
                         <i class="fa fa-music"></i> 多媒体
                     </span>
                     <span
-                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        class="bg-blue-50 border border-blue-100 text-blue-600 px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
                         style="transition-delay: 0.6s">
                         <i class="fa fa-lock"></i> 安全存储
                     </span>
@@ -345,98 +372,98 @@
 
                 <!-- 详细应用场景描述 -->
                 <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 max-w-6xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-car text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-car text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">汽车电子</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     为车载信息娱乐系统、ADAS安全模块和车身控制系统提供高安全性处理能力，满足车规安全要求，保障车辆运行安全。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-credit-card text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-credit-card text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">SIM卡</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     为SIM卡和eSIM芯片提供极小面积、高安全性的处理核心，支持加密算法加速，保障用户身份认证和通信安全。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-shield text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-shield text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">网络安全</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     作为网络安全设备的安全核心，支持数据加密/解密、防火墙功能和入侵检测，为网络通信提供端到端的安全保障。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-building text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-building text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">企业应用</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     为企业级安全管理系统、密钥管理服务器和访问控制系统提供高可靠的安全处理能力，保护企业核心数据资产。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-exchange text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-exchange text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">移动支付</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     为移动支付终端和安全芯片提供强大的密码学运算能力，支持快速安全的交易处理，防止交易信息泄露和篡改。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-music text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-music text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">多媒体</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     为多媒体设备提供内容保护和版权管理功能，支持DRM加密和媒体数据安全传输，防止数字内容被盗版。
                                 </p>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.6s">
+                    <div class="relative z-10er p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.6s">
                         <div class="flex items-start mb-4">
-                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
-                                <i class="fa fa-lock text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-lock text-blue-600 text-xl"></i>
                             </div>
                             <div>
                                 <h4 class="text-xl font-bold mb-2 text-slate-800">安全存储</h4>
-                                <p class="text-slate-600">
+                                <p class="text-slate-600 font-medium">
                                     为安全存储设备提供数据加密和访问控制功能，保护敏感数据不被未授权访问，支持多种加密算法和密钥管理机制。
                                 </p>
                             </div>
@@ -447,20 +474,20 @@
         </section>
 
         <!-- 4. 安全 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+        <section id="architecture" class="section-content py-16 relative z-10" >
             <div class="container mx-auto px-4 md:px-6 lg:px-8">
                 <div class="max-w-4xl mx-auto mb-16">
                     <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">安全</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <!-- 安全特性大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
+                <div class="max-w-4xl mx-auto relative z-10er rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
                     <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
+                        >
                         <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-M130S的安全特性</h3>
                     </div>
                     <div class="p-4">
@@ -472,23 +499,23 @@
         </section>
 
         <!-- 5. 交付包 -->
-        <section id="documentation" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+        <section id="documentation" class="section-content py-16 relative z-10" >
             <div class="container mx-auto px-4 md:px-6 lg:px-8">
                 <div class="max-w-4xl mx-auto mb-16">
                     <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">交付包</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         隼瞻科技提供全面的技术文档，帮助客户快速了解和使用我们的产品
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
                     <div
-                        class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
+                        class="relative z-10er rounded-xl border border-white shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-microchip text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-lg flex items-center justify-center mb-4">
+                                <i class="fa fa-microchip text-blue-600 text-xl"></i>
                             </div>
                             <h4 class="text-xl font-bold mb-3 text-slate-800">HDK</h4>
                             <ul class="space-y-3 mb-6">
@@ -516,11 +543,11 @@
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
+                    <div class="relative z-10er rounded-xl border border-white shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
                         style="transition-delay: 0.2s">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-sitemap text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-lg flex items-center justify-center mb-4">
+                                <i class="fa fa-sitemap text-blue-600 text-xl"></i>
                             </div>
                             <h4 class="text-xl font-bold mb-3 text-slate-800">SDK</h4>
                             <ul class="space-y-3 mb-6">
@@ -548,11 +575,11 @@
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
+                    <div class="relative z-10er rounded-xl border border-white shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
                         style="transition-delay: 0.4s">
                         <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-code text-primary text-xl"></i>
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-lg flex items-center justify-center mb-4">
+                                <i class="fa fa-code text-blue-600 text-xl"></i>
                             </div>
                             <h4 class="text-xl font-bold mb-3 text-slate-800">文档</h4>
                             <ul class="space-y-3 mb-6">
@@ -580,9 +607,9 @@
     <!-- 咨询按钮 -->
     <div class="fixed bottom-12 right-12 z-50 popupbox">
         <button id="consult-button"
-            class="bg-primary hover:bg-primary/90 text-slate-800 py-5 px-8 rounded-full shadow-xl transform transition-all duration-300 hover:scale-110 flex items-center gap-3 text-lg">
+            class="bg-blue-600 hover:bg-blue-700 text-white py-5 px-8 rounded-full shadow-xl transform transition-all duration-300 hover:scale-110 flex items-center gap-3 text-lg">
             <i class="fa fa-comments-o text-2xl"></i>
-            <span class="font-bold">立刻咨询</span>
+            <span >立刻咨询</span>
         </button>
     </div>
 
diff --git a/Wing-M510.html b/Wing-M510.html
index 3aa93c2..13f8943 100644
--- a/Wing-M510.html
+++ b/Wing-M510.html
@@ -10,53 +10,78 @@
     <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
-    <script>
-        tailwind.config = {
-            theme: {
-                extend: {
-                    colors: { primary: '#3b82f6', secondary: '#2563eb', accent: '#60a5fa' },
-                    fontFamily: { inter: ['Inter', 'sans-serif'] }
-                }
-            }
-        }
-    </script>
+    <!-- Main styles -->
     <style type="text/tailwindcss">
         @layer utilities {
             .glass-panel {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
-                backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
+                backdrop-filter: blur(16px);
+                -webkit-backdrop-filter: blur(16px);
                 border: 1px solid rgba(255, 255, 255, 0.9);
                 box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
             }
             .glass-panel-light {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
-                backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
                 border: 1px solid rgba(255, 255, 255, 1);
                 box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
             }
-            .text-gradient {
+            .gradient-text {
                 background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
-                -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
+                -webkit-background-clip: text;
+                -webkit-text-fill-color: transparent;
+                background-clip: text;
+            }
+            .text-shadow {
+                text-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+            }
+            .product-feature-card {
+                transition: all 0.3s ease;
+            }
+            .product-feature-card:hover {
+                transform: translateY(-5px);
+            }
+            .section-active {
+                color: #2563eb !important;
+                border-bottom: 2px solid #2563eb !important;
+            }
+            .animate-fade-in {
+                opacity: 0;
+                transform: translateY(20px);
+                transition: opacity 0.6s ease-out, transform 0.6s ease-out;
+            }
+            .animate-fade-in.visible {
+                opacity: 1;
+                transform: translateY(0);
+            }
+            .hover-float {
+                transition: transform 0.3s ease, box-shadow 0.3s ease;
+            }
+            .hover-float:hover {
+                transform: translateY(-5px);
             }
         }
-        
-        #sj-product-page { font-family: 'Inter', sans-serif; color: #1e293b; background-color: transparent !important; }
-        #sj-product-page a { color: #3b82f6; transition: color 0.3s ease; }
-        #sj-product-page a:hover { color: #2563eb; }
-        .section-active { color: #2563eb !important; border-bottom: 2px solid #2563eb !important; }
-        .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
-        .hover-float:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1); }
-        .animate-fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
-        .animate-fade-in.visible { opacity: 1; transform: translateY(0); }
-        
-        .bg-grid {
-            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233b82f6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
-        }
     </style>
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#3b82f6',
+                        secondary: '#2563eb',
+                        accent: '#60a5fa',
+                    },
+                    fontFamily: {
+                        inter: ['Inter', 'sans-serif'],
+                    },
+                },
+            }
+        }
+    </script>
 </head>
 
-<body class="bg-slate-50 text-slate-800 font-inter antialiased overflow-x-hidden w-full">
-
+<body class="bg-slate-50 text-slate-800 font-inter antialiased">
     <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
     <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
         <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
@@ -66,120 +91,124 @@
     </div>
 
     <!-- Wrapper with an ID so we can scope styles and avoid WP theme interference -->
-    <div id="sj-product-page" class="relative z-10 w-full min-h-screen">
+    <div id="sj-product-page" class="min-h-screen relative z-10">
 
         <!-- 产品页面头部 -->
-        <section class="pt-24 md:pt-32 pb-16 md:pb-24 bg-gradient-to-br gradient-animate"
-            style="background: linear-gradient(135deg, rgba(248,250,252,0.95), rgba(239,246,255,1)); overflow:hidden;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section class="pt-24 md:pt-32 pb-16 md:pb-24 relative overflow-hidden">
+            <div class="absolute top-0 left-1/2 -translate-x-1/2 w-[80%] h-64 bg-primary/10 blur-[120px] rounded-full pointer-events-none"></div>
+            
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto text-center">
-                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-bold text-slate-800 leading-tight text-shadow mb-6">
+                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-extrabold text-slate-800 leading-tight drop-shadow-sm mb-6">
                         通用处理器IP
                     </h1>
-                    <div class="bg-primary-20 inline-block px-6 pt-4 rounded-full mb-6 animate-fade-in">
-                        <h2 class="text-xl font-semibold text-primary">Wing-M Series</h2>
+                    <div class="glass-panel-light inline-flex items-center space-x-2 px-6 py-2 rounded-full border border-blue-200 mb-6 shadow-sm animate-fade-in">
+                        <h2 class="text-xl font-bold text-blue-700">Wing-M Series</h2>
                     </div>
-                    <h3 class="text-2xl md:text-3xl font-bold text-slate-800 mb-8">Wing-M510 Processor IP</h3>
-                    <p class="text-lg md:text-xl text-slate-600 mb-8 max-w-2xl mx-auto" style="line-height:1.6;">
+                    <h3 class="text-2xl md:text-3xl font-extrabold text-slate-800 mb-8 gradient-text inline-block">Wing-M510 Processor IP</h3>
+
+                    <p class="text-lg md:text-xl text-slate-600 font-medium mb-8 max-w-2xl mx-auto leading-relaxed">
                         Wing-M510是基于RISC-V架构的32位、双发射、8级流水，面向高可靠性高实时性的微控制器。其可支持Vector指令集扩展，满足车规ASIL-B/ASIL-D功能安全等级需求，具备强中断实时性处理能力，适用于汽车域控制器、存储设备、多媒体、工控以及网络设备（Wifi/5G）等领域。
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto" style="background-color:var(--primary); height:4px;"></div>
                 </div>
             </div>
         </section>
 
         <!-- 1. 架构 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="architecture" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">架构</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">架构</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <!-- 架构大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
-                    <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
-                        <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-M510 处理器IP架构</h3>
+                <div class="max-w-4xl mx-auto glass-panel rounded-3xl shadow-md border border-white hover:shadow-lg transition-shadow overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6 bg-slate-50 border-b border-slate-200">
+                        <h3 class="text-2xl font-extrabold text-slate-800 text-center">Wing-M510 处理器IP架构</h3>
                     </div>
-                    <div class="p-4">
+                    <div class="p-4 bg-white/50 backdrop-blur-sm">
                         <img src="https://www.beiyuxing.live/wp-content/uploads/2025/11/whiteboard_exported_image-20.png"
-                            alt="Wing-M510 Processor IP架构图" class="w-full h-auto rounded-lg" />
+                            alt="Wing-M510 Processor IP架构图" class="w-full h-auto rounded-2xl" />
                     </div>
                 </div>
             </div>
         </section>
 
         <!-- 3. 产品参数 -->
-        <section id="specifications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="specifications" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品参数</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">产品参数</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         Wing-M510 Processor IP的详细技术参数，为您提供全面的产品信息
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-2xl font-bold mb-6 text-slate-800">性能基准测试</h3>
+                <div class="glass-panel-light border border-white rounded-3xl shadow-sm p-8 animate-fade-in hover:shadow-md transition-shadow mb-8">
+                    <h3 class="text-2xl font-extrabold mb-6 text-slate-800 flex items-center">
+                        <div class="w-2 h-6 bg-blue-500 rounded-full mr-3"></div> 性能基准测试
+                    </h3>
                     <div class="grid md:grid-cols-2 gap-6">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 font-bold text-2xl">Dhrystone</span>
-                                <span class="font-bold text-2xl" style="color: #4cd6b4;">3.0 (legal)</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200">
+                                <span class="text-slate-500 font-bold text-xl">Dhrystone</span>
+                                <span class="font-extrabold text-2xl text-emerald-500">3.0 (legal)</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500 font-bold text-2xl">Coremark</span>
-                                <span class="font-bold text-2xl" style="color: #4cd6b4;">5.5</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200">
+                                <span class="text-slate-500 font-bold text-xl">Coremark</span>
+                                <span class="font-extrabold text-2xl text-emerald-500">5.5</span>
                             </div>
                         </div>
                     </div>
                 </div>
 
-                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
-                    <h3 class="text-xl font-bold mb-6 text-slate-800">功能参数</h3>
-                    <span class="font-bold text-xl" style="color: #4cd6b4;">支持1-4核的多核配置</span>
-                    <div class="grid md:grid-cols-2 gap-6 pt-4">
+                <div class="glass-panel-light border border-white rounded-3xl shadow-sm p-8 animate-fade-in hover:shadow-md transition-shadow">
+                    <h3 class="text-xl font-extrabold mb-6 text-slate-800 flex items-center mb-2">
+                         <div class="w-2 h-6 bg-sky-500 rounded-full mr-3"></div> 功能参数
+                    </h3>
+                    <span class="font-extrabold text-xl text-emerald-500 mb-6 block ml-5">支持1-4核的多核配置</span>
+                    <div class="grid md:grid-cols-2 gap-6 pt-2">
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">ISA</span>
-                                <span class="font-medium text-slate-800">RV32IMBAFDV_zce_zicond</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">ISA</span>
+                                <span class="font-bold text-slate-700">RV32IMBAFDV_zce_zicond</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Micro Arch</span>
-                                <span class="font-medium text-slate-800">8-stage, In-order, two-issue</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Micro Arch</span>
+                                <span class="font-bold text-slate-700">8-stage, In-order, two-issue</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Function Safety</span>
-                                <span class="font-medium text-slate-800">ASIL-B (Split Mode), ASIL-D</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Function Safety</span>
+                                <span class="font-bold text-slate-700">ASIL-B (Split Mode), ASIL-D</span>
                             </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">Privilege Mode</span>
-                                <span class="font-medium text-slate-800">Machine, Supervisor and User Mode,</br> supporting
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Privilege Mode</span>
+                                <span class="font-bold text-slate-700 text-right">Machine, Supervisor and User Mode,</br> supporting
                                     Hypervisor</span>
                             </div>
                         </div>
                         <div class="space-y-4">
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Ext. Interrupts</span>
-                                <span class="font-medium text-slate-800">Up to 4064 IRQs</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Ext. Interrupts</span>
+                                <span class="font-bold text-slate-700">Up to 4064 IRQs</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">Debug</span>
-                                <span class="font-medium text-slate-800">JTAG/APB</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Debug</span>
+                                <span class="font-bold text-slate-700">JTAG/APB</span>
                             </div>
-                            <div class="flex justify-between pb-3 border-b border-gray-100">
-                                <span class="text-slate-500">External Bus</span>
-                                <span class="font-medium text-slate-800">2x AHB/AXI</span>
+                            <div class="flex justify-between pb-3 border-b border-slate-200 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">External Bus</span>
+                                <span class="font-bold text-slate-700">2x AHB/AXI</span>
                             </div>
-                            <div class="flex justify-between">
-                                <span class="text-slate-500">Memory System</span>
-                                <span class="font-medium text-slate-800">I/D Cache(up to 64KB)；I/D TCM(up to
+                            <div class="flex justify-between pb-1 hover:bg-slate-50/50 transition-colors rounded-lg px-2 -mx-2">
+                                <span class="text-slate-500 font-bold">Memory System</span>
+                                <span class="font-bold text-slate-700 text-right">I/D Cache(up to 64KB)；I/D TCM(up to
                                     128KB)</br>Shared L2 memory</br>Optional Memory Protect Unit (PMP)</span>
                             </div>
                         </div>
@@ -189,121 +218,119 @@
         </section>
 
         <!-- 2. 产品特点 -->
-        <section id="features" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="features" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品特点</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">产品特点</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <div class="space-y-6 max-w-4xl mx-auto">
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">领先的处理器架构性能，强大的控制及运算能力，支持RVV指令集扩展</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">领先的处理器架构性能，强大的控制及运算能力，支持RVV指令集扩展</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.1s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持INSTEND客制化指令集扩展功能，提升IP的扩展灵活性</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持INSTEND客制化指令集扩展功能，提升IP的扩展灵活性</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.2s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持增强代码密度的扩展指令集，在提升性能的同时有效减少存储需求及能耗
-                                </h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持增强代码密度的扩展指令集，在提升性能的同时有效减少存储需求及能耗</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.3s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持增强的指令和数据跟踪特性，全面提升处理器效率</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持增强的指令和数据跟踪特性，全面提升处理器效率</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.4s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持高实时性和低中断延迟，提供极致的处理器性能</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持高实时性和低中断延迟，提供极致的处理器性能</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.5s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持Hypervisor，可快速部署vRTOS</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持Hypervisor，可快速部署vRTOS</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.6s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.6s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持多核配置，多核共享内存</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持多核配置，多核共享内存</h4>
                             </div>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.7s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持可信执行环境（TEE），提供安全且高效的高性能算力</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持可信执行环境（TEE），提供安全且高效的高性能算力</h4>
                             </div>
                         </div>
                     </div>
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.8s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">支持先进的操作系统与应用迁移技术 WingBridge，提升生态兼容性</h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">支持先进的操作系统与应用迁移技术 WingBridge，提升生态兼容性</h4>
                             </div>
                         </div>
                     </div>
-                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                    <div class="glass-panel-light p-6 rounded-2xl shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in border border-white hover:-translate-y-1" style="transition-delay: 0.9s">
                         <div class="flex items-center">
-                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
-                                <i class="fa fa-check text-primary"></i>
+                            <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center shrink-0 border border-blue-200">
+                                <i class="fa fa-check text-blue-600 text-xl"></i>
                             </div>
-                            <div class="ml-4">
-                                <h4 class="text-xl font-bold text-slate-800">高可靠性，可同时满足车规ASIL-B/ASIL-D等级要求
-                                </h4>
+                            <div class="ml-5">
+                                <h4 class="text-xl font-bold text-slate-700">高可靠性，可同时满足车规ASIL-B/ASIL-D等级要求</h4>
                             </div>
                         </div>
                     </div>
@@ -312,134 +339,135 @@
         </section>
 
         <!-- 5. 优势 -->
-        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <section id="advantages" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">Wing-M510 处理器优势</h2>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">Wing-M510 处理器优势</h2>
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <!-- 大图 -->
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
-                    <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
-                        <h3 class="text-2xl font-bold text-slate-800 text-center">性能优势</h3>
+                <div class="max-w-4xl mx-auto glass-panel rounded-3xl shadow-md border border-white hover:shadow-lg transition-shadow overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6 bg-slate-50 border-b border-slate-200">
+                        <h3 class="text-2xl font-extrabold text-slate-800 text-center">性能优势</h3>
                     </div>
-                    <div class="p-4">
+                    <div class="p-4 bg-white/50 backdrop-blur-sm">
                         <img src="https://www.beiyuxing.live/wp-content/uploads/2025/11/性能优势.png"
-                            alt="Wing-M510 Processor IP架构图" class="w-full h-auto rounded-lg" />
+                            alt="Wing-M510 Processor IP性能优势" class="w-full h-auto rounded-2xl" />
                     </div>
                 </div>
-                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
-                    <div class="p-6"
-                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
-                        <h3 class="text-2xl font-bold text-slate-800 text-center">实时性优势</h3>
+                <div class="max-w-4xl mx-auto glass-panel rounded-3xl shadow-md border border-white hover:shadow-lg transition-shadow overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6 bg-slate-50 border-b border-slate-200">
+                        <h3 class="text-2xl font-extrabold text-slate-800 text-center">实时性优势</h3>
                     </div>
-                    <div class="p-4">
+                    <div class="p-4 bg-white/50 backdrop-blur-sm">
                         <img src="https://www.beiyuxing.live/wp-content/uploads/2025/11/未标题-2.png"
-                            alt="Wing-M510 Processor IP架构图" class="w-full h-auto rounded-lg" />
+                            alt="Wing-M510 Processor IP实时性优势" class="w-full h-auto rounded-2xl" />
                     </div>
                 </div>
             </div>
         </section>
 
-        <!-- 5. 交付包 -->
-        <section id="documentation" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
-            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+        <!-- 6. 交付包 -->
+        <section id="documentation" class="section-content py-16 relative">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                 <div class="max-w-4xl mx-auto mb-16">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">交付包</h2>
-                    <p class="text-slate-600 mb-6 text-center">
+                    <h2 class="text-3xl md:text-4xl font-extrabold mb-6 text-slate-800 text-center drop-shadow-sm">交付包</h2>
+                    <p class="text-slate-600 font-medium mb-6 text-center">
                         隼瞻科技提供全面的技术文档，帮助客户快速了解和使用我们的产品
                     </p>
-                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    <div class="w-24 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto mb-12 rounded-full">
                     </div>
                 </div>
 
                 <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
-                    <div
-                        class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
-                        <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-microchip text-primary text-xl"></i>
+                    <!-- HDK -->
+                    <div class="glass-panel-light rounded-3xl shadow-sm hover:shadow-md transition-all duration-300 overflow-hidden hover-float animate-fade-in border border-white">
+                        <div class="p-8">
+                            <div class="w-14 h-14 bg-gradient-to-br from-blue-100 to-blue-50 rounded-2xl flex items-center justify-center mb-6 border border-blue-100 shadow-sm">
+                                <i class="fa fa-microchip text-blue-600 text-2xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">HDK</h4>
-                            <ul class="space-y-3 mb-6">
+                            <h4 class="text-xl font-extrabold mb-4 text-slate-800">HDK</h4>
+                            <div class="w-12 h-1 bg-blue-500 rounded-full mb-6"></div>
+                            <ul class="space-y-4">
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
-                                    <span>Wing-M510 RTL代码</span>
+                                    <i class="fa fa-file-pdf-o text-rose-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">Wing-M510 RTL代码</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
-                                    <span>仿真验证环境</span>
+                                    <i class="fa fa-file-text-o text-blue-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">仿真验证环境</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
-                                    <span>DC综合参考环境</span>
+                                    <i class="fa fa-file-code-o text-emerald-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">DC综合参考环境</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-image-o text-purple-500 mr-2"></i>
-                                    <span>Formality形式验证参考环境</span>
+                                    <i class="fa fa-file-image-o text-indigo-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">Formality形式验证参考环境</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
-                                    <span>FPGA配置文件</span>
+                                    <i class="fa fa-file-video-o text-amber-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">FPGA配置文件</span>
                                 </li>
                             </ul>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
-                        style="transition-delay: 0.2s">
-                        <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-sitemap text-primary text-xl"></i>
+                    <!-- SDK -->
+                    <div class="glass-panel-light rounded-3xl shadow-sm hover:shadow-md transition-all duration-300 overflow-hidden hover-float animate-fade-in border border-white" style="transition-delay: 0.1s">
+                        <div class="p-8">
+                            <div class="w-14 h-14 bg-gradient-to-br from-sky-100 to-sky-50 rounded-2xl flex items-center justify-center mb-6 border border-sky-100 shadow-sm">
+                                <i class="fa fa-sitemap text-sky-600 text-2xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">SDK</h4>
-                            <ul class="space-y-3 mb-6">
+                            <h4 class="text-xl font-extrabold mb-4 text-slate-800">SDK</h4>
+                            <div class="w-12 h-1 bg-sky-500 rounded-full mb-6"></div>
+                            <ul class="space-y-4">
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
-                                    <span>Wing IDE</span>
+                                    <i class="fa fa-file-pdf-o text-rose-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">Wing IDE</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
-                                    <span>编译工具链</span>
+                                    <i class="fa fa-file-text-o text-blue-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">编译工具链</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
-                                    <span>调试器</span>
+                                    <i class="fa fa-file-code-o text-emerald-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">调试器</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-image-o text-purple-500 mr-2"></i>
-                                    <span>BSP</span>
+                                    <i class="fa fa-file-image-o text-indigo-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">BSP</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
-                                    <span>IA/CA 仿真器</span>
+                                    <i class="fa fa-file-video-o text-amber-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">IA/CA 仿真器</span>
                                 </li>
                             </ul>
                         </div>
                     </div>
 
-                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
-                        style="transition-delay: 0.4s">
-                        <div class="p-6">
-                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
-                                <i class="fa fa-code text-primary text-xl"></i>
+                    <!-- 文档 -->
+                    <div class="glass-panel-light rounded-3xl shadow-sm hover:shadow-md transition-all duration-300 overflow-hidden hover-float animate-fade-in border border-white" style="transition-delay: 0.2s">
+                        <div class="p-8">
+                            <div class="w-14 h-14 bg-gradient-to-br from-indigo-100 to-indigo-50 rounded-2xl flex items-center justify-center mb-6 border border-indigo-100 shadow-sm">
+                                <i class="fa fa-file-text text-indigo-600 text-2xl"></i>
                             </div>
-                            <h4 class="text-xl font-bold mb-3 text-slate-800">文档</h4>
-                            <ul class="space-y-3 mb-6">
+                            <h4 class="text-xl font-extrabold mb-4 text-slate-800">文档</h4>
+                            <div class="w-12 h-1 bg-indigo-500 rounded-full mb-6"></div>
+                            <ul class="space-y-4">
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
-                                    <span>Wing-M510 处理器技术文档</span>
+                                    <i class="fa fa-file-pdf-o text-rose-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">Wing-M510 处理器技术文档</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
-                                    <span>Wing-M510 处理器集成文档</span>
+                                    <i class="fa fa-file-text-o text-blue-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">Wing-M510 处理器集成文档</span>
                                 </li>
                                 <li class="flex items-center text-sm">
-                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
-                                    <span>Wing-M510 SDK手册</span>
+                                    <i class="fa fa-file-code-o text-emerald-500 mr-3 w-5 text-center"></i>
+                                    <span class="text-slate-600 font-medium">Wing-M510 SDK手册</span>
                                 </li>
                             </ul>
                         </div>
@@ -451,11 +479,11 @@
     </div> <!-- end #sj-product-page -->
 
     <!-- 咨询按钮 -->
-    <div class="fixed bottom-12 right-12 z-50 popupbox">
+    <div class="fixed bottom-8 right-8 z-50">
         <button id="consult-button"
-            class="bg-primary hover:bg-primary/90 text-slate-800 py-5 px-8 rounded-full shadow-xl transform transition-all duration-300 hover:scale-110 flex items-center gap-3 text-lg">
+            class="bg-blue-600 hover:bg-blue-700 text-white py-4 px-6 rounded-full shadow-[0_10px_25px_-5px_rgba(37,99,235,0.4)] transform transition-all duration-300 hover:-translate-y-2 hover:shadow-[0_20px_25px_-5px_rgba(37,99,235,0.5)] flex items-center gap-3 text-lg font-bold border border-blue-400">
             <i class="fa fa-comments-o text-2xl"></i>
-            <span class="font-bold">立刻咨询</span>
+            <span>立刻咨询</span>
         </button>
     </div>
 
diff --git a/architstudio.html b/architstudio.html
index be3fada..aee6ced 100644
--- a/architstudio.html
+++ b/architstudio.html
@@ -4,59 +4,135 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>产品详情 - 隼瞻科技</title>
+    <title>ArchitStudio 敏捷开发平台 - 隼瞻科技</title>
 
+    <!-- Tailwind CSS -->
     <script src="https://cdn.tailwindcss.com"></script>
+
+    <!-- Font Awesome & Google Fonts -->
     <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
-    <script>
-        tailwind.config = {
-            theme: {
-                extend: {
-                    colors: { primary: '#3b82f6', secondary: '#2563eb', accent: '#60a5fa' },
-                    fontFamily: { inter: ['Inter', 'sans-serif'] }
-                }
-            }
-        }
-    </script>
     <style type="text/tailwindcss">
         @layer utilities {
             .glass-panel {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
-                backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
+                backdrop-filter: blur(16px);
+                -webkit-backdrop-filter: blur(16px);
                 border: 1px solid rgba(255, 255, 255, 0.9);
                 box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
             }
             .glass-panel-light {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
-                backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
                 border: 1px solid rgba(255, 255, 255, 1);
                 box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
             }
-            .text-gradient {
+            .gradient-text {
                 background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
-                -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
+                -webkit-background-clip: text;
+                -webkit-text-fill-color: transparent;
+                background-clip: text;
+            }
+            .text-shadow {
+                text-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
             }
         }
-        
-        #sj-product-page { font-family: 'Inter', sans-serif; color: #1e293b; background-color: transparent !important; }
-        #sj-product-page a { color: #3b82f6; transition: color 0.3s ease; }
-        #sj-product-page a:hover { color: #2563eb; }
-        .section-active { color: #2563eb !important; border-bottom: 2px solid #2563eb !important; }
-        .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
-        .hover-float:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1); }
-        .animate-fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
-        .animate-fade-in.visible { opacity: 1; transform: translateY(0); }
-        
-        .bg-grid {
-            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233b82f6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
+    </style>
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#3b82f6',
+                        secondary: '#2563eb',
+                        accent: '#60a5fa',
+                    },
+                    fontFamily: {
+                        inter: ['Inter', 'sans-serif'],
+                    },
+                },
+            }
         }
+    </script>
+    <style type="text/css">
+        #sj-product-page {
+            font-family: "Inter", sans-serif;
+            color: #1e293b !important;
+            line-height: 1.5;
+            background-color: transparent !important;
+        }
+        
+        #sj-product-page .relative z-10 { background-color: transparent !important; }
+        #sj-product-page .relative z-10 { background-color: transparent !important; }
+        #sj-product-page .text-primary { color: #3b82f6 !important; }
+        #sj-product-page .bg-primary { background-color: #3b82f6 !important; }
+        #sj-product-page .border-primary { border-color: #3b82f6 !important; }
+        #sj-product-page .bg-primary-10 { background-color: rgba(59, 130, 246, 0.1) !important; }
+        #sj-product-page .bg-primary-20 { background-color: rgba(59, 130, 246, 0.2) !important; }
+
+        /* Animations & Utilities */
+        #sj-product-page .animate-fade-in {
+            opacity: 0;
+            transform: translateY(20px);
+            transition: opacity 0.6s ease-out, transform 0.6s ease-out;
+        }
+        #sj-product-page .animate-fade-in.visible {
+            opacity: 1;
+            transform: translateY(0);
+        }
+        #sj-product-page .hover-lift {
+            transition: transform 0.3s ease, box-shadow 0.3s ease;
+        }
+        #sj-product-page .hover-lift:hover {
+            transform: translateY(-5px);
+            box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.15);
+        }
+
+        /* Layout */
+        #sj-product-page .container { max-width: 1280px; margin: 0 auto; padding: 0 1.5rem; }
+        #sj-product-page .max-w-7xl { max-width: 80rem; }
+        #sj-product-page .grid { display: grid; gap: 2rem; }
+        @media (min-width: 768px) {
+            #sj-product-page .md\:grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
+            #sj-product-page .md\:grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
+            #sj-product-page .md\:grid-cols-4 { grid-template-columns: repeat(4, 1fr); }
+        }
+
+        /* Hero */
+        #sj-product-page .hero-bg {
+            position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 0;
+        }
+        #sj-product-page .hero-bg::before {
+            content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
+            background: radial-gradient(circle at 20% 30%, rgba(59, 130, 246, 0.15) 0%, transparent 50%),
+                        radial-gradient(circle at 80% 70%, rgba(139, 92, 246, 0.1) 0%, transparent 50%);
+            animation: heroGradient 20s ease-in-out infinite;
+        }
+        @keyframes heroGradient {
+            0%, 100% { transform: translate(0, 0) rotate(0deg); }
+            50% { transform: translate(5%, 5%) rotate(5deg); }
+        }
+        
+        #sj-product-page .grid-bg {
+            position: absolute; top: 0; left: 0; width: 100%; height: 100%;
+            background-image: linear-gradient(rgba(59, 130, 246, 0.05) 1px, transparent 1px),
+                              linear-gradient(90deg, rgba(59, 130, 246, 0.05) 1px, transparent 1px);
+            background-size: 50px 50px; animation: gridMove 30s linear infinite; z-index: 0;
+        }
+        @keyframes gridMove { 100% { background-position: 50px 50px; } }
+
+        /* Process Steps */
+        #sj-product-page .step-connector {
+            position: absolute; top: 2rem; left: 50%; width: 100%; height: 2px;
+            background: rgba(59, 130, 246, 0.3); z-index: 0; transform: translateX(50%);
+        }
+        #sj-product-page .step-item:last-child .step-connector { display: none; }
     </style>
 </head>
 
-<body class="bg-slate-50 text-slate-800 font-inter antialiased overflow-x-hidden w-full">
-
+<body class="bg-slate-50 text-slate-800 font-inter antialiased">
     <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
     <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
         <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
@@ -65,7 +141,6 @@
         <div class="absolute bottom-[20%] left-[20%] w-[30%] h-[30%] rounded-full bg-blue-100/50 blur-[80px]"></div>
     </div>
 
-
     <div id="sj-product-page" class="min-h-screen relative overflow-hidden">
 
         <!-- 背景装饰 -->
@@ -78,7 +153,7 @@
 
         <!-- 1. 头部 Hero Section -->
         <section id="archit-hero-section"
-            class="relative z-10 pt-24 md:pt-32 pb-16 bg-gradient-to-b from-gray-900 to-gray-950 overflow-hidden">
+            class="relative z-10 pt-24 md:pt-32 pb-16 relative z-10 overflow-hidden">
             <!-- 星座背景Canvas -->
             <canvas id="archit-constellation-canvas" class="absolute top-0 left-0 w-full h-full"
                 style="z-index: 0;"></canvas>
@@ -96,7 +171,7 @@
                     <h1 class="text-5xl md:text-7xl font-black text-slate-800 mb-6 leading-tight tracking-tight">
                         <span class="gradient-text drop-shadow-lg">ArchitStudio</span>
                     </h1>
-                    <p class="text-lg md:text-xl text-slate-600 mb-10 leading-relaxed max-w-3xl mx-auto font-light">
+                    <p class="text-lg md:text-xl text-slate-600 font-medium mb-10 leading-relaxed max-w-3xl mx-auto font-light">
                         基于“算法芯片化，场景架构化”理念，加速 DSA 设计与落地。让开发者摆脱底层繁复工作，一键生成全周期工具链与 SDK，重新定义定制处理器开发。
                     </p>
                     <div class="w-24 h-1 bg-gradient-to-r from-transparent via-primary to-transparent mx-auto rounded-full opacity-70"></div>
@@ -105,7 +180,7 @@
         </section>
 
         <!-- 3. 痛点与桥梁 (对应图片 1: 需求"左移"与方案"右移") -->
-        <section class="relative z-10 py-16 bg-card border-y border-slate-200">
+        <section class="relative z-10 py-16 relative z-10 border-y border-slate-200">
             <div class="container">
                 <div class="max-w-5xl mx-auto">
                     <div class="text-center mb-12 animate-fade-in">
@@ -113,12 +188,12 @@
                         <p class="text-slate-500">打破垂直领域与芯片设计之间的壁垒</p>
                     </div>
 
-                    <div class="relative bg-slate-50 p-8 rounded-2xl border border-slate-200 animate-fade-in">
+                    <div class="relative relative z-10 p-8 rounded-2xl border border-slate-200 animate-fade-in">
                         <div class="grid md:grid-cols-3 gap-8 items-center relative z-10">
                             <!-- 左侧：处理器提供方 -->
                             <div class="text-center md:text-right">
                                 <div
-                                    class="bg-blue-900/30 p-4 rounded-full w-20 h-20 mx-auto md:ml-auto md:mr-0 mb-4 flex items-center justify-center border border-blue-500/30">
+                                    class="bg-blue-100 border-blue-200 p-4 rounded-full w-20 h-20 mx-auto md:ml-auto md:mr-0 mb-4 flex items-center justify-center border border-blue-500/30">
                                     <i class="fa fa-server fa-2x text-blue-400"></i>
                                 </div>
                                 <h3 class="text-xl font-bold text-slate-800 mb-2">处理器提供方</h3>
@@ -138,11 +213,11 @@
                                     <div class="w-full h-1 bg-gradient-to-r from-blue-500 to-indigo-500"></div>
                                 </div>
                                 <div
-                                    class="bg-white/10 backdrop-blur-md p-6 rounded-xl border border-white/20 shadow-xl">
+                                    class="glass-panel-light p-6 rounded-xl border border-white shadow-xl">
                                     <img src="https://www.beiyuxing.live/wp-content/uploads/2025/12/logo_placeholder_bridge.png"
                                         onerror="this.style.display='none'" class="h-12 mx-auto mb-2" alt="Logo" />
                                     <h3 class="text-2xl font-bold gradient-text">ArchitStudio</h3>
-                                    <p class="text-xs text-slate-600 mt-2">连接算法与芯片的桥梁</p>
+                                    <p class="text-xs text-slate-600 font-medium mt-2">连接算法与芯片的桥梁</p>
                                     <i class="fa fa-exchange text-2xl text-primary mt-3 animate-pulse"></i>
                                 </div>
                             </div>
@@ -150,7 +225,7 @@
                             <!-- 右侧：DSA 需求方 -->
                             <div class="text-center md:text-left">
                                 <div
-                                    class="bg-indigo-900/30 p-4 rounded-full w-20 h-20 mx-auto md:mr-auto md:ml-0 mb-4 flex items-center justify-center border border-indigo-500/30">
+                                    class="bg-indigo-100 border-indigo-200 p-4 rounded-full w-20 h-20 mx-auto md:mr-auto md:ml-0 mb-4 flex items-center justify-center border border-indigo-200">
                                     <i class="fa fa-users fa-2x text-indigo-400"></i>
                                 </div>
                                 <h3 class="text-xl font-bold text-slate-800 mb-2">领域专用需求方</h3>
@@ -170,7 +245,7 @@
         </section>
 
         <!-- 6. 敏捷开发方法学 (替换为图片4内容) -->
-        <section class="relative z-10 py-16 bg-slate-50 border-t border-slate-200" id="methodology">
+        <section class="relative z-10 py-16 relative z-10 border-t border-slate-200" id="methodology">
             <div class="container max-w-7xl mx-auto px-4">
                 <div class="text-center mb-16 animate-fade-in">
                     <h2 class="text-3xl font-bold text-slate-800 mb-4">DSA 敏捷开发方法学</h2>
@@ -184,7 +259,7 @@
 
                         <!-- 顶栏标题 -->
                         <div
-                            class="bg-blue-700 text-slate-800 text-center py-3 rounded-t-lg shadow-lg mb-2 mx-12 md:mx-0">
+                            class="bg-blue-600 text-white font-bold text-center py-3 rounded-t-lg shadow-lg mb-2 mx-12 md:mx-0">
                             DSA自动化设计平台 — “ArchitStudio”
                         </div>
 
@@ -196,7 +271,7 @@
                                 <!-- 左侧轴标 -->
                                 <div class="hidden md:flex md:col-span-1 justify-center items-center relative">
                                     <div
-                                        class="absolute right-0 top-0 bottom-0 border-r border-dashed border-gray-600 h-full">
+                                        class="absolute right-0 top-0 bottom-0 border-r border-dashed border-slate-300 h-full">
                                     </div>
                                     <span
                                         class="text-slate-500 text-xs tracking-widest [writing-mode:vertical-lr] py-4 border-l border-slate-200 pl-2">架构分析</span>
@@ -204,7 +279,7 @@
 
                                 <!-- 中间内容框 -->
                                 <div
-                                    class="md:col-span-8 glass-panel/60 p-4 border border-teal-500/30 rounded-lg hover:border-teal-500 transition-colors relative">
+                                    class="md:col-span-8 glass-panel p-4 border border-teal-500/30 rounded-lg hover:border-teal-500 transition-colors relative">
                                     <div class="flex flex-col sm:flex-row gap-3 text-sm mb-6">
                                         <div
                                             class="flex-1 bg-white text-gray-900 font-bold p-3 text-center rounded shadow-inner flex items-center justify-center">
@@ -222,7 +297,7 @@
                                     </div>
 
                                     <div
-                                        class="bg-teal-900/40 border border-teal-500/40 p-4 text-center text-teal-100 font-medium rounded">
+                                        class="bg-teal-50 border border-teal-200 p-4 text-center text-teal-800 font-medium rounded">
                                         使用DSA设计工具分析引擎进行设计提取
                                     </div>
                                 </div>
@@ -240,7 +315,7 @@
                             </div>
 
                             <!-- 连接线 -->
-                            <div class="hidden md:block h-6 border-l w-px border-dashed border-gray-600 ml-[4.16%]">
+                            <div class="hidden md:block h-6 border-l w-px border-dashed border-slate-300 ml-[4.16%]">
                             </div>
 
                             <!-- LAYER 2: 架构设计 -->
@@ -249,7 +324,7 @@
                                 <!-- 左侧轴标 -->
                                 <div class="hidden md:flex md:col-span-1 justify-center items-center relative">
                                     <div
-                                        class="absolute right-0 top-0 bottom-0 border-r border-dashed border-gray-600 h-full">
+                                        class="absolute right-0 top-0 bottom-0 border-r border-dashed border-slate-300 h-full">
                                     </div>
                                     <span
                                         class="text-slate-500 text-xs tracking-widest [writing-mode:vertical-lr] py-4 border-l border-slate-200 pl-2">架构和指令集设计</span>
@@ -257,7 +332,7 @@
 
                                 <!-- 中间内容框 -->
                                 <div
-                                    class="md:col-span-8 glass-panel/60 p-4 border border-orange-500/30 rounded-lg hover:border-orange-500 transition-colors relative">
+                                    class="md:col-span-8 glass-panel p-4 border border-orange-500/30 rounded-lg hover:border-orange-500 transition-colors relative">
                                     <div class="grid sm:grid-cols-3 gap-2 text-xs mb-6 font-bold text-slate-800">
                                         <div
                                             class="bg-blue-600/80 p-3 rounded flex items-center justify-center text-center">
@@ -277,10 +352,10 @@
                                     </div>
 
                                     <div
-                                        class="bg-indigo-900/40 border border-indigo-500/40 p-4 text-center rounded text-indigo-100">
+                                        class="bg-indigo-50 border border-indigo-200 p-4 text-center rounded text-indigo-800">
                                         <p class="mb-2 text-sm">使用RISCAL架构描述语言对专用处理器进行设计描述，进而将设计编译到</p>
                                         <div
-                                            class="bg-black/30 py-2 px-4 inline-block rounded font-mono text-xs text-indigo-300 border border-indigo-500/30">
+                                            class="bg-white border-slate-200 py-2 px-4 inline-block rounded font-mono text-xs text-indigo-600 font-bold border border-indigo-200">
                                             一个多层次的语言 “中间件” (Wingsemi Intermediate Representation)
                                         </div>
                                     </div>
@@ -299,7 +374,7 @@
                             </div>
 
                             <!-- 连接线 -->
-                            <div class="hidden md:block h-6 border-l w-px border-dashed border-gray-600 ml-[4.16%]">
+                            <div class="hidden md:block h-6 border-l w-px border-dashed border-slate-300 ml-[4.16%]">
                             </div>
 
                             <!-- LAYER 3: 建模/生成 -->
@@ -308,7 +383,7 @@
                                 <!-- 左侧轴标 -->
                                 <div class="hidden md:flex md:col-span-1 justify-center items-center relative">
                                     <div
-                                        class="absolute right-0 top-0 bottom-0 border-r border-dashed border-gray-600 h-full">
+                                        class="absolute right-0 top-0 bottom-0 border-r border-dashed border-slate-300 h-full">
                                     </div>
                                     <span
                                         class="text-slate-500 text-xs tracking-widest [writing-mode:vertical-lr] py-4 border-l border-slate-200 pl-2">建模<br>自动化生成引擎</span>
@@ -316,7 +391,7 @@
 
                                 <!-- 中间内容框 -->
                                 <div
-                                    class="md:col-span-8 glass-panel/60 p-4 border border-purple-500/30 rounded-lg hover:border-purple-500 transition-colors relative">
+                                    class="md:col-span-8 glass-panel p-4 border border-purple-500/30 rounded-lg hover:border-purple-500 transition-colors relative">
                                     <div class="grid grid-cols-2 md:grid-cols-4 gap-2 mb-2">
                                         <div
                                             class="bg-blue-500 text-slate-800 text-[10px] sm:text-xs font-bold p-2 text-center h-20 flex items-center justify-center rounded hover:-translate-y-1 transition-transform">
@@ -333,7 +408,7 @@
                                     </div>
                                     <!-- 底部通用 -->
                                     <div
-                                        class="mt-2 bg-blue-800 text-xs sm:text-sm text-slate-800 py-2 text-center rounded font-medium shadow-lg">
+                                        class="mt-2 bg-blue-100 border border-blue-200 text-xs sm:text-sm text-blue-800 py-2 text-center rounded font-medium shadow-lg">
                                         全局形式验证和测试向量生成
                                     </div>
                                 </div>
@@ -357,24 +432,24 @@
 
                         <!-- 传统人工 -->
                         <div
-                            class="bg-gray-200 rounded-lg p-5 shadow-xl transform rotate-1 hover:rotate-0 transition-transform duration-500 border-2 border-gray-300">
-                            <div class="text-center border-b-2 border-gray-400 pb-2 mb-4">
-                                <h4 class="font-bold text-gray-800 text-lg">传统人工</h4>
+                            class="bg-slate-100 rounded-lg p-5 shadow-xl transform rotate-1 hover:rotate-0 transition-transform duration-500 border-2 border-gray-300">
+                            <div class="text-center border-b-2 border-slate-300 pb-2 mb-4">
+                                <h4 class="font-bold text-slate-800 text-lg">传统人工</h4>
                             </div>
                             <ul class="space-y-4">
                                 <li class="flex items-start gap-3">
                                     <i class="fa fa-times text-red-600 font-bold mt-1"></i>
-                                    <span class="text-xs font-semibold text-gray-700 leading-tight">处理器设计技术门槛高</span>
+                                    <span class="text-xs font-semibold text-slate-700 leading-tight">处理器设计技术门槛高</span>
                                 </li>
                                 <li class="flex items-start gap-3">
                                     <i class="fa fa-times text-red-600 font-bold mt-1"></i>
                                     <span
-                                        class="text-xs font-semibold text-gray-700 leading-tight">项目复杂度高，项目周期长，设计指标难以早期评估</span>
+                                        class="text-xs font-semibold text-slate-700 leading-tight">项目复杂度高，项目周期长，设计指标难以早期评估</span>
                                 </li>
                                 <li class="flex items-start gap-3">
                                     <i class="fa fa-times text-red-600 font-bold mt-1"></i>
                                     <span
-                                        class="text-xs font-semibold text-gray-700 leading-tight">实现端工作难度高且工作内容多，人力投入巨大</span>
+                                        class="text-xs font-semibold text-slate-700 leading-tight">实现端工作难度高且工作内容多，人力投入巨大</span>
                                 </li>
                             </ul>
                         </div>
@@ -382,7 +457,7 @@
                         <!-- VS -->
                         <div class="text-center -my-4 relative z-10">
                             <span
-                                class="text-4xl font-black text-transparent bg-clip-text bg-gradient-to-r from-blue-400 to-purple-500 drop-shadow-lg italic">VS</span>
+                                class="text-4xl font-black text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-indigo-600 drop-shadow-lg italic">VS</span>
                         </div>
 
                         <!-- DSA工具 -->
@@ -421,7 +496,7 @@
 
         <!-- 2. 产品亮点 Section (基于1.png内容) -->
         <section id="product-highlights"
-            class="relative z-10 py-20 bg-gradient-to-b from-gray-950 to-gray-900 overflow-hidden">
+            class="relative z-10 py-20 bg-slate-50 border-y border-slate-200 overflow-hidden">
             <!-- 背景装饰 -->
             <div class="absolute inset-0 pointer-events-none">
                 <div class="absolute top-0 left-1/4 w-96 h-96 bg-blue-500/5 rounded-full blur-3xl"></div>
@@ -447,7 +522,7 @@
                 <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6 max-w-7xl mx-auto">
 
                     <!-- 界面友好 -->
-                    <div class="highlight-card group relative bg-gradient-to-br from-gray-800/80 to-gray-900/80 rounded-2xl p-6 border border-slate-200/50 hover:border-cyan-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
+                    <div class="highlight-card group relative glass-panel-light rounded-2xl p-6 border border-white hover:border-cyan-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
                         style="transition-delay: 0ms">
                         <!-- 悬浮光效 -->
                         <div
@@ -493,7 +568,7 @@
                     </div>
 
                     <!-- 语言专业 -->
-                    <div class="highlight-card group relative bg-gradient-to-br from-gray-800/80 to-gray-900/80 rounded-2xl p-6 border border-slate-200/50 hover:border-violet-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
+                    <div class="highlight-card group relative glass-panel-light rounded-2xl p-6 border border-white hover:border-violet-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
                         style="transition-delay: 100ms">
                         <div
                             class="absolute inset-0 bg-gradient-to-br from-violet-500/0 to-violet-500/0 group-hover:from-violet-500/5 group-hover:to-transparent transition-all duration-500">
@@ -529,7 +604,7 @@
                     </div>
 
                     <!-- 极致效率 -->
-                    <div class="highlight-card group relative bg-gradient-to-br from-gray-800/80 to-gray-900/80 rounded-2xl p-6 border border-slate-200/50 hover:border-amber-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
+                    <div class="highlight-card group relative glass-panel-light rounded-2xl p-6 border border-white hover:border-amber-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
                         style="transition-delay: 200ms">
                         <div
                             class="absolute inset-0 bg-gradient-to-br from-amber-500/0 to-amber-500/0 group-hover:from-amber-500/5 group-hover:to-transparent transition-all duration-500">
@@ -569,7 +644,7 @@
                     </div>
 
                     <!-- 全栈闭环 -->
-                    <div class="highlight-card group relative bg-gradient-to-br from-gray-800/80 to-gray-900/80 rounded-2xl p-6 border border-slate-200/50 hover:border-emerald-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
+                    <div class="highlight-card group relative glass-panel-light rounded-2xl p-6 border border-white hover:border-emerald-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
                         style="transition-delay: 300ms">
                         <div
                             class="absolute inset-0 bg-gradient-to-br from-emerald-500/0 to-emerald-500/0 group-hover:from-emerald-500/5 group-hover:to-transparent transition-all duration-500">
@@ -622,7 +697,7 @@
         </section>
 
         <!-- 4. 敏捷设计流程 (对应图片 2: EDA 辅助的 DSA 专用处理器设计流程) -->
-        <section class="relative z-10 py-16 bg-slate-50">
+        <section class="relative z-10 py-16 relative z-10">
             <div class="container">
                 <div class="text-center mb-16 animate-fade-in">
                     <h2 class="text-3xl font-bold text-slate-800 mb-4">EDA 辅助的敏捷设计流程</h2>
@@ -633,7 +708,7 @@
                 <div class="max-w-6xl mx-auto relative">
                     <!-- 核心流程框 -->
                     <div
-                        class="glass-panel/50 border border-slate-200 rounded-3xl p-8 md:p-12 relative overflow-hidden animate-fade-in">
+                        class="glass-panel-light border border-slate-200 rounded-3xl p-8 md:p-12 relative overflow-hidden animate-fade-in">
                         <div
                             class="absolute top-0 right-0 bg-primary text-slate-800 text-xs font-bold px-4 py-2 rounded-bl-xl">
                             ArchitStudio Core Flow</div>
@@ -642,63 +717,63 @@
                             <!-- Step 1 -->
                             <div class="text-center step-item relative">
                                 <div
-                                    class="bg-blue-900/40 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4 border border-blue-500/50 z-10 relative bg-slate-50">
+                                    class="bg-blue-100 border-blue-200 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4 border border-blue-500/50 z-10 relative relative z-10">
                                     <i class="fa fa-file-code-o fa-2x text-blue-400"></i>
                                 </div>
                                 <div class="hidden md:block step-connector"></div>
-                                <h4 class="text-slate-800">目标程序</h4>
-                                <p class="text-xs text-gray-500 mt-2">Profiler 分析</p>
+                                <h4 class="text-slate-800 font-bold">目标程序</h4>
+                                <p class="text-xs text-slate-500 font-medium mt-2">Profiler 分析</p>
                             </div>
 
                             <!-- Step 2 -->
                             <div class="text-center step-item relative">
                                 <div
-                                    class="bg-blue-900/40 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4 border border-blue-500/50 z-10 relative bg-slate-50">
+                                    class="bg-blue-100 border-blue-200 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4 border border-blue-500/50 z-10 relative relative z-10">
                                     <i class="fa fa-search fa-2x text-blue-400"></i>
                                 </div>
                                 <div class="hidden md:block step-connector"></div>
-                                <h4 class="text-slate-800">架构探索</h4>
-                                <p class="text-xs text-gray-500 mt-2">RISCAL 建模</p>
+                                <h4 class="text-slate-800 font-bold">架构探索</h4>
+                                <p class="text-xs text-slate-500 font-medium mt-2">RISCAL 建模</p>
                             </div>
 
                             <!-- Step 3 -->
                             <div class="text-center step-item relative">
                                 <div
-                                    class="bg-blue-900/40 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4 border border-blue-500/50 z-10 relative bg-slate-50">
+                                    class="bg-blue-100 border-blue-200 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4 border border-blue-500/50 z-10 relative relative z-10">
                                     <i class="fa fa-cogs fa-2x text-blue-400"></i>
                                 </div>
                                 <div class="hidden md:block step-connector"></div>
-                                <h4 class="text-slate-800">自动生成</h4>
-                                <p class="text-xs text-gray-500 mt-2">Processor Gen</p>
+                                <h4 class="text-slate-800 font-bold">自动生成</h4>
+                                <p class="text-xs text-slate-500 font-medium mt-2">Processor Gen</p>
                             </div>
 
                             <!-- Step 4 -->
                             <div class="text-center step-item relative">
                                 <div
-                                    class="bg-green-900/40 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4 border border-green-500/50 z-10 relative bg-slate-50">
+                                    class="bg-emerald-100 border-emerald-200 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4 border border-green-500/50 z-10 relative relative z-10">
                                     <i class="fa fa-gift fa-2x text-green-400"></i>
                                 </div>
-                                <h4 class="text-slate-800">交付包</h4>
-                                <p class="text-xs text-gray-500 mt-2">SDK & HDK</p>
+                                <h4 class="text-slate-800 font-bold">交付包</h4>
+                                <p class="text-xs text-slate-500 font-medium mt-2">SDK & HDK</p>
                             </div>
                         </div>
 
                         <!-- 迭代闭环示意 -->
                         <div
-                            class="mt-12 bg-slate-50 rounded-xl p-6 border border-slate-200/50 flex flex-col md:flex-row gap-6 justify-between items-center">
+                            class="mt-12 relative z-10 rounded-xl p-6 border border-white flex flex-col md:flex-row gap-6 justify-between items-center">
                             <div class="flex-1 space-y-2">
                                 <div class="flex items-center gap-3">
                                     <i class="fa fa-refresh text-primary animate-spin-slow"
                                         style="animation-duration: 3s"></i>
-                                    <span class="text-slate-600 font-medium">敏捷架构迭代</span>
+                                    <span class="text-slate-600 font-medium font-medium">敏捷架构迭代</span>
                                 </div>
                                 <div class="flex items-center gap-3">
                                     <i class="fa fa-check-circle-o text-primary"></i>
-                                    <span class="text-slate-600 font-medium">敏捷功能验证</span>
+                                    <span class="text-slate-600 font-medium font-medium">敏捷功能验证</span>
                                 </div>
                                 <div class="flex items-center gap-3">
                                     <i class="fa fa-bar-chart text-primary"></i>
-                                    <span class="text-slate-600 font-medium">敏捷性能分析 (PPA)</span>
+                                    <span class="text-slate-600 font-medium font-medium">敏捷性能分析 (PPA)</span>
                                 </div>
                             </div>
 
@@ -719,7 +794,7 @@
         </section>
 
         <!-- 5. 核心组件 (对应图片 4: Generator, Compiler, Analyzer) -->
-        <section class="relative z-10 py-16 bg-card">
+        <section class="relative z-10 py-16 relative z-10">
             <div class="container">
                 <div class="text-center mb-16 animate-fade-in">
                     <h2 class="text-3xl font-bold text-slate-800 mb-4">平台核心组件</h2>
@@ -746,7 +821,7 @@
 
                 <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
                     <!-- Archit Analyzer -->
-                    <div class="card-gradient rounded-xl p-0 overflow-hidden hover-lift animate-fade-in flex flex-col h-full"
+                    <div class="glass-panel-light border border-slate-200 rounded-xl p-0 overflow-hidden hover-lift animate-fade-in flex flex-col h-full"
                         style="transition-delay: 200ms">
                         <div class="bg-gradient-to-r from-purple-600/20 to-purple-800/20 p-6 border-b border-white/5">
                             <i class="fa fa-area-chart fa-2x text-purple-500 mb-4"></i>
@@ -763,7 +838,7 @@
                     </div>
 
                     <!-- Archit Compiler -->
-                    <div class="card-gradient rounded-xl p-0 overflow-hidden hover-lift animate-fade-in flex flex-col h-full"
+                    <div class="glass-panel-light border border-slate-200 rounded-xl p-0 overflow-hidden hover-lift animate-fade-in flex flex-col h-full"
                         style="transition-delay: 100ms">
                         <div class="bg-gradient-to-r from-blue-600/20 to-blue-800/20 p-6 border-b border-white/5">
                             <i class="fa fa-cubes fa-2x text-blue-500 mb-4"></i>
@@ -782,7 +857,7 @@
                     </div>
 
                     <!-- Archit Designer -->
-                    <div class="card-gradient rounded-xl p-0 overflow-hidden hover-lift animate-fade-in flex flex-col h-full"
+                    <div class="glass-panel-light border border-slate-200 rounded-xl p-0 overflow-hidden hover-lift animate-fade-in flex flex-col h-full"
                         style="transition-delay: 150ms">
                         <div class="bg-gradient-to-r from-green-600/20 to-green-800/20 p-6 border-b border-white/5">
                             <i class="fa fa-pencil-square-o fa-2x text-green-500 mb-4"></i>
@@ -801,7 +876,7 @@
 
                     <!-- Archit Generator -->
                     <div
-                        class="card-gradient rounded-xl p-0 overflow-hidden hover-lift animate-fade-in flex flex-col h-full">
+                        class="glass-panel-light border border-slate-200 rounded-xl p-0 overflow-hidden hover-lift animate-fade-in flex flex-col h-full">
                         <div class="bg-gradient-to-r from-yellow-600/20 to-yellow-800/20 p-6 border-b border-white/5">
                             <i class="fa fa-bolt fa-2x text-yellow-500 mb-4"></i>
                             <h3 class="text-xl font-bold text-slate-800">Archit Generator</h3>
@@ -821,7 +896,7 @@
 
         <!-- RISCAL 语言介绍 Section (基于2.png) -->
         <section id="riscal-intro"
-            class="relative z-10 py-20 bg-gradient-to-b from-gray-900 to-gray-950 overflow-hidden">
+            class="relative z-10 py-20 relative z-10 overflow-hidden">
             <!-- 背景装饰 -->
             <div class="absolute inset-0 pointer-events-none">
                 <div class="absolute top-1/4 left-0 w-[500px] h-[500px] bg-orange-500/5 rounded-full blur-[120px]">
@@ -863,7 +938,7 @@
                 <div class="grid md:grid-cols-3 gap-8 max-w-6xl mx-auto">
 
                     <!-- Retargetable 卡片 -->
-                    <div class="riscal-card group relative bg-gradient-to-br from-gray-800/80 to-gray-900/90 rounded-2xl p-8 border border-orange-500/20 hover:border-orange-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
+                    <div class="riscal-card group relative glass-panel-light rounded-2xl p-8 border border-slate-200 hover:border-orange-400 transition-all duration-500 animate-fade-in overflow-hidden"
                         style="transition-delay: 0ms">
                         <!-- 顶部装饰 -->
                         <div
@@ -882,7 +957,7 @@
                             </div>
 
                             <!-- 内容 -->
-                            <p class="text-slate-600 leading-relaxed">
+                            <p class="text-slate-600 font-medium leading-relaxed">
                                 通过可重定向的设计哲学，<strong class="text-orange-300">RISCAL</strong>
                                 能够基于用户需求快速迭代生成定制化指令集，精准匹配细分场景的计算需求
                             </p>
@@ -899,7 +974,7 @@
                     </div>
 
                     <!-- RISC 卡片 -->
-                    <div class="riscal-card group relative bg-gradient-to-br from-gray-800/80 to-gray-900/90 rounded-2xl p-8 border border-blue-500/20 hover:border-blue-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
+                    <div class="riscal-card group relative glass-panel-light rounded-2xl p-8 border border-slate-200 hover:border-blue-400 transition-all duration-500 animate-fade-in overflow-hidden"
                         style="transition-delay: 150ms">
                         <!-- 顶部装饰 -->
                         <div
@@ -918,7 +993,7 @@
                             </div>
 
                             <!-- 内容 -->
-                            <p class="text-slate-600 leading-relaxed">
+                            <p class="text-slate-600 font-medium leading-relaxed">
                                 以 <strong class="text-blue-300">RISC-V 架构</strong>为根基，赋能领域特定指令集的敏捷定义与高效实现，让 DSA
                                 设计回归开放与简洁的本质
                             </p>
@@ -935,7 +1010,7 @@
                     </div>
 
                     <!-- CAL 卡片 -->
-                    <div class="riscal-card group relative bg-gradient-to-br from-gray-800/80 to-gray-900/90 rounded-2xl p-8 border border-orange-500/20 hover:border-orange-500/50 transition-all duration-500 animate-fade-in overflow-hidden"
+                    <div class="riscal-card group relative glass-panel-light rounded-2xl p-8 border border-slate-200 hover:border-orange-400 transition-all duration-500 animate-fade-in overflow-hidden"
                         style="transition-delay: 300ms">
                         <!-- 顶部装饰 -->
                         <div
@@ -954,7 +1029,7 @@
                             </div>
 
                             <!-- 内容 -->
-                            <p class="text-slate-600 leading-relaxed">
+                            <p class="text-slate-600 font-medium leading-relaxed">
                                 语言驱动的编译器与硬件 <strong class="text-orange-300">RTL
                                     同源共生</strong>，从指令定义到工具链生成无缝一致，彻底消除架构与实现间的语义鸿沟
                             </p>
@@ -987,7 +1062,7 @@
         </section>
 
         <!-- RISCAL Q&A Section (基于3.png) -->
-        <section id="riscal-qa" class="relative z-10 py-20 bg-gradient-to-b from-gray-950 to-gray-900 overflow-hidden">
+        <section id="riscal-qa" class="relative z-10 py-20 bg-slate-50 border-y border-slate-200 overflow-hidden">
             <!-- 背景装饰 -->
             <div class="absolute inset-0 pointer-events-none">
                 <div class="absolute top-0 left-1/4 w-[600px] h-[600px] bg-blue-500/5 rounded-full blur-[150px]"></div>
@@ -1035,7 +1110,7 @@
                 <div class="grid md:grid-cols-2 gap-8 max-w-6xl mx-auto">
 
                     <!-- Q1: 动机 -->
-                    <div class="qa-card group bg-gradient-to-br from-gray-800/90 to-gray-900/90 rounded-2xl p-6 border border-blue-500/20 hover:border-blue-500/40 transition-all duration-500 animate-fade-in"
+                    <div class="qa-card group glass-panel-light rounded-2xl p-6 border border-slate-200 hover:border-blue-400 transition-all duration-500 animate-fade-in"
                         style="transition-delay: 0ms">
                         <!-- 数字标识 + 标签 -->
                         <div class="flex items-center gap-3 mb-4">
@@ -1058,7 +1133,7 @@
                         </div>
 
                         <!-- 答案内容 - 直接显示 -->
-                        <ul class="text-slate-600 text-sm space-y-2 pt-2 border-t border-slate-200/50">
+                        <ul class="text-slate-600 font-medium text-sm space-y-2 pt-2 border-t border-white">
                             <li class="flex items-start gap-2">
                                 <i class="fa fa-check-circle text-blue-400 mt-0.5 flex-shrink-0"></i>
                                 <span>DSA与DSL的关联性</span>
@@ -1071,7 +1146,7 @@
                     </div>
 
                     <!-- Q2: 门槛 -->
-                    <div class="qa-card group bg-gradient-to-br from-gray-800/90 to-gray-900/90 rounded-2xl p-6 border border-orange-500/20 hover:border-orange-500/40 transition-all duration-500 animate-fade-in"
+                    <div class="qa-card group glass-panel-light rounded-2xl p-6 border border-slate-200 hover:border-orange-400 transition-all duration-500 animate-fade-in"
                         style="transition-delay: 150ms">
                         <!-- 数字标识 + 标签 -->
                         <div class="flex items-center gap-3 mb-4">
@@ -1095,7 +1170,7 @@
                         </div>
 
                         <!-- 答案内容 - 直接显示 -->
-                        <ul class="text-slate-600 text-sm space-y-2 pt-2 border-t border-slate-200/50">
+                        <ul class="text-slate-600 font-medium text-sm space-y-2 pt-2 border-t border-white">
                             <li class="flex items-start gap-2">
                                 <i class="fa fa-check-circle text-orange-400 mt-0.5 flex-shrink-0"></i>
                                 <span>C-like的语法</span>
@@ -1108,7 +1183,7 @@
                     </div>
 
                     <!-- Q3: 能力 -->
-                    <div class="qa-card group bg-gradient-to-br from-gray-800/90 to-gray-900/90 rounded-2xl p-6 border border-blue-500/20 hover:border-blue-500/40 transition-all duration-500 animate-fade-in"
+                    <div class="qa-card group glass-panel-light rounded-2xl p-6 border border-slate-200 hover:border-blue-400 transition-all duration-500 animate-fade-in"
                         style="transition-delay: 300ms">
                         <!-- 数字标识 + 标签 -->
                         <div class="flex items-center gap-3 mb-4">
@@ -1131,7 +1206,7 @@
                         </div>
 
                         <!-- 答案内容 - 直接显示 -->
-                        <ul class="text-slate-600 text-sm space-y-2 pt-2 border-t border-slate-200/50">
+                        <ul class="text-slate-600 font-medium text-sm space-y-2 pt-2 border-t border-white">
                             <li class="flex items-start gap-2">
                                 <i class="fa fa-check-circle text-blue-400 mt-0.5 flex-shrink-0"></i>
                                 <span>图灵完备性</span>
@@ -1148,7 +1223,7 @@
                     </div>
 
                     <!-- Q4: 收益 -->
-                    <div class="qa-card group bg-gradient-to-br from-gray-800/90 to-gray-900/90 rounded-2xl p-6 border border-orange-500/20 hover:border-orange-500/40 transition-all duration-500 animate-fade-in"
+                    <div class="qa-card group glass-panel-light rounded-2xl p-6 border border-slate-200 hover:border-orange-400 transition-all duration-500 animate-fade-in"
                         style="transition-delay: 450ms">
                         <!-- 数字标识 + 标签 -->
                         <div class="flex items-center gap-3 mb-4">
@@ -1172,7 +1247,7 @@
                         </div>
 
                         <!-- 答案内容 - 直接显示 -->
-                        <ul class="text-slate-600 text-sm space-y-2 pt-2 border-t border-slate-200/50">
+                        <ul class="text-slate-600 font-medium text-sm space-y-2 pt-2 border-t border-white">
                             <li class="flex items-start gap-2">
                                 <i class="fa fa-clock-o text-orange-400 mt-0.5 flex-shrink-0"></i>
                                 <span>第一个RISCAL程序：<strong class="text-slate-800">一周</strong></span>
@@ -1188,7 +1263,7 @@
         </section>
 
         <!-- 7. 用户价值 (保留原有内容) -->
-        <section id="features" class="section-content py-16 bg-card">
+        <section id="features" class="section-content py-16 relative z-10">
             <div class="container">
                 <div class="max-w-4xl mx-auto mb-16 text-center">
                     <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800">用户价值</h2>
@@ -1198,7 +1273,7 @@
                 <div class="grid md:grid-cols-2 gap-6 max-w-6xl mx-auto">
                     <!-- Value Items -->
                     <div
-                        class="bg-slate-50 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
+                        class="relative z-10 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
                         <div class="flex items-start">
                             <i class="fa fa-rocket text-primary mt-1 fa-2x"></i>
                             <div class="ml-4">
@@ -1209,7 +1284,7 @@
                     </div>
 
                     <div
-                        class="bg-slate-50 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
+                        class="relative z-10 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
                         <div class="flex items-start">
                             <i class="fa fa-users text-primary mt-1 fa-2x"></i>
                             <div class="ml-4">
@@ -1220,7 +1295,7 @@
                     </div>
 
                     <div
-                        class="bg-slate-50 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
+                        class="relative z-10 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
                         <div class="flex items-start">
                             <i class="fa fa-clock-o text-primary mt-1 fa-2x"></i>
                             <div class="ml-4">
@@ -1231,7 +1306,7 @@
                     </div>
 
                     <div
-                        class="bg-slate-50 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
+                        class="relative z-10 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
                         <div class="flex items-start">
                             <i class="fa fa-shield text-primary mt-1 fa-2x"></i>
                             <div class="ml-4">
@@ -1242,7 +1317,7 @@
                     </div>
 
                     <div
-                        class="bg-slate-50 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
+                        class="relative z-10 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
                         <div class="flex items-start">
                             <i class="fa fa-eye text-primary mt-1 fa-2x"></i>
                             <div class="ml-4">
@@ -1253,7 +1328,7 @@
                     </div>
 
                     <div
-                        class="bg-slate-50 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
+                        class="relative z-10 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
                         <div class="flex items-start">
                             <i class="fa fa-lightbulb-o text-primary mt-1 fa-2x"></i>
                             <div class="ml-4">
@@ -1264,7 +1339,7 @@
                     </div>
 
                     <div
-                        class="bg-slate-50 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
+                        class="relative z-10 p-6 rounded-xl border border-slate-200 hover:border-primary transition-all animate-fade-in">
                         <div class="flex items-start">
                             <i class="fa fa-globe text-primary mt-1 fa-2x"></i>
                             <div class="ml-4">
diff --git a/code_compression_intro_V2.html b/code_compression_intro_V2.html
index 488f315..e48dcc0 100644
--- a/code_compression_intro_V2.html
+++ b/code_compression_intro_V2.html
@@ -1,15 +1,6 @@
 <!DOCTYPE html>
 <!-- 注意：在 WordPress 中不需要 html/head/body 标签，只需保留 script 和内容容器 -->
-<div id="wingsemi-root" class="wingsemi-scope font-inter bg-slate-50 !text-slate-800 relative w-full overflow-hidden">
-
-    <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
-    <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
-        <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
-        <div class="absolute bottom-[-10%] right-[-10%] w-[40%] h-[40%] rounded-full bg-sky-200/40 blur-[100px]"></div>
-        <div class="absolute top-[40%] right-[10%] w-[30%] h-[30%] rounded-full bg-indigo-100/60 blur-[80px]"></div>
-        <div class="absolute bottom-[20%] left-[20%] w-[30%] h-[30%] rounded-full bg-blue-100/50 blur-[80px]"></div>
-    </div>
-
+<div id="wingsemi-root" class="wingsemi-scope font-inter bg-slate-50 text-slate-800 relative w-full overflow-hidden">
 
     <!-- 引入 Tailwind 和 字体 -->
     <script src="https://cdn.tailwindcss.com"></script>
@@ -31,14 +22,8 @@
                 extend: {
                     colors: {
                         primary: '#3b82f6',
-                        secondary: '#0E42D2',
-                        accent: '#69b1ff',
-                        dark: '#0f172a',
-                        light: '#f8fafc',
-                        darkBg: '#1e293b',
-                        darkerBg: '#0f172a',
-                        darkCard: '#334155',
-                        brandBlue: '#2563EB',
+                        secondary: '#2563eb',
+                        accent: '#60a5fa',
                     },
                     fontFamily: {
                         inter: ['Inter', 'sans-serif'],
@@ -50,7 +35,7 @@
     <style type="text/tailwindcss">
         @layer utilities {
             .text-shadow {
-                text-shadow: 0 2px 4px rgba(0,0,0,0.3);
+                text-shadow: 0 2px 4px rgba(0,0,0,0.1);
             }
             .animate-fade-in {
                 opacity: 0;
@@ -66,57 +51,79 @@
             }
             .card-hover:hover {
                 transform: translateY(-5px);
-                box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);
+                box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1);
             }
             .bar-animate {
                 transition: height 1.5s ease-out;
             }
         }
+        .glass-panel {
+            background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
+            backdrop-filter: blur(16px);
+            -webkit-backdrop-filter: blur(16px);
+            border: 1px solid rgba(255, 255, 255, 0.9);
+            box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
+        }
+        .glass-panel-light {
+            background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
+            backdrop-filter: blur(20px);
+            -webkit-backdrop-filter: blur(20px);
+            border: 1px solid rgba(255, 255, 255, 1);
+            box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
+        }
+        .gradient-text {
+            background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            background-clip: text;
+        }
     </style>
 
+    <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
+    <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
+        <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
+        <div class="absolute bottom-[-10%] right-[-10%] w-[40%] h-[40%] rounded-full bg-sky-200/40 blur-[100px]"></div>
+        <div class="absolute top-[40%] right-[10%] w-[30%] h-[30%] rounded-full bg-indigo-100/60 blur-[80px]"></div>
+        <div class="absolute bottom-[20%] left-[20%] w-[30%] h-[30%] rounded-full bg-blue-100/50 blur-[80px]"></div>
+    </div>
+
     <div id="wingsemi-wrapper" class="relative z-10 w-full min-h-screen">
-        <main class="flex-1 relative z-10 w-full">
+        <main class="flex-1">
             <!-- 头部 Hero Section -->
-            <section class="relative pt-20 md:pt-32 pb-20 overflow-hidden bg-transparent">
-                <!-- 背景装饰 -->
-                <div class="absolute top-0 left-0 w-full h-full overflow-hidden z-0 opacity-20 pointer-events-none">
-                    <div class="absolute -top-24 -right-24 w-96 h-96 rounded-full bg-primary blur-3xl"></div>
-                    <div class="absolute top-1/2 -left-24 w-72 h-72 rounded-full bg-secondary blur-3xl"></div>
-                </div>
+            <section class="relative pt-20 md:pt-32 pb-20 overflow-hidden">
+                <div class="absolute top-0 left-1/2 -translate-x-1/2 w-[80%] h-64 bg-primary/10 blur-[120px] rounded-full pointer-events-none"></div>
 
                 <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                     <div class="max-w-5xl mx-auto text-center">
-                        <h1
-                            class="text-4xl md:text-5xl lg:text-6xl font-bold !text-slate-800 leading-tight mb-8 text-shadow animate-fade-in">
+                        <h1 class="text-4xl md:text-5xl lg:text-6xl font-extrabold text-slate-800 leading-tight mb-8 text-shadow animate-fade-in drop-shadow-sm">
                             代码密度增强技术
                         </h1>
                         <div
-                            class="inline-block px-4 py-1.5 rounded-full bg-primary/20 border border-primary/30 !text-primary font-semibold text-xl mb-6 animate-fade-in">
+                            class="inline-flex items-center space-x-2 px-4 py-1.5 rounded-full glass-panel-light border border-blue-200 mb-6 shadow-sm text-primary font-semibold text-xl animate-fade-in">
                             超越行业标杆 ARM 的技术突破
                         </div>
-                        <p
-                            class="text-lg md:text-xl !text-slate-600 mb-10 max-w-3xl mx-auto leading-relaxed animate-fade-in">
+                        <p class="text-lg md:text-xl text-slate-600 font-medium mb-10 max-w-3xl mx-auto leading-relaxed animate-fade-in">
                             针对 RISC-V 指令集特性深度优化，通过 Xwingc 扩展指令集、WingGCC 编译器及 WingLib 基础库的全栈协同，显著降低内存占用与芯片成本，实现超越 ARM
                             的代码密度表现。
                         </p>
 
                         <!-- 核心指标 -->
                         <div class="grid grid-cols-2 md:grid-cols-4 gap-4 animate-fade-in">
-                            <div class="glass-panel/50 backdrop-blur-sm p-4 rounded-lg border border-slate-200">
-                                <div class="text-3xl font-bold !text-primary mb-1">30%</div>
-                                <div class="text-xs !text-slate-500">代码空间节省</div>
+                            <div class="glass-panel text-slate-800 p-4 rounded-3xl border border-white hover:-translate-y-2 hover:shadow-lg hover:border-blue-200 transition-all">
+                                <div class="text-3xl font-extrabold text-primary mb-1">30%</div>
+                                <div class="text-xs text-slate-500 font-bold">代码空间节省</div>
                             </div>
-                            <div class="glass-panel/50 backdrop-blur-sm p-4 rounded-lg border border-slate-200">
-                                <div class="text-3xl font-bold !text-primary mb-1">5-20%</div>
-                                <div class="text-xs !text-slate-500">库体积优于竞品</div>
+                            <div class="glass-panel text-slate-800 p-4 rounded-3xl border border-white hover:-translate-y-2 hover:shadow-lg hover:border-blue-200 transition-all">
+                                <div class="text-3xl font-extrabold text-primary mb-1">5-20%</div>
+                                <div class="text-xs text-slate-500 font-bold">库体积优于竞品</div>
                             </div>
-                            <div class="glass-panel/50 backdrop-blur-sm p-4 rounded-lg border border-slate-200">
-                                <div class="text-3xl font-bold !text-primary mb-1">Xwingc</div>
-                                <div class="text-xs !text-slate-500">自主研发扩展</div>
+                            <div class="glass-panel text-slate-800 p-4 rounded-3xl border border-white hover:-translate-y-2 hover:shadow-lg hover:border-blue-200 transition-all">
+                                <div class="text-3xl font-extrabold text-primary mb-1">Xwingc</div>
+                                <div class="text-xs text-slate-500 font-bold">自主研发扩展</div>
                             </div>
-                            <div class="glass-panel/50 backdrop-blur-sm p-4 rounded-lg border border-slate-200">
-                                <div class="text-3xl font-bold !text-primary mb-1">WingGCC</div>
-                                <div class="text-xs !text-slate-500">深度定制编译器</div>
+                            <div class="glass-panel text-slate-800 p-4 rounded-3xl border border-white hover:-translate-y-2 hover:shadow-lg hover:border-blue-200 transition-all">
+                                <div class="text-3xl font-extrabold text-primary mb-1">WingGCC</div>
+                                <div class="text-xs text-slate-500 font-bold">深度定制编译器</div>
                             </div>
                         </div>
                     </div>
@@ -124,22 +131,22 @@
             </section>
 
             <!-- 背景痛点 -->
-            <section class="py-16 bg-slate-50 border-b border-slate-200">
-                <div class="container mx-auto px-4 md:px-6 lg:px-8">
+            <section class="py-16 bg-slate-50 relative">
+                <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                     <div class="max-w-4xl mx-auto mb-12 text-center">
-                        <h2 class="text-3xl font-bold !text-slate-800 mb-4">技术背景与挑战</h2>
-                        <div class="w-20 h-1 bg-primary mx-auto"></div>
+                        <h2 class="text-3xl font-extrabold text-slate-800 mb-4 drop-shadow-sm">技术背景与挑战</h2>
+                        <div class="w-20 h-1.5 bg-gradient-to-r from-blue-500 to-sky-400 mx-auto rounded-full"></div>
                     </div>
 
-                    <div class="glass-panel/30 rounded-2xl p-8 md:p-12 border border-slate-200 animate-fade-in">
+                    <div class="glass-panel rounded-3xl p-8 md:p-12 border border-white animate-fade-in shadow-sm hover:shadow-lg transition-shadow">
                         <div class="flex flex-col lg:flex-row items-center gap-12">
                             <div class="lg:w-1/2">
-                                <h3 class="text-2xl font-bold !text-slate-800 mb-4">RISC-V 的双刃剑</h3>
-                                <p class="!text-slate-600 mb-6 leading-relaxed">
+                                <h3 class="text-2xl font-extrabold text-slate-800 mb-4">RISC-V 的双刃剑</h3>
+                                <p class="text-slate-600 font-medium mb-6 leading-relaxed">
                                     RISC-V 指令集以精简闻名，但在处理相同任务时，相较于 ARM 往往需要执行更多条指令。这种特性导致了<span
-                                        class="!text-primary font-semibold">代码密度较低</span>，进而要求更大的片上内存（Memory），最终导致芯片成本的增加。
+                                        class="text-blue-600 font-bold bg-blue-50 px-2 py-0.5 rounded">代码密度较低</span>，进而要求更大的片上内存（Memory），最终导致芯片成本的增加。
                                 </p>
-                                <div class="flex flex-col space-y-2 text-sm !text-slate-500">
+                                <div class="flex flex-col space-y-2 text-sm text-slate-500 font-medium">
                                     <div class="flex items-center"><span
                                             class="w-2 h-2 bg-red-500 rounded-full mr-2"></span>更多指令需求</div>
                                     <div class="flex items-center"><span
@@ -150,33 +157,33 @@
                             </div>
                             <!-- 示意图模拟 -->
                             <div class="lg:w-1/2 w-full">
-                                <div class="bg-transparent p-6 rounded-xl border border-slate-200 relative">
+                                <div class="glass-panel-light p-6 rounded-2xl border border-white shadow-sm relative">
                                     <div
-                                        class="absolute -top-3 -right-3 bg-red-500 !text-slate-800 text-xs px-3 py-1 rounded-full">
+                                        class="absolute -top-3 -right-3 bg-red-500 text-white font-bold text-xs px-3 py-1 rounded-full shadow-md">
                                         高成本痛点</div>
                                     <div class="grid grid-cols-2 gap-4 text-center">
                                         <div class="space-y-2">
                                             <div
-                                                class="h-24 bg-gray-700 rounded flex items-center justify-center !text-slate-500">
+                                                class="h-24 bg-slate-100 rounded-xl flex items-center justify-center text-slate-500 font-bold border border-slate-200">
                                                 CPU</div>
                                             <div
-                                                class="h-32 bg-gray-700/50 rounded flex items-center justify-center !text-gray-500 border-2 border-dashed border-gray-600">
+                                                class="h-32 bg-slate-50 rounded-xl flex items-center justify-center text-slate-400 font-medium border-2 border-dashed border-slate-300">
                                                 Memory
                                             </div>
-                                            <p class="text-sm !text-slate-500">普通 RISC-V</p>
+                                            <p class="text-sm text-slate-500 font-bold">普通 RISC-V</p>
                                         </div>
                                         <div class="space-y-2">
                                             <div
-                                                class="h-24 bg-primary/20 border border-primary/50 rounded flex items-center justify-center !text-primary">
+                                                class="h-24 bg-blue-50 border border-blue-200 rounded-xl flex items-center justify-center text-blue-600 font-bold">
                                                 Wing CPU</div>
                                             <div
-                                                class="h-20 bg-primary/10 border border-primary/30 rounded flex items-center justify-center !text-primary font-bold">
+                                                class="h-20 bg-blue-100/50 border border-blue-200 rounded-xl flex items-center justify-center text-blue-600 font-bold">
                                                 优化后 Memory
                                             </div>
-                                            <p class="text-sm !text-primary">隼瞻方案</p>
+                                            <p class="text-sm text-blue-600 font-bold">隼瞻方案</p>
                                         </div>
                                     </div>
-                                    <p class="mt-4 text-center text-sm !text-slate-500">通过提高代码密度，显著减少对 Memory 的需求，降低
+                                    <p class="mt-4 text-center text-sm text-slate-500 font-medium">通过提高代码密度，显著减少对 Memory 的需求，降低
                                         Memory 面积与成本。</p>
                                 </div>
                             </div>
@@ -186,82 +193,82 @@
             </section>
 
             <!-- 四大技术手段 -->
-            <section class="py-20 bg-transparent">
-                <div class="container mx-auto px-4">
+            <section class="py-20 relative">
+                <div class="container mx-auto px-4 relative z-10">
                     <div class="max-w-4xl mx-auto mb-16 text-center">
-                        <h2 class="text-3xl md:text-4xl font-bold !text-slate-800 mb-6">四大技术手段</h2>
-                        <p class="!text-slate-500">全栈式优化策略，从指令集到工具链</p>
+                        <h2 class="text-3xl md:text-4xl font-extrabold text-slate-800 mb-6 drop-shadow-sm">四大技术手段</h2>
+                        <p class="text-slate-600 font-medium">全栈式优化策略，从指令集到工具链</p>
                     </div>
 
                     <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
                         <!-- 01 社区贡献 -->
                         <div
-                            class="glass-panel rounded-xl p-6 border-t-4 border-primary card-hover animate-fade-in group">
+                            class="glass-panel rounded-3xl p-6 border-t-4 border-t-primary border border-white card-hover animate-fade-in group">
                             <div
-                                class="text-4xl font-bold !text-gray-500 mb-4 group-hover:!text-primary transition-colors">
+                                class="text-4xl font-extrabold text-slate-300 mb-4 group-hover:text-primary transition-colors">
                                 01</div>
-                            <h3 class="text-xl font-bold !text-slate-800 mb-3">社区贡献</h3>
-                            <p class="!text-slate-500 text-sm leading-relaxed mb-4">
-                                对 RISC-V 社区的 <span class="!text-primary">B 扩展、Zc 扩展、Zicond</span>
+                            <h3 class="text-xl font-extrabold text-slate-800 mb-3">社区贡献</h3>
+                            <p class="text-slate-600 font-medium text-sm leading-relaxed mb-4">
+                                对 RISC-V 社区的 <span class="text-blue-600 font-bold">B 扩展、Zc 扩展、Zicond</span>
                                 等一系列标准扩展提供了有效支持，并进行了进一步优化。
                             </p>
                             <!-- 触发弹窗按钮 -->
                             <button onclick="openModal()"
-                                class="flex items-center text-sm !text-primary hover:!text-accent transition-colors font-medium cursor-pointer">
+                                class="flex items-center text-sm text-blue-600 hover:text-blue-800 transition-colors font-bold cursor-pointer bg-blue-50 px-3 py-1.5 rounded-full border border-blue-100">
                                 <i class="fa fa-bar-chart mr-2"></i> 查看对比
                             </button>
                         </div>
 
                         <!-- 02 Xwingc 扩展 -->
-                        <div class="glass-panel rounded-xl p-6 border-t-4 border-primary card-hover animate-fade-in group"
+                        <div class="glass-panel rounded-3xl p-6 border-t-4 border-t-primary border border-white card-hover animate-fade-in group"
                             style="transition-delay: 100ms;">
                             <div
-                                class="text-4xl font-bold !text-gray-500 mb-4 group-hover:!text-primary transition-colors">
+                                class="text-4xl font-extrabold text-slate-300 mb-4 group-hover:text-primary transition-colors">
                                 02</div>
-                            <h3 class="text-xl font-bold !text-slate-800 mb-3">Xwingc 扩展指令集</h3>
-                            <p class="!text-slate-500 text-sm leading-relaxed mb-4">
-                                支持将自主研发的<span class="!text-slate-800 font-semibold">代码密度增强指令 Xwingc 扩展</span>加入到处理器核中。
+                            <h3 class="text-xl font-extrabold text-slate-800 mb-3">Xwingc 扩展指令集</h3>
+                            <p class="text-slate-600 font-medium text-sm leading-relaxed mb-4">
+                                支持将自主研发的<span class="text-slate-800 font-bold bg-slate-100 px-1 rounded">代码密度增强指令 Xwingc 扩展</span>加入到处理器核中。
                             </p>
-                            <div class="bg-slate-50 p-3 rounded text-xs !text-slate-600 border border-slate-200">
+                            <div class="bg-slate-50 p-3 rounded-xl border border-slate-200 shadow-inner text-xs text-slate-600 font-medium">
                                 <div class="flex justify-between items-center mb-2">
-                                    <span>Arm: </span> <span class="font-mono glass-panel px-1 rounded">ldr r0, [r0, r1,
+                                    <span>Arm: </span> <span class="font-mono bg-white border border-slate-200 px-1.5 py-0.5 rounded shadow-sm text-slate-700">ldr r0, [r0, r1,
                                         lsl #2]</span>
                                 </div>
                                 <div class="flex justify-between items-center mb-2">
-                                    <span>传统RISC-V指令: </span> <span class="font-mono glass-panel px-1 rounded">sll a1,
+                                    <span>传统RISC-V: </span> <span class="font-mono bg-white border border-slate-200 px-1.5 py-0.5 rounded shadow-sm text-slate-700">sll a1,
                                         a1, 2; add aO,</br> a1; lw a0, O(a0)</span>
                                 </div>
                                 <div class="flex justify-between items-center">
-                                    <span class="!text-primary">Wing Xc:</span> <span
-                                        class="font-mono bg-primary/20 px-1 rounded !text-primary">lwr a0, a1(a0)</span>
+                                    <span class="text-blue-600 font-bold">Wing Xc:</span> <span
+                                        class="font-mono bg-blue-50 border border-blue-100 px-1.5 py-0.5 rounded text-blue-700 font-bold shadow-sm">lwr a0, a1(a0)</span>
                                 </div>
-                                <div class="mt-2 text-[10px] text-center !text-gray-500">一条指令完成多条操作，无需额外寄存器分配</div>
+                                <div class="mt-3 text-[10px] text-center text-slate-500 font-bold border-t border-slate-200 pt-2">一条指令完成多条操作，无需额外寄存器</div>
                             </div>
                         </div>
 
                         <!-- 03 WingGCC 编译器 -->
-                        <div class="glass-panel rounded-xl p-6 border-t-4 border-primary card-hover animate-fade-in group"
+                        <div class="glass-panel rounded-3xl p-6 border-t-4 border-t-primary border border-white card-hover animate-fade-in group"
                             style="transition-delay: 200ms;">
                             <div
-                                class="text-4xl font-bold !text-gray-500 mb-4 group-hover:!text-primary transition-colors">
+                                class="text-4xl font-extrabold text-slate-300 mb-4 group-hover:text-primary transition-colors">
                                 03</div>
-                            <h3 class="text-xl font-bold !text-slate-800 mb-3">WingGCC 编译器</h3>
-                            <p class="!text-slate-500 text-sm leading-relaxed">
+                            <h3 class="text-xl font-extrabold text-slate-800 mb-3">WingGCC 编译器</h3>
+                            <p class="text-slate-600 font-medium text-sm leading-relaxed">
                                 解决了 GCC 领域针对性不强的问题。完整匹配各种标准扩展指令和隼瞻自定义扩展指令，同时适配隼瞻<span
-                                    class="!text-primary">专用高效微架构</span>，充分发挥性能。
+                                    class="text-blue-600 font-bold">专用高效微架构</span>，充分发挥性能。
                             </p>
                         </div>
 
                         <!-- 04 WingLib 基础库 -->
-                        <div class="glass-panel rounded-xl p-6 border-t-4 border-primary card-hover animate-fade-in group"
+                        <div class="glass-panel rounded-3xl p-6 border-t-4 border-t-primary border border-white card-hover animate-fade-in group"
                             style="transition-delay: 300ms;">
                             <div
-                                class="text-4xl font-bold !text-gray-500 mb-4 group-hover:!text-primary transition-colors">
+                                class="text-4xl font-extrabold text-slate-300 mb-4 group-hover:text-primary transition-colors">
                                 04</div>
-                            <h3 class="text-xl font-bold !text-slate-800 mb-3">WingLib 基础库</h3>
-                            <ul class="!text-slate-500 text-sm space-y-2 list-disc pl-4">
+                            <h3 class="text-xl font-extrabold text-slate-800 mb-3">WingLib 基础库</h3>
+                            <ul class="text-slate-600 font-medium text-sm space-y-2 list-disc pl-4 marker:text-blue-400">
                                 <li>提供标准C库和数学库，专为 code size 和速度优化，优于竞品 <span
-                                        class="!text-slate-800">5%~20%</span>。</li>
+                                        class="text-blue-600 font-bold bg-blue-50 px-1 rounded">5%~20%</span>。</li>
                                 <li>提供优化的 DSP 库，结合 DSA 技术，性能达竞品数倍。</li>
                                 <li>提供优化的第三方中间件。</li>
                             </ul>
@@ -271,32 +278,32 @@
             </section>
 
             <!-- 优化成果数据 -->
-            <section class="py-20 bg-slate-50">
-                <div class="container mx-auto px-4 md:px-6 lg:px-8">
+            <section class="py-20 relative">
+                <div class="container mx-auto px-4 md:px-6 lg:px-8 relative z-10">
                     <!-- 改为 items-stretch 和 justify-between，并增加 gap 以确保中间留空 -->
                     <div class="flex flex-col md:flex-row items-stretch justify-between gap-12 lg:gap-16">
 
                         <!-- 左边文字放在容器样式里 -->
                         <div
-                            class="md:w-[45%] w-full glass-panel/20 p-8 md:p-10 rounded-2xl border border-slate-200 animate-fade-in flex flex-col shadow-lg relative overflow-hidden group">
+                            class="md:w-[45%] w-full glass-panel-light p-8 md:p-10 rounded-3xl border border-white animate-fade-in flex flex-col shadow-sm hover:shadow-lg transition-shadow relative overflow-hidden group">
                             <!-- 装饰光效 -->
                             <div
-                                class="absolute -top-24 -left-24 w-64 h-64 bg-primary/10 rounded-full blur-3xl group-hover:bg-primary/20 transition-all duration-500 pointer-events-none">
+                                class="absolute -top-24 -left-24 w-64 h-64 bg-blue-100 rounded-full blur-3xl group-hover:bg-blue-200/50 transition-all duration-500 pointer-events-none">
                             </div>
 
-                            <h2 class="text-3xl font-bold !text-slate-800 mb-6 relative z-10 flex items-center">
+                            <h2 class="text-3xl font-extrabold text-slate-800 mb-6 relative z-10 flex items-center">
                                 <span
-                                    class="w-1.5 h-8 bg-primary rounded-full mr-4 inline-block shadow-[0_0_10px_rgba(59,130,246,0.8)]"></span>
+                                    class="w-1.5 h-8 bg-blue-500 rounded-full mr-4 inline-block shadow-sm"></span>
                                 极致的密度优化
                             </h2>
-                            <p class="!text-slate-600 mb-8 leading-relaxed text-lg relative z-10">
+                            <p class="text-slate-600 font-medium mb-8 leading-relaxed text-lg relative z-10">
                                 我们的优化路径清晰可见。从基础 GCC 出发，叠加 Zc/Zicond 扩展，再引入 Wing 独有的代码密度增强技术，最终实现大幅度的空间节省。
                             </p>
 
                             <!-- 底部信息同样放在深色容器内，增加对比度 -->
                             <div
-                                class="mt-auto p-5 bg-transparent/80 backdrop-blur-sm border border-slate-200/50 rounded-xl relative z-10 shadow-inner group-hover:border-primary/30 transition-colors">
-                                <p class="text-sm !text-primary flex items-start sm:items-center">
+                                class="mt-auto p-5 bg-white/80 backdrop-blur-sm border border-slate-200 rounded-2xl relative z-10 shadow-inner group-hover:border-blue-200 transition-colors">
+                                <p class="text-sm text-blue-600 font-bold flex items-start sm:items-center">
                                     <i class="fa fa-info-circle mr-3 mt-1 sm:mt-0 text-lg"></i>
                                     <span class="leading-snug">基于 Wing-M130, Wing IDE v1.0, embench 测试案例</span>
                                 </p>
@@ -305,48 +312,48 @@
 
                         <!-- 柱状图部分 -->
                         <div
-                            class="md:w-[50%] w-full glass-panel/20 p-8 md:p-10 rounded-2xl border border-slate-200 animate-fade-in relative z-10 shadow-lg">
+                            class="md:w-[50%] w-full glass-panel p-8 md:p-10 rounded-3xl border border-white animate-fade-in relative z-10 shadow-sm hover:shadow-lg transition-shadow">
                             <h3
-                                class="text-xl font-semibold !text-slate-800 mb-8 flex flex-col sm:flex-row sm:items-end gap-2">
+                                class="text-xl font-extrabold text-slate-800 mb-8 flex flex-col sm:flex-row sm:items-end gap-2">
                                 <span>代码密度百分比</span>
-                                <span class="text-sm font-normal !text-slate-500">(数值越小越好)</span>
+                                <span class="text-sm font-medium text-slate-500">(数值越小越好)</span>
                             </h3>
 
                             <!-- 柱状图容器 -->
                             <div id="chart-container"
-                                class="flex items-end justify-between space-x-2 md:space-x-4 pb-2 border-b border-gray-600"
+                                class="flex items-end justify-between space-x-2 md:space-x-4 pb-2 border-b border-slate-200"
                                 style="height: 280px;">
                                 <!-- Bar 1: GCC 100% -->
                                 <div class="flex-1 flex flex-col items-center h-full group">
                                     <div class="flex-1 w-full flex items-end justify-center">
                                         <!-- 修改宽度使柱体变细 w-12 -->
-                                        <div class="w-10 sm:w-12 md:w-16 bg-blue-900/30 rounded-t-xl relative overflow-hidden transform group-hover:scale-x-105 transition-transform"
+                                        <div class="w-10 sm:w-12 md:w-16 bg-blue-50/50 rounded-t-xl relative overflow-hidden transform group-hover:scale-x-105 transition-transform"
                                             style="height: 100%;">
-                                            <div class="absolute bottom-0 w-full bg-secondary bar-animate shadow-[0_-5px_15px_rgba(14,66,210,0.3)]"
+                                            <div class="absolute bottom-0 w-full bg-slate-300 bar-animate shadow-sm"
                                                 data-height="100" style="height: 0%;"></div>
                                         </div>
                                     </div>
                                     <div
                                         class="mt-4 text-center flex-shrink-0 transition-transform group-hover:-translate-y-1">
-                                        <div class="!text-slate-800 text-lg">100%</div>
-                                        <div class="text-xs !text-slate-500 mt-1 font-medium">GCC</div>
+                                        <div class="text-slate-700 font-extrabold text-lg">100%</div>
+                                        <div class="text-xs text-slate-500 mt-1 font-bold">GCC</div>
                                     </div>
                                 </div>
 
                                 <!-- Bar 2: Zc/Zicond 80% -->
                                 <div class="flex-1 flex flex-col items-center h-full group">
                                     <div class="flex-1 w-full flex items-end justify-center">
-                                        <div class="w-10 sm:w-12 md:w-16 bg-blue-900/30 rounded-t-xl relative overflow-hidden transform group-hover:scale-x-105 transition-transform"
+                                        <div class="w-10 sm:w-12 md:w-16 bg-blue-50/50 rounded-t-xl relative overflow-hidden transform group-hover:scale-x-105 transition-transform"
                                             style="height: 100%;">
-                                            <div class="absolute bottom-0 w-full bg-blue-600 bar-animate shadow-[0_-5px_15px_rgba(37,99,235,0.3)]"
+                                            <div class="absolute bottom-0 w-full bg-blue-400 bar-animate shadow-sm"
                                                 data-height="80" style="height: 0%;"></div>
                                         </div>
                                     </div>
                                     <div
                                         class="mt-4 text-center flex-shrink-0 transition-transform group-hover:-translate-y-1">
-                                        <div class="!text-slate-800 text-lg">80%</div>
+                                        <div class="text-blue-600 font-extrabold text-lg">80%</div>
                                         <div
-                                            class="text-xs !text-slate-500 mt-1 font-medium glass-panel/50 px-2 py-0.5 rounded-full inline-block">
+                                            class="text-xs text-blue-700 mt-1 font-bold bg-blue-50 border border-blue-100 px-2 py-0.5 rounded-full inline-block">
                                             Zc/Zicond Ext</div>
                                     </div>
                                 </div>
@@ -354,17 +361,17 @@
                                 <!-- Bar 3: Wing Code Density 75% -->
                                 <div class="flex-1 flex flex-col items-center h-full group">
                                     <div class="flex-1 w-full flex items-end justify-center">
-                                        <div class="w-10 sm:w-12 md:w-16 bg-blue-900/30 rounded-t-xl relative overflow-hidden transform group-hover:scale-x-105 transition-transform"
+                                        <div class="w-10 sm:w-12 md:w-16 bg-blue-50/50 rounded-t-xl relative overflow-hidden transform group-hover:scale-x-105 transition-transform"
                                             style="height: 100%;">
-                                            <div class="absolute bottom-0 w-full bg-blue-500 bar-animate shadow-[0_-5px_15px_rgba(59,130,246,0.4)]"
+                                            <div class="absolute bottom-0 w-full bg-blue-500 bar-animate shadow-sm"
                                                 data-height="75" style="height: 0%;"></div>
                                         </div>
                                     </div>
                                     <div
                                         class="mt-4 text-center flex-shrink-0 transition-transform group-hover:-translate-y-1">
-                                        <div class="!text-slate-800 text-lg">75%</div>
+                                        <div class="text-blue-700 font-extrabold text-lg">75%</div>
                                         <div
-                                            class="text-xs !text-slate-500 mt-1 font-medium glass-panel/50 px-2 py-0.5 rounded-full inline-block">
+                                            class="text-xs text-blue-800 mt-1 font-bold bg-blue-100 border border-blue-200 px-2 py-0.5 rounded-full inline-block">
                                             Wing Code Density</div>
                                     </div>
                                 </div>
@@ -372,19 +379,19 @@
                                 <!-- Bar 4: 最终优化 70% -->
                                 <div class="flex-1 flex flex-col items-center h-full group">
                                     <div class="flex-1 w-full flex items-end justify-center">
-                                        <div class="w-10 sm:w-12 md:w-16 bg-blue-900/30 rounded-t-xl relative overflow-hidden transform group-hover:scale-x-105 transition-transform"
+                                        <div class="w-10 sm:w-12 md:w-16 bg-blue-50/50 rounded-t-xl relative overflow-hidden transform group-hover:scale-x-105 transition-transform"
                                             style="height: 100%;">
-                                            <div class="absolute bottom-0 w-full bg-gradient-to-t from-primary to-accent bar-animate shadow-[0_-5px_20px_rgba(105,177,255,0.5)]"
+                                            <div class="absolute bottom-0 w-full bg-gradient-to-t from-blue-600 to-blue-400 bar-animate shadow-md"
                                                 data-height="70" style="height: 0%;"></div>
                                         </div>
                                     </div>
                                     <div
                                         class="mt-4 text-center flex-shrink-0 transition-transform group-hover:-translate-y-1">
                                         <div
-                                            class="!text-slate-800 text-xl drop-shadow-[0_0_8px_rgba(105,177,255,0.8)] !text-accent">
+                                            class="text-blue-800 font-extrabold text-xl">
                                             70%</div>
                                         <div
-                                            class="text-sm !text-slate-800 mt-1 font-bold bg-primary/20 border border-primary/30 px-2 py-0.5 rounded-full inline-block">
+                                            class="text-sm text-white mt-1 font-bold bg-blue-600 shadow-sm px-2 py-0.5 rounded-full inline-block">
                                             最终优化</div>
                                     </div>
                                 </div>
@@ -392,14 +399,14 @@
 
                             <!-- 流程箭头指示 -->
                             <div
-                                class="mt-6 flex justify-between items-center text-xs sm:text-sm !text-slate-500 px-1 sm:px-2 pt-2">
-                                <div class="text-center font-medium">基础编译器</div>
-                                <div class="text-gray-600"><i class="fa fa-angle-right"></i></div>
-                                <div class="text-center font-medium">标准扩展</div>
-                                <div class="text-gray-600"><i class="fa fa-angle-right"></i></div>
-                                <div class="text-center font-medium">Wing 专有扩展</div>
-                                <div class="text-gray-600"><i class="fa fa-angle-right"></i></div>
-                                <div class="text-center font-bold !text-primary">极致密度</div>
+                                class="mt-6 flex justify-between items-center text-xs sm:text-sm text-slate-400 font-bold px-1 sm:px-2 pt-2">
+                                <div class="text-center">基础编译器</div>
+                                <div class="text-slate-300"><i class="fa fa-angle-right"></i></div>
+                                <div class="text-center">标准扩展</div>
+                                <div class="text-slate-300"><i class="fa fa-angle-right"></i></div>
+                                <div class="text-center">Wing 专有扩展</div>
+                                <div class="text-slate-300"><i class="fa fa-angle-right"></i></div>
+                                <div class="text-center text-blue-600">极致密度</div>
                             </div>
                         </div>
                     </div>
@@ -412,22 +419,22 @@
         <div id="imageModal" class="fixed inset-0 z-50 hidden" aria-labelledby="modal-title" role="dialog"
             aria-modal="true">
             <!-- 遮罩层 backdrop -->
-            <div class="fixed inset-0 bg-black/80 backdrop-blur-sm transition-opacity" onclick="closeModal()"></div>
+            <div class="fixed inset-0 bg-white/60 backdrop-blur-md transition-opacity" onclick="closeModal()"></div>
 
             <div class="flex min-h-full items-center justify-center p-4 text-center sm:p-0 pointer-events-none">
                 <div
-                    class="relative transform overflow-hidden rounded-lg glass-panel text-left shadow-2xl transition-all sm:my-8 sm:w-full sm:max-w-4xl pointer-events-auto border border-slate-200">
+                    class="relative transform overflow-hidden rounded-2xl bg-white text-left shadow-2xl transition-all sm:my-8 sm:w-full sm:max-w-4xl pointer-events-auto border border-slate-200">
                     <!-- 关闭按钮 -->
                     <button onclick="closeModal()"
-                        class="absolute top-4 right-4 text-slate-500 hover:text-slate-800 z-10 bg-black/50 rounded-full w-8 h-8 flex items-center justify-center transition-colors">
+                        class="absolute top-4 right-4 text-slate-500 hover:text-slate-800 z-10 bg-slate-100 rounded-full w-8 h-8 flex items-center justify-center transition-colors shadow-sm">
                         <i class="fa fa-times"></i>
                     </button>
 
                     <!-- 图片内容区 -->
-                    <div class="p-1 glass-panel">
+                    <div class="p-4 bg-white/50 backdrop-blur-sm">
                         <!-- 这里 src 替换为您实际的对比图地址 -->
                         <img src="https://www.beiyuxing.live/wp-content/uploads/2025/12/社区贡献2.png"
-                            alt="Community Contribution Comparison" class="w-full h-auto rounded-md">
+                            alt="Community Contribution Comparison" class="w-full h-auto rounded-xl">
                     </div>
                 </div>
             </div>
diff --git a/contact.html b/contact.html
index b9b6ae3..653eb85 100644
--- a/contact.html
+++ b/contact.html
@@ -23,9 +23,9 @@
                         accent: '#69b1ff',
                         dark: '#0f172a',
                         light: '#f8fafc',
-                        darkBg: '#ffffff',
-                        darkerBg: '#f8fafc',
-                        darkCard: '#ffffff'
+                        darkBg: '#1e293b',
+                        darkerBg: '#0f172a',
+                        darkCard: '#334155'
                     },
                     fontFamily: {
                         inter: ['Inter', 'sans-serif'],
@@ -36,8 +36,22 @@
     </script>
     <style type="text/tailwindcss">
         @layer utilities {
+            .glass-panel {
+                background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
+                backdrop-filter: blur(16px);
+                -webkit-backdrop-filter: blur(16px);
+                border: 1px solid rgba(255, 255, 255, 0.9);
+                box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
+            }
+            .glass-panel-light {
+                background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
+                border: 1px solid rgba(255, 255, 255, 1);
+                box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
+            }
             .text-shadow {
-                text-shadow: 0 2px 4px rgba(0,0,0,0.1);
+                text-shadow: 0 2px 4px rgba(0,0,0,0.05);
             }
             .text-gradient {
                 background-clip: text;
@@ -49,8 +63,8 @@
     <style>
         /* ========== WordPress 样式覆盖 ========== */
         .contact-section p,
-        .contact-section p.text-slate-500,
-        .contact-section .text-slate-500 {
+        .contact-section p.text-slate-600 font-medium,
+        .contact-section .text-slate-600 font-medium {
             margin: 0 !important;
             padding: 0 !important;
             margin-bottom: 0 !important;
@@ -112,7 +126,7 @@
             min-height: 400px;
             background-color: #ffffff;
             border-radius: 12px;
-            border: 1px solid #e2e8f0; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);;
+            border: 1px solid #e2e8f0;
             overflow: hidden;
             position: relative;
         }
@@ -132,7 +146,7 @@
             left: 0;
             right: 0;
             padding: 12px 16px;
-            background: linear-gradient(to bottom, rgba(15, 23, 42, 0.95), rgba(15, 23, 42, 0));
+            background: linear-gradient(to bottom, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0));
             z-index: 10;
             display: flex;
             justify-content: space-between;
@@ -140,7 +154,7 @@
         }
         
         .map-panel-header h4 {
-            color: #0f172a;
+            color: #1e293b;
             font-size: 14px;
             font-weight: 600;
             display: flex;
@@ -263,46 +277,53 @@
         }
     </style>
 </head>
-<body class="font-inter bg-darkerBg text-slate-700 min-h-screen">
+<body class="font-inter bg-slate-50 text-slate-800 min-h-screen relative">
+    <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
+    <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
+        <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
+        <div class="absolute bottom-[-10%] right-[-10%] w-[40%] h-[40%] rounded-full bg-sky-200/40 blur-[100px]"></div>
+        <div class="absolute top-[40%] right-[10%] w-[30%] h-[30%] rounded-full bg-indigo-100/60 blur-[80px]"></div>
+        <div class="absolute bottom-[20%] left-[20%] w-[30%] h-[30%] rounded-full bg-blue-100/50 blur-[80px]"></div>
+    </div>
     <!-- 联系我们 -->
-    <section class="contact-section py-16 md:py-24 bg-darkBg">
+    <section class="contact-section py-16 md:py-24 relative z-10">
         <div class="container mx-auto px-4 md:px-6 lg:px-8">
             <div class="text-center mb-12">
-                <h2 class="text-3xl font-bold mb-6 text-slate-900" style="margin-bottom: 24px !important;">联系我们</h2>
-                <p class="section-desc text-slate-500 max-w-2xl mx-auto" style="margin: 0 auto !important;">
+                <h2 class="text-3xl font-bold mb-6 text-slate-800" style="margin-bottom: 24px !important;">联系我们</h2>
+                <p class="section-desc text-slate-600 font-medium max-w-2xl mx-auto" style="margin: 0 auto !important;">
                     如果您想了解更多关于我们的产品和服务，或者有任何合作意向，欢迎随时与我们联系
                 </p>
             </div>
             <div class="max-w-6xl mx-auto">
-                <div class="bg-darkCard shadow-lg p-8 rounded-xl shadow-lg border border-slate-200">
+                <div class="glass-panel-light border border-white p-8 rounded-xl shadow-lg border border-slate-200">
                     <!-- 联系信息区域 -->
                     <div class="contact-info-grid mb-8 pb-8 border-b border-slate-200">
                         <div class="contact-info-card flex items-start space-x-4">
-                            <div class="w-12 h-12 bg-primary/10 rounded-full flex items-center justify-center flex-shrink-0">
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center flex-shrink-0">
                                 <i class="fa fa-phone text-primary text-xl"></i>
                             </div>
                             <div>
-                                <h3 class="text-lg font-semibold text-slate-900" style="margin: 0 0 8px 0 !important;">热线电话</h3>
-                                <p class="text-slate-500 text-base" style="margin: 0 !important; line-height: 1.6 !important;">025-58181916</p>
-                                <p class="text-slate-500 text-base" style="margin: 0 !important; line-height: 1.6 !important;">0755-86978994</p>
+                                <h3 class="text-lg font-semibold text-slate-800" style="margin: 0 0 8px 0 !important;">热线电话</h3>
+                                <p class="text-slate-600 font-medium text-base" style="margin: 0 !important; line-height: 1.6 !important;">025-58181916</p>
+                                <p class="text-slate-600 font-medium text-base" style="margin: 0 !important; line-height: 1.6 !important;">0755-86978994</p>
                             </div>
                         </div>
                         
                         <div class="contact-info-card flex items-start space-x-4">
-                            <div class="w-12 h-12 bg-primary/10 rounded-full flex items-center justify-center flex-shrink-0">
+                            <div class="w-12 h-12 bg-blue-100 border border-blue-200 rounded-full flex items-center justify-center flex-shrink-0">
                                 <i class="fa fa-user-o text-primary text-xl"></i>
                             </div>
                             <div>
-                                <h3 class="text-lg font-semibold text-slate-900" style="margin: 0 0 8px 0 !important;">商务代表</h3>
-                                <p class="text-slate-500 text-base" style="margin: 0 !important; line-height: 1.6 !important;">Jack 吴 | 17372837832</p>
-                                <p class="text-slate-500 text-base" style="margin: 0 !important; line-height: 1.6 !important;">jack.wu@wingsemitech.com</p>
+                                <h3 class="text-lg font-semibold text-slate-800" style="margin: 0 0 8px 0 !important;">商务代表</h3>
+                                <p class="text-slate-600 font-medium text-base" style="margin: 0 !important; line-height: 1.6 !important;">Jack 吴 | 17372837832</p>
+                                <p class="text-slate-600 font-medium text-base" style="margin: 0 !important; line-height: 1.6 !important;">jack.wu@wingsemitech.com</p>
                             </div>
                         </div>
                     </div>
                     
                     <!-- 办公地址区域 -->
                     <div>
-                        <h3 class="text-lg font-semibold mb-6 text-slate-900 flex items-center" style="margin-bottom: 24px !important;">
+                        <h3 class="text-lg font-semibold mb-6 text-slate-800 flex items-center" style="margin-bottom: 24px !important;">
                             <i class="fa fa-map-marker text-primary mr-2"></i>
                             办公地址
                             <span class="text-xs text-gray-500 ml-2 font-normal">（点击切换查看不同城市）</span>
@@ -312,68 +333,68 @@
                             <!-- 地址列表 -->
                             <div class="address-list space-y-3" id="addressList">
                                 <!-- 广州办公室 - 默认激活 -->
-                                <div class="address-card active p-4 border border-slate-200 rounded-lg" 
+                                <div class="address-card active p-4 border border-blue-400 bg-blue-50/80 rounded-lg backdrop-blur-sm" 
                                      data-city="guangzhou" 
                                      data-title="广州办公室"
                                      data-address="广州市海珠区新港东路2429号三层319-320房">
                                     <div class="flex items-center">
-                                        <div class="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center flex-shrink-0 mr-3">
+                                        <div class="w-10 h-10 bg-blue-100 border border-blue-200 rounded-lg flex items-center justify-center flex-shrink-0 mr-3">
                                             <i class="fa fa-building-o text-primary card-icon"></i>
                                         </div>
                                         <div class="flex-1">
-                                            <h4 class="font-medium text-slate-900 text-base" style="margin: 0 !important;">广州市</h4>
-                                            <p class="text-slate-500 text-sm" style="margin: 4px 0 0 0 !important;">海珠区新港东路2429号三层319-320房</p>
+                                            <h4 class="font-medium text-slate-800 text-base" style="margin: 0 !important;">广州市</h4>
+                                            <p class="text-slate-600 font-medium text-sm" style="margin: 4px 0 0 0 !important;">海珠区新港东路2429号三层319-320房</p>
                                         </div>
                                         <i class="fa fa-chevron-right text-gray-500 text-xs ml-2"></i>
                                     </div>
                                 </div>
                                 
                                 <!-- 上海办公室 -->
-                                <div class="address-card p-4 border border-slate-200 rounded-lg" 
+                                <div class="address-card p-4 border border-slate-200 rounded-lg hover:bg-blue-50/50 bg-white/60 backdrop-blur-sm" 
                                      data-city="shanghai" 
                                      data-title="上海办公室"
                                      data-address="上海市浦东新区郭守敬路498号19号楼502室">
                                     <div class="flex items-center">
-                                        <div class="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center flex-shrink-0 mr-3">
+                                        <div class="w-10 h-10 bg-blue-100 border border-blue-200 rounded-lg flex items-center justify-center flex-shrink-0 mr-3">
                                             <i class="fa fa-building-o text-primary card-icon"></i>
                                         </div>
                                         <div class="flex-1">
-                                            <h4 class="font-medium text-slate-900 text-base" style="margin: 0 !important;">上海市</h4>
-                                            <p class="text-slate-500 text-sm" style="margin: 4px 0 0 0 !important;">浦东新区郭守敬路498号19号楼502室</p>
+                                            <h4 class="font-medium text-slate-800 text-base" style="margin: 0 !important;">上海市</h4>
+                                            <p class="text-slate-600 font-medium text-sm" style="margin: 4px 0 0 0 !important;">浦东新区郭守敬路498号19号楼502室</p>
                                         </div>
                                         <i class="fa fa-chevron-right text-gray-500 text-xs ml-2"></i>
                                     </div>
                                 </div>
                                 
                                 <!-- 深圳办公室 -->
-                                <div class="address-card p-4 border border-slate-200 rounded-lg" 
+                                <div class="address-card p-4 border border-slate-200 rounded-lg hover:bg-blue-50/50 bg-white/60 backdrop-blur-sm" 
                                      data-city="shenzhen" 
                                      data-title="深圳办公室"
                                      data-address="深圳市南山区科苑路16号东方科技大厦809室">
                                     <div class="flex items-center">
-                                        <div class="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center flex-shrink-0 mr-3">
+                                        <div class="w-10 h-10 bg-blue-100 border border-blue-200 rounded-lg flex items-center justify-center flex-shrink-0 mr-3">
                                             <i class="fa fa-building-o text-primary card-icon"></i>
                                         </div>
                                         <div class="flex-1">
-                                            <h4 class="font-medium text-slate-900 text-base" style="margin: 0 !important;">深圳市</h4>
-                                            <p class="text-slate-500 text-sm" style="margin: 4px 0 0 0 !important;">南山区科苑路16号东方科技大厦809室</p>
+                                            <h4 class="font-medium text-slate-800 text-base" style="margin: 0 !important;">深圳市</h4>
+                                            <p class="text-slate-600 font-medium text-sm" style="margin: 4px 0 0 0 !important;">南山区科苑路16号东方科技大厦809室</p>
                                         </div>
                                         <i class="fa fa-chevron-right text-gray-500 text-xs ml-2"></i>
                                     </div>
                                 </div>
                                 
                                 <!-- 珠海办公室 -->
-                                <div class="address-card p-4 border border-slate-200 rounded-lg" 
+                                <div class="address-card p-4 border border-slate-200 rounded-lg hover:bg-blue-50/50 bg-white/60 backdrop-blur-sm" 
                                      data-city="zhuhai" 
                                      data-title="珠海办公室"
                                      data-address="珠海市横琴区国际科技创新中心7栋607-1室">
                                     <div class="flex items-center">
-                                        <div class="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center flex-shrink-0 mr-3">
+                                        <div class="w-10 h-10 bg-blue-100 border border-blue-200 rounded-lg flex items-center justify-center flex-shrink-0 mr-3">
                                             <i class="fa fa-building-o text-primary card-icon"></i>
                                         </div>
                                         <div class="flex-1">
-                                            <h4 class="font-medium text-slate-900 text-base" style="margin: 0 !important;">珠海市</h4>
-                                            <p class="text-slate-500 text-sm" style="margin: 4px 0 0 0 !important;">横琴区国际科技创新中心7栋607-1室</p>
+                                            <h4 class="font-medium text-slate-800 text-base" style="margin: 0 !important;">珠海市</h4>
+                                            <p class="text-slate-600 font-medium text-sm" style="margin: 4px 0 0 0 !important;">横琴区国际科技创新中心7栋607-1室</p>
                                         </div>
                                         <i class="fa fa-chevron-right text-gray-500 text-xs ml-2"></i>
                                     </div>
@@ -401,7 +422,7 @@
                     </div>
                 </div>
                 <div class="text-center mt-10">
-                    <div class="inline-block px-6 py-3 bg-primary text-slate-900 rounded-lg hover:bg-primary/90 transition-colors shadow-lg hover:shadow-xl font-medium text-lg cursor-pointer popupbox">
+                    <div class="inline-block px-6 py-3 bg-primary text-slate-800 rounded-lg hover:bg-primary/90 transition-colors shadow-lg hover:shadow-xl font-medium text-lg cursor-pointer popupbox">
                         联系我们
                     </div>
                 </div>
diff --git a/header_footer_dark.html b/header_footer.html
similarity index 80%
rename from header_footer_dark.html
rename to header_footer.html
index e2c6de4..f3c9b8c 100644
--- a/header_footer_dark.html
+++ b/header_footer.html
@@ -26,9 +26,9 @@
                         accent: '#69b1ff',
                         dark: '#0f172a',
                         light: '#f8fafc',
-                        darkBg: '#ffffff',
-                        darkerBg: '#f8fafc',
-                        darkCard: '#ffffff'
+                        darkBg: '#1e293b',
+                        darkerBg: '#0f172a',
+                        darkCard: '#334155'
                     },
                     fontFamily: {
                         inter: ['Inter', 'sans-serif'],
@@ -283,10 +283,10 @@
     </style>
 </head>
 
-<body class="font-inter bg-slate-50 text-slate-700 min-h-screen flex flex-col">
+<body class="font-inter bg-darkerBg text-gray-200 min-h-screen flex flex-col">
     <!-- 导航栏（页眉） -->
     <header id="navbar"
-        class="fixed w-full top-0 z-50 transition-all duration-300 bg-white/70 backdrop-blur-sm shadow-md">
+        class="fixed w-full top-0 z-50 transition-all duration-300 bg-darkBg/70 backdrop-blur-sm shadow-md">
         <!-- 去除max-w限制和特殊padding，使其与页脚对齐并让logo和菜单分开更远 -->
         <div class="container mx-auto px-4 sm:px-6 lg:px-8">
             <div class="flex justify-between items-center py-4">
@@ -305,39 +305,39 @@
                     <!-- 首页 -->
                     <div class="relative group">
                         <a href="https://www.beiyuxing.live/"
-                            class="py-2 px-1 text-sm font-medium text-slate-600 hover:text-slate-900 transition-colors">首页</a>
+                            class="py-2 px-1 text-sm font-medium text-gray-300 hover:text-white transition-colors">首页</a>
                     </div>
 
                     <!-- 产品中心 -->
                     <div class="relative group nav-mega-menu">
                         <a
-                            class="py-2 px-1 text-sm font-medium text-slate-600 hover:text-slate-900 transition-colors flex items-center cursor-pointer">
+                            class="py-2 px-1 text-sm font-medium text-gray-300 hover:text-white transition-colors flex items-center cursor-pointer">
                             产品中心
                             <i
                                 class="fa fa-chevron-down ml-1 text-xs transition-transform group-hover:rotate-180 duration-300"></i>
                         </a>
                         <!-- 全宽度下拉菜单 -->
                         <div
-                            class="mega-dropdown fixed left-0 right-0 mt-0 bg-white shadow-md/95 backdrop-blur-md shadow-2xl overflow-visible opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 transform origin-top scale-y-95 group-hover:scale-y-100 z-50 border-t border-b border-slate-200">
+                            class="mega-dropdown fixed left-0 right-0 mt-0 bg-darkCard/95 backdrop-blur-md shadow-2xl overflow-visible opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 transform origin-top scale-y-95 group-hover:scale-y-100 z-50 border-t border-b border-gray-700">
                             <div class="container mx-auto px-8 py-8 max-w-7xl">
                                 <div class="grid grid-cols-3 gap-6 max-w-4xl mx-auto">
                                     <!-- RISC-V处理器IP带三级菜单 -->
                                     <div class="relative dropdown-submenu col-span-1">
                                         <a
-                                            class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-slate-100/50 hover:bg-slate-200/50 transition-all duration-300 text-center group/item cursor-pointer border border-slate-200/50 hover:border-gray-600">
+                                            class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item cursor-pointer border border-gray-700/50 hover:border-gray-600">
                                             <div
                                                 class="w-14 h-14 rounded-xl bg-gradient-to-br from-blue-500/20 to-purple-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
                                                 <i
-                                                    class="fa fa-microchip text-2xl text-slate-600 group-hover/item:text-slate-900"></i>
+                                                    class="fa fa-microchip text-2xl text-gray-300 group-hover/item:text-white"></i>
                                             </div>
                                             <span
-                                                class="text-sm font-medium text-slate-600 group-hover/item:text-slate-900">RISC-V处理器IP</span>
+                                                class="text-sm font-medium text-gray-300 group-hover/item:text-white">RISC-V处理器IP</span>
                                             <i
-                                                class="fa fa-chevron-right mt-2 text-xs text-slate-400 group-hover/item:text-slate-900 transition-colors"></i>
+                                                class="fa fa-chevron-right mt-2 text-xs text-gray-500 group-hover/item:text-white transition-colors"></i>
                                         </a>
                                         <!-- 三级菜单 - 三列布局 -->
                                         <div
-                                            class="submenu submenu-level-3 absolute left-full top-0 ml-2 bg-white shadow-md rounded-xl shadow-2xl overflow-hidden opacity-0 invisible transition-all duration-300 w-[420px] border border-slate-200">
+                                            class="submenu submenu-level-3 absolute left-full top-0 ml-2 bg-darkCard rounded-xl shadow-2xl overflow-hidden opacity-0 invisible transition-all duration-300 w-[420px] border border-gray-700">
                                             <div class="grid grid-cols-3 gap-1 p-4">
                                                 <!-- 通用处理器IP -->
                                                 <div class="p-2">
@@ -345,13 +345,13 @@
                                                         class="px-3 py-2 text-xs font-semibold text-primary border-b border-primary/20 mb-2">
                                                         通用处理器IP</div>
                                                     <a href="https://www.beiyuxing.live/wing-m050/"
-                                                        class="block py-2 px-3 text-xs text-slate-600 hover:bg-slate-200 hover:text-slate-900 rounded transition-colors">Wing-M050</a>
+                                                        class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M050</a>
                                                     <a href="https://www.beiyuxing.live/wing-m130/"
-                                                        class="block py-2 px-3 text-xs text-slate-600 hover:bg-slate-200 hover:text-slate-900 rounded transition-colors">Wing-M130</a>
+                                                        class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M130</a>
                                                     <a href="https://www.beiyuxing.live/wing-m510/"
-                                                        class="block py-2 px-3 text-xs text-slate-600 hover:bg-slate-200 hover:text-slate-900 rounded transition-colors">Wing-M510</a>
+                                                        class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M510</a>
                                                     <a href="https://www.beiyuxing.live/wing-a500/"
-                                                        class="block py-2 px-3 text-xs text-slate-600 hover:bg-slate-200 hover:text-slate-900 rounded transition-colors">Wing-A500</a>
+                                                        class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-A500</a>
 
                                                 </div>
                                                 <!-- 车规处理器IP -->
@@ -361,7 +361,7 @@
                                                         车规处理器IP</div>
 
                                                     <a href="https://www.beiyuxing.live/wing-m130a/"
-                                                        class="block py-2 px-3 text-xs text-slate-600 hover:bg-slate-200 hover:text-slate-900 rounded transition-colors">Wing-M130A</a>
+                                                        class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M130A</a>
 
                                                 </div>
                                                 <!-- 安全处理器IP -->
@@ -370,34 +370,34 @@
                                                         class="px-3 py-2 text-xs font-semibold text-primary border-b border-primary/20 mb-2">
                                                         安全处理器IP</div>
                                                     <a href="https://www.beiyuxing.live/wing-m050s/"
-                                                        class="block py-2 px-3 text-xs text-slate-600 hover:bg-slate-200 hover:text-slate-900 rounded transition-colors">Wing-M050S</a>
+                                                        class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M050S</a>
                                                     <a href="https://www.beiyuxing.live/wing-m130s/"
-                                                        class="block py-2 px-3 text-xs text-slate-600 hover:bg-slate-200 hover:text-slate-900 rounded transition-colors">Wing-M130S</a>
+                                                        class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M130S</a>
                                                 </div>
                                             </div>
                                         </div>
                                     </div>
                                     <!-- ArchitStudio开发平台 -->
                                     <a href="https://www.beiyuxing.live/architstudio-2/"
-                                        class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-slate-100/50 hover:bg-slate-200/50 transition-all duration-300 text-center group/item border border-slate-200/50 hover:border-gray-600">
+                                        class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item border border-gray-700/50 hover:border-gray-600">
                                         <div
                                             class="w-14 h-14 rounded-xl bg-gradient-to-br from-green-500/20 to-teal-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
                                             <i
-                                                class="fa fa-desktop text-2xl text-slate-600 group-hover/item:text-slate-900"></i>
+                                                class="fa fa-desktop text-2xl text-gray-300 group-hover/item:text-white"></i>
                                         </div>
                                         <span
-                                            class="text-sm font-medium text-slate-600 group-hover/item:text-slate-900">ArchitStudio开发平台</span>
+                                            class="text-sm font-medium text-gray-300 group-hover/item:text-white">ArchitStudio开发平台</span>
                                     </a>
                                     <!-- 智翼端侧AI解决方案 -->
                                     <a href="https://www.beiyuxing.live/%e6%99%ba%e7%bf%bc%e7%ab%af%e4%be%a7ai%e8%a7%a3%e5%86%b3%e6%96%b9%e6%a1%88/"
-                                        class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-slate-100/50 hover:bg-slate-200/50 transition-all duration-300 text-center group/item border border-slate-200/50 hover:border-gray-600">
+                                        class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item border border-gray-700/50 hover:border-gray-600">
                                         <div
                                             class="w-14 h-14 rounded-xl bg-gradient-to-br from-orange-500/20 to-red-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
                                             <i
-                                                class="fa fa-lightbulb-o text-2xl text-slate-600 group-hover/item:text-slate-900"></i>
+                                                class="fa fa-lightbulb-o text-2xl text-gray-300 group-hover/item:text-white"></i>
                                         </div>
                                         <span
-                                            class="text-sm font-medium text-slate-600 group-hover/item:text-slate-900">智翼端侧AI解决方案</span>
+                                            class="text-sm font-medium text-gray-300 group-hover/item:text-white">智翼端侧AI解决方案</span>
                                     </a>
                                 </div>
                             </div>
@@ -407,55 +407,55 @@
                     <!-- 技术中心 -->
                     <div class="relative group nav-mega-menu">
                         <a
-                            class="py-2 px-1 text-sm font-medium text-slate-600 hover:text-slate-900 transition-colors flex items-center cursor-pointer">
+                            class="py-2 px-1 text-sm font-medium text-gray-300 hover:text-white transition-colors flex items-center cursor-pointer">
                             技术中心
                             <i
                                 class="fa fa-chevron-down ml-1 text-xs transition-transform group-hover:rotate-180 duration-300"></i>
                         </a>
                         <!-- 全宽度下拉菜单 -->
                         <div
-                            class="mega-dropdown fixed left-0 right-0 mt-0 bg-white shadow-md/95 backdrop-blur-md shadow-2xl overflow-visible opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 transform origin-top scale-y-95 group-hover:scale-y-100 z-50 border-t border-b border-slate-200">
+                            class="mega-dropdown fixed left-0 right-0 mt-0 bg-darkCard/95 backdrop-blur-md shadow-2xl overflow-visible opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 transform origin-top scale-y-95 group-hover:scale-y-100 z-50 border-t border-b border-gray-700">
                             <div class="container mx-auto px-8 py-8 max-w-7xl">
                                 <div class="grid grid-cols-3 gap-6 max-w-3xl mx-auto">
                                     <!-- IP相关技术带三级菜单 -->
                                     <div class="relative dropdown-submenu">
                                         <a
-                                            class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-slate-100/50 hover:bg-slate-200/50 transition-all duration-300 text-center group/item cursor-pointer border border-slate-200/50 hover:border-gray-600">
+                                            class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item cursor-pointer border border-gray-700/50 hover:border-gray-600">
                                             <div
                                                 class="w-14 h-14 rounded-xl bg-gradient-to-br from-indigo-500/20 to-blue-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
                                                 <i
-                                                    class="fa fa-cogs text-2xl text-slate-600 group-hover/item:text-slate-900"></i>
+                                                    class="fa fa-cogs text-2xl text-gray-300 group-hover/item:text-white"></i>
                                             </div>
                                             <span
-                                                class="text-sm font-medium text-slate-600 group-hover/item:text-slate-900">IP相关技术</span>
+                                                class="text-sm font-medium text-gray-300 group-hover/item:text-white">IP相关技术</span>
                                             <i
-                                                class="fa fa-chevron-right mt-2 text-xs text-slate-400 group-hover/item:text-slate-900 transition-colors"></i>
+                                                class="fa fa-chevron-right mt-2 text-xs text-gray-500 group-hover/item:text-white transition-colors"></i>
                                         </a>
                                         <!-- 三级菜单 -->
                                         <div
-                                            class="submenu submenu-level-3 absolute left-full top-0 ml-2 bg-white shadow-md rounded-xl shadow-2xl overflow-hidden opacity-0 invisible transition-all duration-300 w-56 border border-slate-200">
+                                            class="submenu submenu-level-3 absolute left-full top-0 ml-2 bg-darkCard rounded-xl shadow-2xl overflow-hidden opacity-0 invisible transition-all duration-300 w-56 border border-gray-700">
                                             <a href="https://www.beiyuxing.live/%e4%bb%a3%e7%a0%81%e5%8e%8b%e7%bc%a9%e6%8a%80%e6%9c%af/"
-                                                class="flex items-center px-5 py-4 text-sm text-slate-600 hover:bg-slate-200 hover:text-slate-900 transition-colors">
-                                                <i class="fa fa-compress mr-3 text-slate-500"></i>
+                                                class="flex items-center px-5 py-4 text-sm text-gray-300 hover:bg-white/10 hover:text-white transition-colors">
+                                                <i class="fa fa-compress mr-3 text-gray-400"></i>
                                                 代码压缩技术
                                             </a>
                                             <a href="https://www.beiyuxing.live/%e4%b8%ad%e6%96%ad%e5%ae%9e%e6%97%b6%e6%80%a7%e6%8a%80%e6%9c%af/"
-                                                class="flex items-center px-5 py-4 text-sm text-slate-600 hover:bg-slate-200 hover:text-slate-900 transition-colors">
-                                                <i class="fa fa-bolt mr-3 text-slate-500"></i>
+                                                class="flex items-center px-5 py-4 text-sm text-gray-300 hover:bg-white/10 hover:text-white transition-colors">
+                                                <i class="fa fa-bolt mr-3 text-gray-400"></i>
                                                 中断实时性技术
                                             </a>
                                         </div>
                                     </div>
                                     <!-- AI融合技术 -->
                                     <a href="https://www.beiyuxing.live/elementor-%e9%a1%b5%e9%9d%a2-1447/"
-                                        class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-slate-100/50 hover:bg-slate-200/50 transition-all duration-300 text-center group/item border border-slate-200/50 hover:border-gray-600">
+                                        class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item border border-gray-700/50 hover:border-gray-600">
                                         <div
                                             class="w-14 h-14 rounded-xl bg-gradient-to-br from-yellow-500/20 to-orange-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
                                             <i
-                                                class="fa fa-magic text-2xl text-slate-600 group-hover/item:text-slate-900"></i>
+                                                class="fa fa-magic text-2xl text-gray-300 group-hover/item:text-white"></i>
                                         </div>
                                         <span
-                                            class="text-sm font-medium text-slate-600 group-hover/item:text-slate-900">AI融合技术</span>
+                                            class="text-sm font-medium text-gray-300 group-hover/item:text-white">AI融合技术</span>
                                     </a>
                                     <!-- 占位 - 保持对称 -->
                                     <div class="hidden"></div>
@@ -467,13 +467,13 @@
                     <!-- 新闻中心 -->
                     <div class="relative group">
                         <a href="https://www.beiyuxing.live/news/"
-                            class="py-2 px-1 text-sm font-medium text-slate-600 hover:text-slate-900 transition-colors">新闻中心</a>
+                            class="py-2 px-1 text-sm font-medium text-gray-300 hover:text-white transition-colors">新闻中心</a>
                     </div>
 
                     <!-- 关于我们 -->
                     <div class="relative group">
                         <a href="https://www.beiyuxing.live/about/"
-                            class="py-2 px-1 text-sm font-medium text-slate-600 hover:text-slate-900 transition-colors">关于我们</a>
+                            class="py-2 px-1 text-sm font-medium text-gray-300 hover:text-white transition-colors">关于我们</a>
                     </div>
 
                     <!-- 加入按钮 -->
@@ -484,7 +484,7 @@
                 <!-- 移动端菜单按钮 -->
                 <div class="tablet:hidden">
                     <button id="mobile-menu-button" type="button"
-                        class="text-slate-600 hover:text-slate-900 transition-colors focus:outline-none p-2">
+                        class="text-gray-300 hover:text-white transition-colors focus:outline-none p-2">
                         <div class="hamburger" id="hamburger-icon">
                             <span></span>
                             <span></span>
@@ -500,11 +500,11 @@
 
         <!-- 移动端导航菜单 -->
         <div id="mobile-menu"
-            class="tablet:hidden bg-gradient-to-b from-white to-slate-50 border-t border-slate-200/50">
+            class="tablet:hidden bg-gradient-to-b from-darkCard to-darkerBg border-t border-gray-700/50">
             <div class="container mx-auto px-4 py-4 space-y-1">
                 <!-- 首页 -->
                 <a href="https://www.beiyuxing.live/"
-                    class="mobile-menu-item mobile-menu-link flex items-center py-3 px-3 text-sm font-medium text-slate-600 hover:text-slate-900 rounded-lg">
+                    class="mobile-menu-item mobile-menu-link flex items-center py-3 px-3 text-sm font-medium text-gray-300 hover:text-white rounded-lg">
                     <div class="menu-icon bg-blue-500/20">
                         <i class="fa fa-home text-blue-400"></i>
                     </div>
@@ -514,7 +514,7 @@
                 <!-- 产品中心移动端菜单 -->
                 <div class="mobile-dropdown mobile-menu-item">
                     <div
-                        class="mobile-menu-link flex items-center justify-between py-3 px-3 text-sm font-medium text-slate-600 hover:text-slate-900 rounded-lg">
+                        class="mobile-menu-link flex items-center justify-between py-3 px-3 text-sm font-medium text-gray-300 hover:text-white rounded-lg">
                         <div class="flex items-center flex-1">
                             <div class="menu-icon bg-green-500/20">
                                 <i class="fa fa-cubes text-green-400"></i>
@@ -522,56 +522,56 @@
                             <span>产品中心</span>
                         </div>
                         <button type="button"
-                            class="mobile-dropdown-toggle w-8 h-8 flex items-center justify-center rounded-full bg-slate-100 hover:bg-slate-200 text-slate-500 hover:text-slate-900 focus:outline-none transition-all"
+                            class="mobile-dropdown-toggle w-8 h-8 flex items-center justify-center rounded-full bg-white/5 hover:bg-white/10 text-gray-400 hover:text-white focus:outline-none transition-all"
                             aria-label="展开菜单">
                             <i class="fa fa-chevron-down text-xs"></i>
                         </button>
                     </div>
-                    <div class="mobile-dropdown-menu pl-6 space-y-1 ml-4 border-l border-slate-200/50">
+                    <div class="mobile-dropdown-menu pl-6 space-y-1 ml-4 border-l border-gray-700/50">
                         <!-- RISC-V处理器IP二级菜单 -->
                         <div class="mobile-dropdown">
                             <div
-                                class="flex items-center justify-between py-2.5 px-3 text-sm font-medium text-slate-600 hover:text-slate-900 rounded-lg hover:bg-slate-100 transition-all">
+                                class="flex items-center justify-between py-2.5 px-3 text-sm font-medium text-gray-300 hover:text-white rounded-lg hover:bg-white/5 transition-all">
                                 <div class="flex items-center">
                                     <i class="fa fa-microchip text-primary mr-3 text-xs"></i>
                                     <span>RISC-V处理器IP</span>
                                 </div>
                                 <button type="button"
-                                    class="mobile-dropdown-toggle w-6 h-6 flex items-center justify-center rounded-full bg-slate-100 hover:bg-slate-200 text-slate-500 hover:text-slate-900 focus:outline-none transition-all"
+                                    class="mobile-dropdown-toggle w-6 h-6 flex items-center justify-center rounded-full bg-white/5 hover:bg-white/10 text-gray-400 hover:text-white focus:outline-none transition-all"
                                     aria-label="展开菜单">
                                     <i class="fa fa-chevron-down text-xs"></i>
                                 </button>
                             </div>
-                            <div class="mobile-dropdown-menu pl-4 space-y-0.5 ml-3 border-l border-slate-200/30">
+                            <div class="mobile-dropdown-menu pl-4 space-y-0.5 ml-3 border-l border-gray-700/30">
                                 <!-- 通用处理器IP -->
                                 <div class="mobile-dropdown">
                                     <div
-                                        class="flex items-center justify-between py-2 px-3 text-sm text-slate-500 hover:text-slate-900 rounded-lg hover:bg-slate-100 transition-all">
+                                        class="flex items-center justify-between py-2 px-3 text-sm text-gray-400 hover:text-white rounded-lg hover:bg-white/5 transition-all">
                                         <span>通用处理器IP</span>
                                         <button type="button"
-                                            class="mobile-dropdown-toggle w-5 h-5 flex items-center justify-center rounded bg-slate-100 text-slate-400 hover:text-slate-900 focus:outline-none transition-all"
+                                            class="mobile-dropdown-toggle w-5 h-5 flex items-center justify-center rounded bg-white/5 text-gray-500 hover:text-white focus:outline-none transition-all"
                                             aria-label="展开菜单">
                                             <i class="fa fa-chevron-down text-xs"></i>
                                         </button>
                                     </div>
                                     <div class="mobile-dropdown-menu pl-4 space-y-0.5 ml-2">
                                         <a href="https://www.beiyuxing.live/wing-m050/"
-                                            class="block py-2 px-3 text-sm text-slate-500 hover:text-slate-900 hover:bg-primary/10 rounded-lg transition-all">Wing-M050</a>
+                                            class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-primary/10 rounded-lg transition-all">Wing-M050</a>
                                         <a href="https://www.beiyuxing.live/wing-m130/"
-                                            class="block py-2 px-3 text-sm text-slate-500 hover:text-slate-900 hover:bg-primary/10 rounded-lg transition-all">Wing-M130</a>
+                                            class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-primary/10 rounded-lg transition-all">Wing-M130</a>
                                         <a href="https://www.beiyuxing.live/wing-m510/"
-                                            class="block py-2 px-3 text-sm text-slate-500 hover:text-slate-900 hover:bg-primary/10 rounded-lg transition-all">Wing-M510</a>
+                                            class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-primary/10 rounded-lg transition-all">Wing-M510</a>
                                         <a href="https://www.beiyuxing.live/wing-a500/"
-                                            class="block py-2 px-3 text-sm text-slate-500 hover:text-slate-900 hover:bg-primary/10 rounded-lg transition-all">Wing-A500</a>
+                                            class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-primary/10 rounded-lg transition-all">Wing-A500</a>
                                     </div>
                                 </div>
                                 <!-- 车规处理器IP -->
                                 <div class="mobile-dropdown">
                                     <div
-                                        class="flex items-center justify-between py-2 px-3 text-sm text-slate-500 hover:text-slate-900 rounded-lg hover:bg-slate-100 transition-all">
+                                        class="flex items-center justify-between py-2 px-3 text-sm text-gray-400 hover:text-white rounded-lg hover:bg-white/5 transition-all">
                                         <span>车规处理器IP</span>
                                         <button type="button"
-                                            class="mobile-dropdown-toggle w-5 h-5 flex items-center justify-center rounded bg-slate-100 text-slate-400 hover:text-slate-900 focus:outline-none transition-all"
+                                            class="mobile-dropdown-toggle w-5 h-5 flex items-center justify-center rounded bg-white/5 text-gray-500 hover:text-white focus:outline-none transition-all"
                                             aria-label="展开菜单">
                                             <i class="fa fa-chevron-down text-xs"></i>
                                         </button>
@@ -579,36 +579,36 @@
                                     <div class="mobile-dropdown-menu pl-4 space-y-0.5 ml-2">
 
                                         <a href="https://www.beiyuxing.live/wing-m130a/"
-                                            class="block py-2 px-3 text-sm text-slate-500 hover:text-slate-900 hover:bg-primary/10 rounded-lg transition-all">Wing-M130A</a>
+                                            class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-primary/10 rounded-lg transition-all">Wing-M130A</a>
                                     </div>
                                 </div>
                                 <!-- 安全处理器IP -->
                                 <div class="mobile-dropdown">
                                     <div
-                                        class="flex items-center justify-between py-2 px-3 text-sm text-slate-500 hover:text-slate-900 rounded-lg hover:bg-slate-100 transition-all">
+                                        class="flex items-center justify-between py-2 px-3 text-sm text-gray-400 hover:text-white rounded-lg hover:bg-white/5 transition-all">
                                         <span>安全处理器IP</span>
                                         <button type="button"
-                                            class="mobile-dropdown-toggle w-5 h-5 flex items-center justify-center rounded bg-slate-100 text-slate-400 hover:text-slate-900 focus:outline-none transition-all"
+                                            class="mobile-dropdown-toggle w-5 h-5 flex items-center justify-center rounded bg-white/5 text-gray-500 hover:text-white focus:outline-none transition-all"
                                             aria-label="展开菜单">
                                             <i class="fa fa-chevron-down text-xs"></i>
                                         </button>
                                     </div>
                                     <div class="mobile-dropdown-menu pl-4 space-y-0.5 ml-2">
                                         <a href="https://www.beiyuxing.live/wing-m050s/"
-                                            class="block py-2 px-3 text-sm text-slate-500 hover:text-slate-900 hover:bg-primary/10 rounded-lg transition-all">Wing-M050S</a>
+                                            class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-primary/10 rounded-lg transition-all">Wing-M050S</a>
                                         <a href="https://www.beiyuxing.live/wing-m130s/"
-                                            class="block py-2 px-3 text-sm text-slate-500 hover:text-slate-900 hover:bg-primary/10 rounded-lg transition-all">Wing-M130S</a>
+                                            class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-primary/10 rounded-lg transition-all">Wing-M130S</a>
                                     </div>
                                 </div>
                             </div>
                         </div>
                         <a href="https://www.beiyuxing.live/architstudio-2/"
-                            class="flex items-center py-2.5 px-3 text-sm text-slate-600 hover:text-slate-900 hover:bg-slate-100 rounded-lg transition-all">
+                            class="flex items-center py-2.5 px-3 text-sm text-gray-300 hover:text-white hover:bg-white/5 rounded-lg transition-all">
                             <i class="fa fa-desktop text-green-400 mr-3 text-xs"></i>
                             ArchitStudio开发平台
                         </a>
                         <a href="https://www.beiyuxing.live/%e6%99%ba%e7%bf%bc%e7%ab%af%e4%be%a7ai%e8%a7%a3%e5%86%b3%e6%96%b9%e6%a1%88/"
-                            class="flex items-center py-2.5 px-3 text-sm text-slate-600 hover:text-slate-900 hover:bg-slate-100 rounded-lg transition-all">
+                            class="flex items-center py-2.5 px-3 text-sm text-gray-300 hover:text-white hover:bg-white/5 rounded-lg transition-all">
                             <i class="fa fa-lightbulb-o text-orange-400 mr-3 text-xs"></i>
                             智翼端侧AI解决方案
                         </a>
@@ -618,7 +618,7 @@
                 <!-- 技术中心移动端菜单 -->
                 <div class="mobile-dropdown mobile-menu-item">
                     <div
-                        class="mobile-menu-link flex items-center justify-between py-3 px-3 text-sm font-medium text-slate-600 hover:text-slate-900 rounded-lg">
+                        class="mobile-menu-link flex items-center justify-between py-3 px-3 text-sm font-medium text-gray-300 hover:text-white rounded-lg">
                         <div class="flex items-center flex-1">
                             <div class="menu-icon bg-purple-500/20">
                                 <i class="fa fa-cogs text-purple-400"></i>
@@ -626,35 +626,35 @@
                             <span>技术中心</span>
                         </div>
                         <button type="button"
-                            class="mobile-dropdown-toggle w-8 h-8 flex items-center justify-center rounded-full bg-slate-100 hover:bg-slate-200 text-slate-500 hover:text-slate-900 focus:outline-none transition-all"
+                            class="mobile-dropdown-toggle w-8 h-8 flex items-center justify-center rounded-full bg-white/5 hover:bg-white/10 text-gray-400 hover:text-white focus:outline-none transition-all"
                             aria-label="展开菜单">
                             <i class="fa fa-chevron-down text-xs"></i>
                         </button>
                     </div>
-                    <div class="mobile-dropdown-menu pl-6 space-y-1 ml-4 border-l border-slate-200/50">
+                    <div class="mobile-dropdown-menu pl-6 space-y-1 ml-4 border-l border-gray-700/50">
                         <!-- IP相关技术二级菜单 -->
                         <div class="mobile-dropdown">
                             <div
-                                class="flex items-center justify-between py-2.5 px-3 text-sm font-medium text-slate-600 hover:text-slate-900 rounded-lg hover:bg-slate-100 transition-all">
+                                class="flex items-center justify-between py-2.5 px-3 text-sm font-medium text-gray-300 hover:text-white rounded-lg hover:bg-white/5 transition-all">
                                 <div class="flex items-center">
                                     <i class="fa fa-puzzle-piece text-indigo-400 mr-3 text-xs"></i>
                                     <span>IP相关技术</span>
                                 </div>
                                 <button type="button"
-                                    class="mobile-dropdown-toggle w-6 h-6 flex items-center justify-center rounded-full bg-slate-100 hover:bg-slate-200 text-slate-500 hover:text-slate-900 focus:outline-none transition-all"
+                                    class="mobile-dropdown-toggle w-6 h-6 flex items-center justify-center rounded-full bg-white/5 hover:bg-white/10 text-gray-400 hover:text-white focus:outline-none transition-all"
                                     aria-label="展开菜单">
                                     <i class="fa fa-chevron-down text-xs"></i>
                                 </button>
                             </div>
-                            <div class="mobile-dropdown-menu pl-4 space-y-0.5 ml-3 border-l border-slate-200/30">
+                            <div class="mobile-dropdown-menu pl-4 space-y-0.5 ml-3 border-l border-gray-700/30">
                                 <a href="https://www.beiyuxing.live/%e4%bb%a3%e7%a0%81%e5%8e%8b%e7%bc%a9%e6%8a%80%e6%9c%af/"
-                                    class="block py-2 px-3 text-sm text-slate-500 hover:text-slate-900 hover:bg-primary/10 rounded-lg transition-all">代码压缩技术</a>
+                                    class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-primary/10 rounded-lg transition-all">代码压缩技术</a>
                                 <a href="https://www.beiyuxing.live/%e4%b8%ad%e6%96%ad%e5%ae%9e%e6%97%b6%e6%80%a7%e6%8a%80%e6%9c%af/"
-                                    class="block py-2 px-3 text-sm text-slate-500 hover:text-slate-900 hover:bg-primary/10 rounded-lg transition-all">中断实时性技术</a>
+                                    class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-primary/10 rounded-lg transition-all">中断实时性技术</a>
                             </div>
                         </div>
                         <a href="https://www.beiyuxing.live/ai%e8%9e%8d%e5%90%88%e6%8a%80%e6%9c%af/"
-                            class="flex items-center py-2.5 px-3 text-sm text-slate-600 hover:text-slate-900 hover:bg-slate-100 rounded-lg transition-all">
+                            class="flex items-center py-2.5 px-3 text-sm text-gray-300 hover:text-white hover:bg-white/5 rounded-lg transition-all">
                             <i class="fa fa-magic text-yellow-400 mr-3 text-xs"></i>
                             AI融合技术
                         </a>
@@ -663,7 +663,7 @@
 
                 <!-- 新闻中心 -->
                 <a href="https://www.beiyuxing.live/news/"
-                    class="mobile-menu-item mobile-menu-link flex items-center py-3 px-3 text-sm font-medium text-slate-600 hover:text-slate-900 rounded-lg">
+                    class="mobile-menu-item mobile-menu-link flex items-center py-3 px-3 text-sm font-medium text-gray-300 hover:text-white rounded-lg">
                     <div class="menu-icon bg-orange-500/20">
                         <i class="fa fa-newspaper-o text-orange-400"></i>
                     </div>
@@ -672,7 +672,7 @@
 
                 <!-- 关于我们 -->
                 <a href="https://www.beiyuxing.live/about/"
-                    class="mobile-menu-item mobile-menu-link flex items-center py-3 px-3 text-sm font-medium text-slate-600 hover:text-slate-900 rounded-lg">
+                    class="mobile-menu-item mobile-menu-link flex items-center py-3 px-3 text-sm font-medium text-gray-300 hover:text-white rounded-lg">
                     <div class="menu-icon bg-cyan-500/20">
                         <i class="fa fa-info-circle text-cyan-400"></i>
                     </div>
@@ -680,9 +680,9 @@
                 </a>
 
                 <!-- 加入我们 -->
-                <div class="mobile-menu-item pt-4 mt-2 border-t border-slate-200/50">
+                <div class="mobile-menu-item pt-4 mt-2 border-t border-gray-700/50">
                     <a href="https://www.beiyuxing.live/position/"
-                        class="flex items-center justify-center py-3 px-4 text-sm font-semibold text-slate-900 bg-gradient-to-r from-primary to-blue-600 rounded-xl hover:shadow-lg hover:shadow-primary/30 transition-all duration-300 hover:scale-[1.02]">
+                        class="flex items-center justify-center py-3 px-4 text-sm font-semibold text-white bg-gradient-to-r from-primary to-blue-600 rounded-xl hover:shadow-lg hover:shadow-primary/30 transition-all duration-300 hover:scale-[1.02]">
                         <i class="fa fa-user-plus mr-2"></i>
                         加入我们
                     </a>
@@ -694,7 +694,7 @@
     <!-- 联系我们部分已移除 -->
 
     <!-- 页脚 -->
-    <footer class="bg-slate-50 text-slate-900 py-16 border-t border-slate-300">
+    <footer class="bg-darkerBg text-white py-16 border-t border-gray-800">
         <div class="container mx-auto px-4 sm:px-6 lg:px-8">
             <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-10">
                 <!-- 公司信息 -->
@@ -706,20 +706,20 @@
                                 alt="公司Logo" class="w-full h-full object-contain" />
                         </div>
                     </div>
-                    <p class="text-slate-500 mb-6">
+                    <p class="text-gray-400 mb-6">
                         隼瞻科技是一家专注于提供专用处理器IP和EDA设计平台的创新型高科技公司，致力于为客户提供高性能、低功耗的处理器IP和先进的EDA设计工具。
                     </p>
                     <div class="flex space-x-4">
-                        <a href="#" class="text-slate-500 hover:text-slate-900 transition-colors">
+                        <a href="#" class="text-gray-400 hover:text-white transition-colors">
                             <i class="fa fa-weixin"></i>
                         </a>
-                        <a href="#" class="text-slate-500 hover:text-slate-900 transition-colors">
+                        <a href="#" class="text-gray-400 hover:text-white transition-colors">
                             <i class="fa fa-weibo"></i>
                         </a>
-                        <a href="#" class="text-slate-500 hover:text-slate-900 transition-colors">
+                        <a href="#" class="text-gray-400 hover:text-white transition-colors">
                             <i class="fa fa-linkedin"></i>
                         </a>
-                        <a href="#" class="text-slate-500 hover:text-slate-900 transition-colors">
+                        <a href="#" class="text-gray-400 hover:text-white transition-colors">
                             <i class="fa fa-twitter"></i>
                         </a>
                     </div>
@@ -730,9 +730,9 @@
                     <h3 class="text-lg font-bold mb-6">产品</h3>
                     <ul class="space-y-3">
                         <li><a href="https://www.beiyuxing.live/architstudio-2/"
-                                class="text-slate-500 hover:text-slate-900 transition-colors">ArchitStudio开发平台</a></li>
+                                class="text-gray-400 hover:text-white transition-colors">ArchitStudio开发平台</a></li>
                         <li><a href="https://www.beiyuxing.live/%e6%99%ba%e7%bf%bc%e7%ab%af%e4%be%a7ai%e8%a7%a3%e5%86%b3%e6%96%b9%e6%a1%88/"
-                                class="text-slate-500 hover:text-slate-900 transition-colors">智翼端侧AI解决方案</a></li>
+                                class="text-gray-400 hover:text-white transition-colors">智翼端侧AI解决方案</a></li>
                     </ul>
                 </div>
 
@@ -741,11 +741,11 @@
                     <h3 class="text-lg font-bold mb-6">技术</h3>
                     <ul class="space-y-3">
                         <li><a href="https://www.beiyuxing.live/elementor-%e9%a1%b5%e9%9d%a2-1447/"
-                                class="text-slate-500 hover:text-slate-900 transition-colors">AI融合技术</a></li>
+                                class="text-gray-400 hover:text-white transition-colors">AI融合技术</a></li>
                         <li><a href="https://www.beiyuxing.live/%e4%bb%a3%e7%a0%81%e5%8e%8b%e7%bc%a9%e6%8a%80%e6%9c%af/"
-                                class="text-slate-500 hover:text-slate-900 transition-colors">代码压缩技术</a></li>
+                                class="text-gray-400 hover:text-white transition-colors">代码压缩技术</a></li>
                         <li><a href="https://www.beiyuxing.live/%e4%b8%ad%e6%96%ad%e5%ae%9e%e6%97%b6%e6%80%a7%e6%8a%80%e6%9c%af/"
-                                class="text-slate-500 hover:text-slate-900 transition-colors">中断实时性技术</a></li>
+                                class="text-gray-400 hover:text-white transition-colors">中断实时性技术</a></li>
                     </ul>
                 </div>
 
@@ -754,23 +754,23 @@
                     <h3 class="text-lg font-bold mb-6">关于我们</h3>
                     <ul class="space-y-3">
                         <li><a href="https://www.beiyuxing.live/about/"
-                                class="text-slate-500 hover:text-slate-900 transition-colors">公司简介</a></li>
+                                class="text-gray-400 hover:text-white transition-colors">公司简介</a></li>
                         <li><a href="https://www.beiyuxing.live/position/"
-                                class="text-slate-500 hover:text-slate-900 transition-colors">加入我们</a></li>
+                                class="text-gray-400 hover:text-white transition-colors">加入我们</a></li>
                         <li><a href="https://www.beiyuxing.live/news/"
-                                class="text-slate-500 hover:text-slate-900 transition-colors">新闻动态</a></li>
+                                class="text-gray-400 hover:text-white transition-colors">新闻动态</a></li>
                     </ul>
                 </div>
             </div>
 
-            <div class="pt-8 border-t border-slate-300 flex flex-col md:flex-row justify-between items-center">
-                <p class="text-slate-400 text-sm mb-4 md:mb-0">
+            <div class="pt-8 border-t border-gray-800 flex flex-col md:flex-row justify-between items-center">
+                <p class="text-gray-500 text-sm mb-4 md:mb-0">
                     &copy; <span id="current-year">2023</span> 隼瞻科技. 保留所有权利.
                 </p>
                 <div class="flex space-x-6">
-                    <a href="#" class="text-slate-400 hover:text-slate-500 text-sm transition-colors">隐私政策</a>
-                    <a href="#" class="text-slate-400 hover:text-slate-500 text-sm transition-colors">使用条款</a>
-                    <a href="#" class="text-slate-400 hover:text-slate-500 text-sm transition-colors">法律声明</a>
+                    <a href="#" class="text-gray-500 hover:text-gray-400 text-sm transition-colors">隐私政策</a>
+                    <a href="#" class="text-gray-500 hover:text-gray-400 text-sm transition-colors">使用条款</a>
+                    <a href="#" class="text-gray-500 hover:text-gray-400 text-sm transition-colors">法律声明</a>
                 </div>
             </div>
         </div>
diff --git a/interrupt_realtime_wingsemi.html b/interrupt_realtime_wingsemi.html
index 470fd9c..d742545 100644
--- a/interrupt_realtime_wingsemi.html
+++ b/interrupt_realtime_wingsemi.html
@@ -1,20 +1,32 @@
 <!DOCTYPE html>
 <html lang="zh-CN">
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>产品详情 - 隼瞻科技</title>
-
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>中断实时性增强技术 - 隼瞻科技解决方案</title>
     <script src="https://cdn.tailwindcss.com"></script>
     <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
-
     <script>
         tailwind.config = {
             theme: {
                 extend: {
-                    colors: { primary: '#3b82f6', secondary: '#2563eb', accent: '#60a5fa' },
-                    fontFamily: { inter: ['Inter', 'sans-serif'] }
+                    colors: {
+                        primary: '#165DFF',   /* 隼瞻科技蓝 */
+                        secondary: '#36CFC9', /* 辅助青色 */
+                        accent: '#F7BA1E',    /* 强调色 */
+                        dark: '#111827',      /* 统一底色 */
+                        darker: '#0b1220',
+                        'dark-card': '#1f2937',
+                        'dark-text': '#94A3B8',
+                        'code-bg': '#1e1e1e',
+                    },
+                    fontFamily: {
+                        sans: ['Inter', 'system-ui', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'sans-serif'],
+                        mono: ['Menlo', 'Monaco', 'Consolas', 'Liberation Mono', 'Courier New', 'monospace'],
+                    },
+                    boxShadow: {
+                        'glow': '0 0 20px rgba(22, 93, 255, 0.3)',
+                    }
                 }
             }
         }
@@ -23,38 +35,77 @@
         @layer utilities {
             .glass-panel {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
-                backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
+                backdrop-filter: blur(16px);
+                -webkit-backdrop-filter: blur(16px);
                 border: 1px solid rgba(255, 255, 255, 0.9);
                 box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
             }
             .glass-panel-light {
                 background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
-                backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
                 border: 1px solid rgba(255, 255, 255, 1);
                 box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
             }
             .text-gradient {
-                background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
-                -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
+                background-clip: text;
+                -webkit-background-clip: text;
+                color: transparent;
             }
+            .section-padding {
+                @apply py-16 md:py-24;
+            }
+            .card-hover {
+                @apply transition-all duration-300 hover:translate-y-[-5px] hover:shadow-lg hover:shadow-primary/20;
+            }
+            /* 模拟代码高亮颜色 */
+            .token-keyword { color: #8e24aa; }
+            .token-reg { color: #0288d1; }
+            .token-val { color: #388e3c; }
+            .token-comment { color: #689f38; }
+            .token-instr { color: #1565c0; font-weight: bold; }
+        }
+    </style>
+    <style>
+        html {
+            scroll-behavior: smooth;
+        }
+        /* WordPress 兼容性样式 - 确保字体颜色不被覆盖 */
+        #wingsemi-interrupt-page,
+        #wingsemi-interrupt-page * {
+            color: inherit;
         }
         
-        #sj-product-page { font-family: 'Inter', sans-serif; color: #1e293b; background-color: transparent !important; }
-        #sj-product-page a { color: #3b82f6; transition: color 0.3s ease; }
-        #sj-product-page a:hover { color: #2563eb; }
-        .section-active { color: #2563eb !important; border-bottom: 2px solid #2563eb !important; }
-        .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
-        .hover-float:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1); }
-        .animate-fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
-        .animate-fade-in.visible { opacity: 1; transform: translateY(0); }
+        #wingsemi-interrupt-page { background-color: transparent !important; color: #1e293b !important; }
         
-        .bg-grid {
-            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233b82f6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
+        
+        
+        
+        
+        #wingsemi-interrupt-page .text-slate-500 font-bold {
+            color: #9ca3af !important;
+        }
+        
+        #wingsemi-interrupt-page .text-slate-500 font-medium {
+            color: #6b7280 !important;
+        }
+        
+        #wingsemi-interrupt-page .text-primary {
+            color: #165DFF !important;
+        }
+        
+        #wingsemi-interrupt-page .text-secondary {
+            color: #36CFC9 !important;
+        }
+        
+        #wingsemi-interrupt-page h1, #wingsemi-interrupt-page h2, #wingsemi-interrupt-page h3, #wingsemi-interrupt-page h4, #wingsemi-interrupt-page h5, #wingsemi-interrupt-page h6 { color: #1e293b !important; }
+        
+        #wingsemi-interrupt-page p {
+            color: inherit !important;
         }
     </style>
 </head>
-<body class="bg-slate-50 text-slate-800 font-inter antialiased overflow-x-hidden w-full">
-
+<body class="bg-slate-50 text-slate-800 font-sans antialiased">
     <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
     <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
         <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
@@ -62,15 +113,12 @@
         <div class="absolute top-[40%] right-[10%] w-[30%] h-[30%] rounded-full bg-indigo-100/60 blur-[80px]"></div>
         <div class="absolute bottom-[20%] left-[20%] w-[30%] h-[30%] rounded-full bg-blue-100/50 blur-[80px]"></div>
     </div>
-
-    <div id="wingsemi-interrupt-page">
+    <div id="wingsemi-interrupt-page" class="relative z-10">
     <!-- 1. 头部 Banner -->
     <section class="relative overflow-hidden pt-20 pb-24 md:pt-32 md:pb-40">
-        <div class="absolute inset-0 bg-gradient-to-b from-primary/10 to-darker z-0"></div>
+        <div class="absolute top-0 left-1/2 -translate-x-1/2 w-[80%] h-64 bg-primary/10 blur-[120px] rounded-full pointer-events-none"></div>
         <!-- 科技感背景网格 -->
-        <div class="absolute inset-0 opacity-20" 
-             style="background-image: linear-gradient(#165DFF 1px, transparent 1px), linear-gradient(90deg, #165DFF 1px, transparent 1px); background-size: 50px 50px;">
-        </div>
+        
         
         <div class="container mx-auto px-4 relative z-10">
             <div class="max-w-4xl mx-auto text-center">
@@ -80,14 +128,14 @@
                 <h1 class="text-[clamp(2.5rem,5vw,4rem)] font-bold leading-tight mb-6">
                     中断实时性<span class="text-gradient bg-gradient-to-r from-primary to-secondary">增强技术</span>
                 </h1>
-                <p class="text-lg md:text-xl text-dark-text mb-10 max-w-2xl mx-auto leading-relaxed">
+                <p class="text-lg md:text-xl text-slate-600 font-medium mb-10 max-w-2xl mx-auto leading-relaxed">
                     通过自定义指令集优化压栈出栈，并行处理上下文切换，打破传统 RISC-V 中断响应瓶颈，实现微秒级确定性响应。
                 </p>
                 <div class="flex flex-wrap justify-center gap-4">
-                    <a href="#cycle-comparison" class="px-8 py-3 bg-primary hover:bg-primary/90 text-slate-800 rounded-lg transition-all shadow-glow flex items-center gap-2 cursor-pointer">
+                    <a href="#cycle-comparison" class="px-8 py-3 bg-primary hover:bg-primary/90 text-slate-800 font-bold rounded-lg transition-all shadow-glow flex items-center gap-2 cursor-pointer">
                         <i class="fa fa-flash"></i> 查看性能对比
                     </a>
-                    <a href="#instruction-optimization" class="px-8 py-3 bg-white/5 border border-white/10 hover:bg-white/10 text-slate-800 font-medium rounded-lg transition-all cursor-pointer">
+                    <a href="#instruction-optimization" class="px-8 py-3 bg-white/5 border border-slate-200 hover:bg-white/10 text-slate-800 font-medium rounded-lg transition-all cursor-pointer">
                         了解指令集优化
                     </a>
                 </div>
@@ -96,25 +144,25 @@
     </section>
 
     <!-- 2. 核心技术：指令集优化 (对应图片1上半部分) -->
-    <section id="instruction-optimization" class="section-padding bg-transparent">
+    <section id="instruction-optimization" class="section-padding relative z-10">
         <div class="container mx-auto px-4">
             <div class="text-center mb-16">
                 <h2 class="text-3xl md:text-4xl font-bold mb-4">指令级优化</h2>
-                <p class="text-dark-text text-lg">通过增强指令优化压栈和出栈，大幅加速中断响应速度</p>
+                <p class="text-slate-600 font-medium text-lg">通过增强指令优化压栈和出栈，大幅加速中断响应速度</p>
             </div>
 
             <div class="grid grid-cols-1 gap-8 items-center max-w-7xl mx-auto" style="grid-template-columns: 1fr auto 1fr;">
                 <!-- 左侧：传统方式 -->
-                <div class="glass-panel rounded-xl border border-white/10 overflow-hidden relative group">
-                    <div class="absolute top-0 left-0 w-full h-1 bg-gray-600"></div>
+                <div class="glass-panel-light border border-white rounded-xl border border-slate-200 overflow-hidden relative group">
+                    <div class="absolute top-0 left-0 w-full h-1 bg-slate-200"></div>
                     <div class="p-6">
                         <div class="flex justify-between items-center mb-4">
-                            <h3 class="text-lg font-bold text-slate-500">常规 RISC-V 处理</h3>
-                            <span class="text-xs bg-gray-700 px-2 py-1 rounded">由于指令多，周期长</span>
+                            <h3 class="text-lg font-bold text-slate-500 font-bold">常规 RISC-V 处理</h3>
+                            <span class="text-xs bg-slate-100 px-2 py-1 rounded">由于指令多，周期长</span>
                         </div>
-                        <div class="bg-code-bg p-4 rounded-lg font-mono text-sm leading-relaxed border border-white/5">
+                        <div class="bg-slate-50 border border-slate-200 p-4 rounded-lg font-mono text-sm leading-relaxed border border-slate-200">
                             <div class="flex gap-4">
-                                <div class="text-gray-500 select-none text-right">
+                                <div class="text-slate-500 font-medium select-none text-right">
                                     1<br>2<br>3<br>4<br>5
                                 </div>
                                 <div>
@@ -135,20 +183,20 @@
                 </div>
 
                 <!-- 右侧：隼瞻优化 -->
-                <div class="glass-panel rounded-xl border border-primary/50 overflow-hidden relative shadow-glow">
+                <div class="glass-panel-light border border-white rounded-xl border border-primary/50 overflow-hidden relative shadow-glow">
                     <div class="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-primary to-secondary"></div>
                     <div class="p-6">
                         <div class="flex justify-between items-center mb-4">
                             <h3 class="text-lg font-bold text-slate-800">隼瞻增强技术</h3>
                             <span class="text-xs bg-primary/20 text-primary px-2 py-1 rounded border border-primary/20">减少5条指令</span>
                         </div>
-                        <div class="bg-code-bg p-4 rounded-lg font-mono text-sm leading-relaxed border border-primary/20 relative">
+                        <div class="bg-slate-50 border border-slate-200 p-4 rounded-lg font-mono text-sm leading-relaxed border border-primary/20 relative">
                             <!-- 绿色云朵标签模拟 -->
                             <div class="absolute -right-2 -top-2 bg-green-600/90 text-slate-800 text-xs px-2 py-1 rounded-bl-lg shadow-lg z-10 transform rotate-2">
                                 效率提升
                             </div>
                             <div class="flex gap-4">
-                                <div class="text-gray-500 select-none text-right">
+                                <div class="text-slate-500 font-medium select-none text-right">
                                     1<br>2<br>3<br>4
                                 </div>
                                 <div>
@@ -166,12 +214,12 @@
     </section>
 
     <!-- 3. 工作原理与 Cycle 对比 (对应图片1下半部分) -->
-    <section id="cycle-comparison" class="section-padding bg-slate-50 relative">
+    <section id="cycle-comparison" class="section-padding relative z-10 relative">
         <div class="container mx-auto px-4">
             <div class="max-w-5xl mx-auto">
                 <div class="mb-12">
                     <h2 class="text-3xl md:text-4xl font-bold mb-6 text-center">并行处理与硬件加速</h2>
-                    <p class="text-center text-dark-text max-w-3xl mx-auto">
+                    <p class="text-center text-slate-600 font-medium max-w-3xl mx-auto">
                         在嵌套中断服务中，通过<span class="text-primary font-bold">优化中断采样逻辑</span>、<span class="text-primary font-bold">优化中断接入逻辑</span>，并创造性地实现<span class="text-secondary font-bold">并行处理上下文切换</span>。
                     </p>
                 </div>
@@ -181,13 +229,13 @@
                     <!-- 左侧：流程步骤对比 -->
                     <div class="space-y-8">
                         <div>
-                            <h4 class="text-dark-text mb-3 text-sm uppercase tracking-wider">常规中断处理步骤</h4>
+                            <h4 class="text-slate-600 font-medium mb-3 text-sm uppercase tracking-wider">常规中断处理步骤</h4>
                             <div class="flex w-full text-xs md:text-sm text-center">
-                                <div class="bg-gray-700 py-3 px-1 w-1/3 rounded-l-lg border-r border-gray-600">中断发起<br>跳转时间</div>
-                                <div class="bg-gray-700 py-3 px-1 w-1/3 border-r border-gray-600">中断处理<br>时间</div>
-                                <div class="bg-gray-700 py-3 px-1 w-1/3 rounded-r-lg">上下文切换<br>时间</div>
+                                <div class="bg-slate-100 py-3 px-1 w-1/3 rounded-l-lg border-r border-slate-200">中断发起<br>跳转时间</div>
+                                <div class="bg-slate-100 py-3 px-1 w-1/3 border-r border-slate-200">中断处理<br>时间</div>
+                                <div class="bg-slate-100 py-3 px-1 w-1/3 rounded-r-lg">上下文切换<br>时间</div>
                             </div>
-                            <div class="text-center mt-2 text-xs text-gray-500">串行执行，耗时累加</div>
+                            <div class="text-center mt-2 text-xs text-slate-500 font-medium">串行执行，耗时累加</div>
                         </div>
 
                         <div>
@@ -211,28 +259,28 @@
                     </div>
 
                     <!-- 右侧：Cycle 数对比柱状图 -->
-                    <div class="glass-panel p-6 rounded-xl border border-white/10 flex flex-col justify-center">
+                    <div class="glass-panel-light border border-white p-6 rounded-xl border border-slate-200 flex flex-col justify-center">
                         <h3 class="text-xl font-bold mb-6">进入中断所需 Cycle 数对比</h3>
                         
                         <div class="space-y-6">
                             <!-- 常规 -->
                             <div>
                                 <div class="flex justify-between text-sm mb-2">
-                                    <span class="text-slate-500">常规中断处理</span>
+                                    <span class="text-slate-500 font-bold">常规中断处理</span>
                                     <span class="font-mono font-bold">26 Cycles</span>
                                 </div>
-                                <div class="w-full bg-gray-700 rounded-full h-4 overflow-hidden">
-                                    <div class="bg-gray-500 h-full rounded-full" style="width: 100%"></div>
+                                <div class="w-full bg-slate-100 rounded-full h-4 overflow-hidden">
+                                    <div class="bg-slate-300 h-full rounded-full" style="width: 100%"></div>
                                 </div>
                             </div>
 
                             <!-- 隼瞻 -->
                             <div class="relative">
                                 <div class="flex justify-between text-sm mb-2">
-                                    <span class="text-slate-800">隼瞻实时性增强技术</span>
+                                    <span class="text-slate-800 font-bold">隼瞻实时性增强技术</span>
                                     <span class="font-mono font-bold text-primary">12 Cycles</span>
                                 </div>
-                                <div class="w-full bg-gray-700 rounded-full h-4 overflow-hidden">
+                                <div class="w-full bg-slate-100 rounded-full h-4 overflow-hidden">
                                     <div class="bg-gradient-to-r from-primary to-secondary h-full rounded-full shadow-glow" style="width: 46%"></div>
                                 </div>
                                 
@@ -253,16 +301,16 @@
     </section>
 
     <!-- 4. 实时性优势与确定性 (对应图片2) -->
-    <section class="section-padding bg-transparent">
+    <section class="section-padding relative z-10">
         <div class="container mx-auto px-4">
             <div class="text-center mb-16">
                 <h2 class="text-3xl md:text-4xl font-bold mb-4">不仅更快，而且更稳</h2>
-                <p class="text-dark-text text-lg">同时达成 <span class="text-slate-800">中断时延的确定性</span> 和 <span class="text-slate-800">响应中断的及时性</span></p>
+                <p class="text-slate-600 font-medium text-lg">同时达成 <span class="text-slate-800 font-bold">中断时延的确定性</span> 和 <span class="text-slate-800 font-bold">响应中断的及时性</span></p>
             </div>
 
             <div class="grid grid-cols-1 lg:grid-cols-2 gap-12">
                 <!-- 左侧：绝对时间优势 -->
-                <div class="glass-panel p-8 rounded-xl border border-white/10 hover:border-primary/30 transition-colors">
+                <div class="glass-panel-light border border-white p-8 rounded-xl border border-slate-200 hover:border-primary/30 transition-colors">
                     <h3 class="text-2xl font-bold mb-6 flex items-center gap-3">
                         <i class="fa fa-clock-o text-primary"></i> 绝对时间优势
                     </h3>
@@ -270,13 +318,13 @@
                         <div class="flex items-end justify-center gap-8 h-48">
                             <!-- 柱子1 -->
                             <div class="w-24 group relative">
-                                <div class="absolute -top-8 w-full text-center text-slate-500 font-mono">常规</div>
-                                <div class="h-40 bg-gray-600 rounded-t-lg w-full relative"></div>
+                                <div class="absolute -top-8 w-full text-center text-slate-500 font-bold font-mono">常规</div>
+                                <div class="h-40 bg-slate-200 rounded-t-lg w-full relative"></div>
                             </div>
                             <!-- 柱子2 -->
                             <div class="w-24 group relative">
                                 <div class="absolute -top-16 w-full text-center text-primary font-mono font-bold">增强版</div>
-                                <div class="h-16 bg-gradient-to-t from-primary to-secondary rounded-t-lg w-full relative shadow-[0_0_20px_rgba(54,207,201,0.4)]">
+                                <div class="h-16 bg-gradient-to-t from-primary to-secondary rounded-t-lg w-full relative shadow-lg">
                                     <div class="absolute -top-10 left-1/2 -translate-x-1/2 whitespace-nowrap text-secondary font-bold">
                                         -61.54%
                                     </div>
@@ -287,12 +335,12 @@
                                 </div>
                             </div>
                         </div>
-                        <p class="text-center mt-6 text-slate-500 text-sm">中断响应周期大幅缩减</p>
+                        <p class="text-center mt-6 text-slate-500 font-bold text-sm">中断响应周期大幅缩减</p>
                     </div>
                 </div>
 
                 <!-- 右侧：时间确定性 (Jitter对比) -->
-                <div class="glass-panel p-8 rounded-xl border border-white/10 hover:border-secondary/30 transition-colors">
+                <div class="glass-panel-light border border-white p-8 rounded-xl border border-slate-200 hover:border-secondary/30 transition-colors">
                     <h3 class="text-2xl font-bold mb-6 flex items-center gap-3">
                         <i class="fa fa-line-chart text-secondary"></i> 时间确定性 (Jitter)
                     </h3>
@@ -300,11 +348,11 @@
                     <div class="space-y-8">
                         <!-- 隼瞻表现 -->
                         <div>
-                            <div class="text-sm text-slate-500 mb-2">隼瞻中断实时性技术</div>
+                            <div class="text-sm text-slate-500 font-bold mb-2">隼瞻中断实时性技术</div>
                             <div class="flex gap-1 h-12">
-                                <div class="flex-1 bg-primary rounded flex items-center justify-center text-slate-800 text-xs shadow-lg">10 Cycle</div>
-                                <div class="flex-1 bg-primary rounded flex items-center justify-center text-slate-800 text-xs shadow-lg">12 Cycle</div>
-                                <div class="flex-1 bg-primary rounded flex items-center justify-center text-slate-800 text-xs shadow-lg">10 Cycle</div>
+                                <div class="flex-1 bg-primary rounded flex items-center justify-center text-slate-800 font-bold text-xs shadow-lg">10 Cycle</div>
+                                <div class="flex-1 bg-primary rounded flex items-center justify-center text-slate-800 font-bold text-xs shadow-lg">12 Cycle</div>
+                                <div class="flex-1 bg-primary rounded flex items-center justify-center text-slate-800 font-bold text-xs shadow-lg">10 Cycle</div>
                             </div>
                             <div class="text-right text-xs text-secondary mt-1">波动极小，稳定可控</div>
                         </div>
@@ -313,10 +361,10 @@
 
                         <!-- 常规表现 -->
                         <div>
-                            <div class="text-sm text-slate-500 mb-2">常规 RISC-V IP</div>
+                            <div class="text-sm text-slate-500 font-bold mb-2">常规 RISC-V IP</div>
                             <div class="flex gap-1 h-12 items-end">
-                                <div class="w-1/2 bg-gray-700 h-8 rounded flex items-center justify-center text-slate-500 text-xs">24 Cycle</div>
-                                <div class="w-1/2 bg-gray-700 h-full rounded flex items-center justify-center text-slate-500 text-xs border border-red-500/30">40 Cycle</div>
+                                <div class="w-1/2 bg-slate-100 h-8 rounded flex items-center justify-center text-slate-500 font-bold text-xs">24 Cycle</div>
+                                <div class="w-1/2 bg-slate-100 h-full rounded flex items-center justify-center text-slate-500 font-bold text-xs border border-red-500/30">40 Cycle</div>
                             </div>
                             <div class="text-right text-xs text-red-400 mt-1">波动巨大，不可预测</div>
                         </div>
@@ -327,10 +375,10 @@
     </section>
 
     <!-- 5. 底部 CTA -->
-    <section class="py-16 bg-gradient-to-t from-darker to-dark text-center">
+    <section class="py-16 relative z-10 border-t border-slate-200 text-center">
         <div class="container mx-auto px-4">
             <h2 class="text-2xl md:text-3xl font-bold mb-8">准备好提升您的处理器性能了吗？</h2>
-            <button class="px-10 py-4 bg-gradient-to-r from-primary to-secondary hover:opacity-90 text-slate-800 text-lg rounded-full transition-all transform hover:scale-105 shadow-xl">
+            <button class="px-10 py-4 bg-gradient-to-r from-primary to-secondary hover:opacity-90 text-slate-800 font-bold text-lg rounded-full transition-all transform hover:scale-105 shadow-xl">
                 联系隼瞻科技获取方案
             </button>
         </div>
@@ -352,7 +400,7 @@
                 });
             }, observerOptions);
 
-            const elements = document.querySelectorAll('.glass-panel, h2, h3');
+            const elements = document.querySelectorAll('.glass-panel-light border border-white, h2, h3');
             elements.forEach(el => {
                 el.classList.add('transition-all', 'duration-700', 'opacity-0', 'translate-y-8');
                 observer.observe(el);
diff --git a/新建文件夹/Wing-A500.html b/新建文件夹/Wing-A500.html
new file mode 100644
index 0000000..b5c3e59
--- /dev/null
+++ b/新建文件夹/Wing-A500.html
@@ -0,0 +1,625 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+
+<head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>产品详情 - 隼瞻科技</title>
+
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: { primary: '#3b82f6', secondary: '#2563eb', accent: '#60a5fa' },
+                    fontFamily: { inter: ['Inter', 'sans-serif'] }
+                }
+            }
+        }
+    </script>
+    <style type="text/tailwindcss">
+        @layer utilities {
+            .glass-panel {
+                background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
+                backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
+                border: 1px solid rgba(255, 255, 255, 0.9);
+                box-shadow: 0 8px 32px -4px rgba(59, 130, 246, 0.1);
+            }
+            .glass-panel-light {
+                background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
+                backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
+                border: 1px solid rgba(255, 255, 255, 1);
+                box-shadow: 0 4px 16px -2px rgba(59, 130, 246, 0.05);
+            }
+            .text-gradient {
+                background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #8b5cf6 100%);
+                -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
+            }
+        }
+        
+        #sj-product-page { font-family: 'Inter', sans-serif; color: #1e293b; background-color: transparent !important; }
+        #sj-product-page a { color: #3b82f6; transition: color 0.3s ease; }
+        #sj-product-page a:hover { color: #2563eb; }
+        .section-active { color: #2563eb !important; border-bottom: 2px solid #2563eb !important; }
+        .hover-float { transition: transform 0.3s ease, box-shadow 0.3s ease; }
+        .hover-float:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.1); }
+        .animate-fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
+        .animate-fade-in.visible { opacity: 1; transform: translateY(0); }
+        
+        .bg-grid {
+            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233b82f6' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
+        }
+    </style>
+</head>
+
+<body class="bg-slate-50 text-slate-800 font-inter antialiased overflow-x-hidden w-full">
+
+    <!-- 固定在背景的全局毛玻璃淡蓝光晕 -->
+    <div class="fixed inset-0 z-0 pointer-events-none bg-slate-50">
+        <div class="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] rounded-full bg-blue-200/50 blur-[100px]"></div>
+        <div class="absolute bottom-[-10%] right-[-10%] w-[40%] h-[40%] rounded-full bg-sky-200/40 blur-[100px]"></div>
+        <div class="absolute top-[40%] right-[10%] w-[30%] h-[30%] rounded-full bg-indigo-100/60 blur-[80px]"></div>
+        <div class="absolute bottom-[20%] left-[20%] w-[30%] h-[30%] rounded-full bg-blue-100/50 blur-[80px]"></div>
+    </div>
+
+    <!-- Wrapper with an ID so we can scope styles and avoid WP theme interference -->
+    <div id="sj-product-page" class="relative z-10 w-full min-h-screen">
+
+        <!-- 产品页面头部 -->
+        <section class="pt-24 md:pt-32 pb-16 md:pb-24 bg-gradient-to-br gradient-animate"
+            style="background: linear-gradient(135deg, rgba(248,250,252,0.95), rgba(239,246,255,1)); overflow:hidden;">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto text-center">
+                    <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-bold text-slate-800 leading-tight text-shadow mb-6">
+                        通用处理器IP
+                    </h1>
+                    <div class="bg-primary-20 inline-block px-6 pt-4 rounded-full mb-6 animate-fade-in">
+                        <h2 class="text-xl font-semibold text-primary">Wing-A Series</h2>
+                    </div>
+                    <h3 class="text-2xl md:text-3xl font-bold text-slate-800 mb-8">面向高能效应用的多核RISC-V应用处理器：</br>Wing-A500</h3>
+                    <p class="text-lg md:text-xl text-slate-600 mb-8 max-w-2xl mx-auto" style="line-height:1.6;">
+                        Wing-A500 是一款基于开源 RISC-V 架构打造的 64 位、双发射、9
+                        级流水处理器，其在架构设计、性能表现以及功能特性上的卓越表现，使其成为高能效应用处理器领域的佼佼者。同时，Wing-A500兼容 RVA23 规范，确保了与现有 RISC-V
+                        生态系统的良好兼容性，便于开发者快速集成和开发应用。产品适用于人工智能、具身智能、自动驾驶、5G/6G网络通讯、安全等领域。
+                    </p>
+                    <div class="w-24 h-1 bg-primary mx-auto" style="background-color:var(--primary); height:4px;"></div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 1. 架构 -->
+        <section id="architecture" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">架构</h2>
+                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    </div>
+                </div>
+
+                <!-- 架构大图 -->
+                <div class="max-w-4xl mx-auto glass-panel text-slate-800 rounded-xl shadow-lg overflow-hidden animate-fade-in mb-12">
+                    <div class="p-6"
+                        style="background: linear-gradient(90deg, rgba(59,130,246,0.1) 0%, rgba(255,255,255,0.9) 100%); border-bottom: 1px solid rgba(59,130,246,0.1);">
+                        <h3 class="text-2xl font-bold text-slate-800 text-center">Wing-A500 处理器IP架构</h3>
+                    </div>
+                    <div class="p-4">
+                        <img src="https://www.beiyuxing.live/wp-content/uploads/2026/04/20260407-1705381.png"
+                            alt="Wing-A500 Processor IP架构图" class="w-full h-auto rounded-lg" />
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 2. 产品参数 -->
+        <section id="specifications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品参数</h2>
+                    <p class="text-slate-600 mb-6 text-center">
+                        Wing-A500 Processor IP的详细技术参数，为您提供全面的产品信息
+                    </p>
+                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    </div>
+                </div>
+
+                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
+                    <h3 class="text-2xl font-bold mb-6 text-slate-800">性能基准测试</h3>
+                    <div class="grid md:grid-cols-2 gap-6">
+                        <div class="space-y-4">
+                            <div class="flex justify-between pb-3 border-b border-gray-100">
+                                <span class="text-slate-500 text-2xl">SPECint2006</span>
+                                <span class="font-medium text-2xl" style="color: #4cd6b4;">5/GHz</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="glass-panel text-slate-800 rounded-xl shadow-md p-8 animate-fade-in">
+                    <h3 class="text-xl font-bold mb-6 text-slate-800">功能参数</h3>
+                    <div class="grid md:grid-cols-2 gap-6">
+                        <div class="space-y-4">
+                            <div class="flex justify-between pb-3 border-b border-gray-100">
+                                <span class="text-slate-500">ISA</span>
+                                <span class="font-medium text-slate-800">RV64GCBVK</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-gray-100">
+                                <span class="text-slate-500">Micro Arch</span>
+                                <span class="font-medium text-slate-800">9-stage, In-order, two-issue</span>
+                            </div>
+                            <div class="flex justify-between">
+                                <span class="text-slate-500">Privilege Mode</span>
+                                <span class="font-medium text-slate-800 text-right">Machine Mode, User Mode, Supervisor Mode
+                                    and
+                                    Hypervisor Extension</span>
+                            </div>
+                        </div>
+                        <div class="space-y-4">
+                            <div class="flex justify-between pb-3 border-b border-gray-100">
+                                <span class="text-slate-500">Ext. Interrupts</span>
+                                <span class="font-medium text-slate-800">Support AIA 1.0</span>
+                            </div>
+                            <div class="flex justify-between pb-3 border-b border-gray-100">
+                                <span class="text-slate-500">Debug</span>
+                                <span class="font-medium text-slate-800">JTAG/APB </span>
+                            </div>
+                            <div class="flex justify-between">
+                                <span class="text-slate-500">External Bus</span>
+                                <span class="font-medium text-slate-800">2x AXI/CHI</span>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="mt-3 pt-3 border-t border-gray-100 flex justify-between">
+                        <span class="text-slate-500">Memory System</span>
+                        <span class="font-medium text-slate-800 text-right">I/D Cache(up to 64KB) L2 Cache (up to 2MB) MMU
+                            and optional PMP</span>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 2. 关键特性 -->
+        <section id="key-features" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">关键特性</h2>
+                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    </div>
+                </div>
+
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-6 max-w-5xl mx-auto">
+                    <div
+                        class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in flex flex-col items-center text-center">
+                        <div class="w-16 h-16 bg-primary-10 rounded-full flex items-center justify-center mb-4">
+                            <i class="fa fa-file-code-o text-primary text-2xl"></i>
+                        </div>
+                        <h4 class="text-xl font-bold mb-2 text-slate-800">兼容RVA23 Profile规范</h4>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in flex flex-col items-center text-center"
+                        style="transition-delay: 0.1s">
+                        <div class="w-16 h-16 bg-primary-10 rounded-full flex items-center justify-center mb-4">
+                            <i class="fa fa-server text-primary text-2xl"></i>
+                        </div>
+                        <h4 class="text-xl font-bold mb-2 text-slate-800">支持Linux和Hypervisor扩展</h4>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in flex flex-col items-center text-center"
+                        style="transition-delay: 0.2s">
+                        <div class="w-16 h-16 bg-primary-10 rounded-full flex items-center justify-center mb-4">
+                            <i class="fa fa-sitemap text-primary text-2xl"></i>
+                        </div>
+                        <h4 class="text-xl font-bold mb-2 text-slate-800">支持异构多核平台</h4>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 3. 产品特点 -->
+        <section id="features" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">产品特点</h2>
+                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    </div>
+                </div>
+
+                <div class="space-y-6 max-w-4xl mx-auto">
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                        <div class="flex items-center">
+                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-primary"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold text-slate-800">64位顺序双发射架构的高能效RISC-V处理器</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                        <div class="flex items-center">
+                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-primary"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold text-slate-800">支持丰富的调试机制，满足多样化的程序调试与分析需求</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                        <div class="flex items-center">
+                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-primary"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold text-slate-800">支持运行Linux
+                                    OS，满足虚拟化要求，支持Sv39以及Sv48两种地址翻译模式</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                        <div class="flex items-center">
+                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-primary"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold text-slate-800">支持符合AIA标准要求的中断控制器，支持配置线中断（Wired
+                                    Interrupts）以及消息中断（MSIs)</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                        <div class="flex items-center">
+                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-primary"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold text-slate-800">支持可信执行环境（TEE），支持灵活地管理飞地（enclave）</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.5s">
+                        <div class="flex items-center">
+                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-primary"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold text-slate-800">支持硬件多核一致性，支持多核异构平台，支持共享L3 Cache以及私有L2
+                                    Cache</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.6s">
+                        <div class="flex items-center">
+                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-primary"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold text-slate-800">支持符合RISC-V Vector
+                                    1.0标准的矢量计算单元，可根据应用需求灵活配置矢量宽度</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.7s">
+                        <div class="flex items-center">
+                            <div class="bg-primary-10 p-2 rounded-lg shrink-0">
+                                <i class="fa fa-check text-primary"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h4 class="text-xl font-bold text-slate-800">基于ArchitStudio敏捷开发平台的客制化指令集扩展功能</h4>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 4. 技术优势 -->
+        <section id="advantages" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">技术优势</h2>
+                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    </div>
+                </div>
+
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-bolt text-primary text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">高能效</h4>
+                                <p class="text-slate-600">
+                                    采用深度优化的顺序执行微架构与能效感知设计，在同等工艺下实现卓越的能效比，适用于从边缘计算到智能终端的广泛场景。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-cogs text-primary text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">高可配置性</h4>
+                                <p class="text-slate-600">
+                                    支持模块化扩展与本土化定制，结合RISC-V开放生态，为国产化系统提供安全可控、可持续演进的核心算力支撑。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 1. 应用场景 -->
+        <section id="applications" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">应用场景</h2>
+                    <p class="text-slate-600 mb-6 text-center">
+                        Wing-A500处理器IP凭借其高性能、低功耗特性，广泛应用于以下领域
+                    </p>
+                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    </div>
+                </div>
+
+                <!-- 应用场景标签 -->
+                <div class="flex flex-wrap justify-center gap-4 max-w-3xl mx-auto mb-16">
+                    <span
+                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2">
+                        <i class="fa fa-cogs"></i> 人工智能
+                    </span>
+                    <span
+                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        style="transition-delay: 0.1s">
+                        <i class="fa fa-android"></i> 具身智能
+                    </span>
+                    <span
+                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        style="transition-delay: 0.2s">
+                        <i class="fa fa-car"></i> 自动驾驶
+                    </span>
+                    <span
+                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        style="transition-delay: 0.3s">
+                        <i class="fa fa-wifi"></i> 5G/6G网络通讯
+                    </span>
+                    <span
+                        class="bg-primary-20 text-primary px-6 py-3 rounded-full text-lg font-medium animate-fade-in flex items-center gap-2"
+                        style="transition-delay: 0.4s">
+                        <i class="fa fa-shield"></i> 安全
+                    </span>
+                </div>
+
+                <!-- 详细应用场景描述 -->
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-cogs text-primary text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">人工智能</h4>
+                                <p class="text-slate-600">
+                                    提供强大的计算能力支持复杂的AI模型训练和推理，加速深度学习算法在边缘设备上的部署，满足AI应用对高性能和低延迟的需求。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.1s">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-android text-primary text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">具身智能</h4>
+                                <p class="text-slate-600">
+                                    为机器人和智能设备提供高效的感知-决策-执行能力，支持多模态数据处理和实时控制，赋能智能体在复杂环境中的自主行为。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.2s">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-car text-primary text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">自动驾驶</h4>
+                                <p class="text-slate-600">
+                                    支持复杂的环境感知和决策算法，提供实时处理能力和高可靠性，满足自动驾驶系统对计算性能和安全冗余的严格要求。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.3s">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-wifi text-primary text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">5G/6G网络通讯</h4>
+                                <p class="text-slate-600">
+                                    支持高速网络协议处理和数据传输，满足新一代通信技术对低延迟、高带宽和可靠连接的要求，为网络设备提供强大的计算支持。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 p-6 rounded-xl shadow-md animate-fade-in" style="transition-delay: 0.4s">
+                        <div class="flex items-start mb-4">
+                            <div class="w-12 h-12 bg-primary-10 rounded-full flex items-center justify-center mr-4">
+                                <i class="fa fa-shield text-primary text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="text-xl font-bold mb-2 text-slate-800">安全</h4>
+                                <p class="text-slate-600">
+                                    提供可信执行环境和安全加密功能，保障敏感数据和关键应用的安全运行，满足对数据保护和系统安全的严格要求。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- 5. 交付包 -->
+        <section id="documentation" class="section-content py-16 bg-transparent text-slate-800" style="background-color:transparent;">
+            <div class="container mx-auto px-4 md:px-6 lg:px-8">
+                <div class="max-w-4xl mx-auto mb-16">
+                    <h2 class="text-3xl md:text-4xl font-bold mb-6 text-slate-800 text-center">交付包</h2>
+                    <p class="text-slate-600 mb-6 text-center">
+                        隼瞻科技提供全面的技术文档，帮助客户快速了解和使用我们的产品
+                    </p>
+                    <div class="w-24 h-1 bg-primary mx-auto mb-12" style="background-color:var(--primary); height:4px;">
+                    </div>
+                </div>
+
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
+                    <div
+                        class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in">
+                        <div class="p-6">
+                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
+                                <i class="fa fa-microchip text-primary text-xl"></i>
+                            </div>
+                            <h4 class="text-xl font-bold mb-3 text-slate-800">HDK</h4>
+                            <ul class="space-y-3 mb-6">
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
+                                    <span>Wing-A500 RTL代码</span>
+                                </li>
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
+                                    <span>仿真验证环境</span>
+                                </li>
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
+                                    <span>DC综合参考环境</span>
+                                </li>
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-image-o text-purple-500 mr-2"></i>
+                                    <span>Formality形式验证参考环境</span>
+                                </li>
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
+                                    <span>FPGA配置文件</span>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
+                        style="transition-delay: 0.2s">
+                        <div class="p-6">
+                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
+                                <i class="fa fa-sitemap text-primary text-xl"></i>
+                            </div>
+                            <h4 class="text-xl font-bold mb-3 text-slate-800">SDK</h4>
+                            <ul class="space-y-3 mb-6">
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
+                                    <span>Wing IDE</span>
+                                </li>
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
+                                    <span>编译工具链</span>
+                                </li>
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
+                                    <span>调试器</span>
+                                </li>
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-image-o text-purple-500 mr-2"></i>
+                                    <span>BSP</span>
+                                </li>
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-video-o text-orange-500 mr-2"></i>
+                                    <span>IA/CA 仿真器</span>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+
+                    <div class="glass-panel text-slate-800 rounded-xl border border-slate-200 shadow-md hover:shadow-xl transition-all duration-300 overflow-hidden hover-float animate-fade-in"
+                        style="transition-delay: 0.4s">
+                        <div class="p-6">
+                            <div class="w-12 h-12 bg-primary-10 rounded-lg flex items-center justify-center mb-4">
+                                <i class="fa fa-code text-primary text-xl"></i>
+                            </div>
+                            <h4 class="text-xl font-bold mb-3 text-slate-800">文档</h4>
+                            <ul class="space-y-3 mb-6">
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-pdf-o text-red-500 mr-2"></i>
+                                    <span>Wing-A500 处理器技术文档</span>
+                                </li>
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-text-o text-blue-500 mr-2"></i>
+                                    <span>Wing-A500 处理器集成文档</span>
+                                </li>
+                                <li class="flex items-center text-sm">
+                                    <i class="fa fa-file-code-o text-green-500 mr-2"></i>
+                                    <span>Wing-A500 SDK手册</span>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+    </div> <!-- end #sj-product-page -->
+
+    <!-- 咨询按钮 -->
+    <div class="fixed bottom-12 right-12 z-50 popupbox">
+        <button id="consult-button"
+            class="bg-primary hover:bg-primary/90 text-slate-800 py-5 px-8 rounded-full shadow-xl transform transition-all duration-300 hover:scale-110 flex items-center gap-3 text-lg">
+            <i class="fa fa-comments-o text-2xl"></i>
+            <span class="font-bold">立刻咨询</span>
+        </button>
+    </div>
+
+    <!-- JavaScript - 仅保留滚动动画，移除标签页切换功能 -->
+    <script>
+        // 滚动动画 - scoped to the animate-fade-in elements inside #sj-product-page
+        document.addEventListener('DOMContentLoaded', function () {
+            const root = document.getElementById('sj-product-page');
+            if (!root) return;
+
+            const animateElements = root.querySelectorAll('.animate-fade-in');
+
+            function checkScroll() {
+                animateElements.forEach(element => {
+                    const elementTop = element.getBoundingClientRect().top;
+                    const elementVisible = 150;
+                    if (elementTop < window.innerHeight - elementVisible) {
+                        element.classList.add('visible');
+                    }
+                });
+            }
+
+            // initial check
+            checkScroll();
+            // add listener
+            window.addEventListener('scroll', checkScroll, { passive: true });
+            // also on resize/orientation change to catch changes
+            window.addEventListener('resize', checkScroll);
+        });
+    </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/新建文件夹/buckup.zip b/新建文件夹/buckup.zip
new file mode 100644
index 0000000..d11efe8
Binary files /dev/null and b/新建文件夹/buckup.zip differ
diff --git a/职位.html b/职位.html
index 5724498..c225775 100644
--- a/职位.html
+++ b/职位.html
@@ -5,6 +5,21 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>职位列表</title>
+    <!-- Tailwind and Fonts -->
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+    
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: { primary: '#3b82f6', secondary: '#2563eb' },
+                    fontFamily: { inter: ['Inter', 'sans-serif'] },
+                }
+            }
+        }
+    </script>
     <style>
         * {
             margin: 0;
@@ -13,33 +28,60 @@
         }
 
         body {
-            background-color: #0f172a;
-            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+            background-color: #f8fafc;
+            font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
             color: #1e293b;
             line-height: 1.6;
+            position: relative;
+        }
+
+        /* 背景光晕 */
+        .bg-glow-container {
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 100vw;
+            height: 100vh;
+            overflow: hidden;
+            z-index: 0;
+            pointer-events: none;
+        }
+        
+        .bg-glow {
+            position: absolute;
+            border-radius: 50%;
+            filter: blur(80px);
+            opacity: 0.5;
         }
 
         .container {
             max-width: 1200px;
             margin: 0 auto;
-            padding: 20px;
+            padding: 40px 20px;
+            position: relative;
+            z-index: 10;
         }
 
+        /* Glassmorphism Item */
         .job-item {
-            background-color: #ffffff;
-            border: 1px solid #e2e8f0; box-shadow: 0 1px 3px rgba(0,0,0,0.1);
-            border-radius: 8px;
-            padding: 20px;
-            margin-bottom: 16px;
+            background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(248, 250, 252, 0.8) 100%);
+            backdrop-filter: blur(12px);
+            -webkit-backdrop-filter: blur(12px);
+            border: 1px solid rgba(255, 255, 255, 1);
+            border-radius: 16px;
+            padding: 24px;
+            margin-bottom: 20px;
             display: flex;
             justify-content: space-between;
             align-items: flex-start;
-            transition: all 0.2s ease;
+            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+            box-shadow: 0 4px 12px -2px rgba(59, 130, 246, 0.05);
         }
 
         .job-item:hover {
-            background-color: #2d3748;
-            border-color: #4a5568;
+            transform: translateY(-4px);
+            box-shadow: 0 20px 40px -10px rgba(59, 130, 246, 0.15);
+            background: rgba(255, 255, 255, 1);
         }
 
         .job-left {
@@ -48,110 +90,136 @@
         }
 
         .job-title {
-            font-size: 18px;
-            font-weight: 600;
-            color: rgb(215, 212, 219);
-            margin-bottom: 8px;
+            font-size: 20px;
+            font-weight: 700;
+            color: #0f172a;
+            margin-bottom: 12px;
             cursor: pointer;
+            transition: color 0.2s ease;
+        }
+        
+        .job-title a {
+            color: inherit;
+            text-decoration: none;
         }
 
-        .job-title:hover {
-            color: #8b5cf6;
+        .job-title:hover, .job-title a:hover {
+            color: #3b82f6;
         }
 
         .job-type {
-            background-color: #374151;
-            color: #9ca3af;
-            padding: 4px 12px;
-            border-radius: 4px;
-            font-size: 14px;
+            background-color: #eff6ff;
+            color: #3b82f6;
+            border: 1px solid #bfdbfe;
+            padding: 4px 14px;
+            border-radius: 9999px;
+            font-size: 13px;
+            font-weight: 600;
             display: inline-block;
-            margin-bottom: 12px;
+            margin-bottom: 16px;
         }
 
         .job-description {
-            color: #64748b;
-            font-size: 14px;
-            line-height: 1.5;
+            color: #475569;
+            font-size: 15px;
+            line-height: 1.6;
         }
 
         .job-right {
             display: flex;
             flex-direction: column;
             align-items: flex-end;
-            min-width: 200px;
+            min-width: 140px;
         }
 
         .job-category {
-            background-color: #e0f2fe; color: #1e40af;
-            color: white;
-            padding: 4px 12px;
-            border-radius: 4px;
-            font-size: 12px;
-            margin-bottom: 8px;
+            background-color: #f1f5f9;
+            color: #334155;
+            border: 1px solid #e2e8f0;
+            padding: 6px 16px;
+            border-radius: 8px;
+            font-size: 14px;
+            font-weight: 600;
+            margin-bottom: 12px;
         }
 
         .job-status {
             color: #10b981;
             font-size: 14px;
-            font-weight: 500;
+            font-weight: 700;
+            background-color: #ecfdf5;
+            padding: 4px 12px;
+            border-radius: 6px;
         }
 
-        .location-info {
-            color: #64748b;
-            font-size: 12px;
-            margin-top: 4px;
+        /* Custom forms */
+        .search-filter-section {
+            background: rgba(255, 255, 255, 0.7);
+            backdrop-filter: blur(16px);
+            -webkit-backdrop-filter: blur(16px);
+            border: 1px solid rgba(255, 255, 255, 1);
+            box-shadow: 0 10px 30px -10px rgba(59, 130, 246, 0.08);
+            border-radius: 16px;
+            padding: 30px;
+            margin-bottom: 30px;
         }
-
-        .highlight {
-            color: #3b82f6;
+        
+        .search-filter-section h2 {
+            color: #0f172a;
+            font-size: 24px;
+            font-weight: 800;
+            margin-bottom: 24px;
         }
-
-        .special-notice {
-            background-color: #e0f2fe; color: #1e40af;
-            color: white;
-            padding: 16px;
+        
+        .search-filter-section label {
+            color: #475569;
+            font-weight: 600;
+            margin-bottom: 8px;
+            display: block;
+        }
+        
+        .search-input, .filter-select {
+            width: 100%;
+            padding: 12px 16px;
+            background-color: #ffffff;
+            border: 1px solid #cbd5e1;
             border-radius: 8px;
-            margin-bottom: 16px;
-            font-size: 14px;
-            line-height: 1.5;
+            color: #334155;
+            font-size: 15px;
+            transition: all 0.2s;
+            box-shadow: inset 0 1px 2px rgba(0,0,0,0.02);
+        }
+        
+        .search-input:focus, .filter-select:focus {
+            outline: none;
+            border-color: #3b82f6;
+            box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
         }
     </style>
 </head>
 
 <body>
+    <div class="bg-glow-container">
+        <div class="bg-glow" style="top: -10%; left: -10%; width: 50%; height: 50%; background: radial-gradient(circle, rgba(59,130,246,0.2) 0%, rgba(255,255,255,0) 70%);"></div>
+        <div class="bg-glow" style="bottom: -10%; right: -10%; width: 60%; height: 60%; background: radial-gradient(circle, rgba(14,165,233,0.15) 0%, rgba(255,255,255,0) 70%);"></div>
+        <div class="bg-glow" style="top: 40%; right: 10%; width: 30%; height: 30%; background: radial-gradient(circle, rgba(99,102,241,0.15) 0%, rgba(255,255,255,0) 70%);"></div>
+    </div>
+
     <div class="container">
         <!-- 搜索和筛选区域 -->
-        <div class="search-filter-section"
-            style="margin-bottom: 24px; padding: 20px; background-color: #ffffff; border-radius: 8px; border: 1px solid #e2e8f0; box-shadow: 0 1px 3px rgba(0,0,0,0.1);">
-            <h2 style="margin-bottom: 16px; font-size: 20px; font-weight: 600;">职位搜索与筛选</h2>
+        <div class="search-filter-section animate-fade-in">
+            <h2>职位搜索与筛选</h2>
 
             <!-- 搜索框 -->
-            <div style="margin-bottom: 16px;">
-                <input type="text" id="keyword-search" placeholder="输入关键字搜索职位..." style="
-                        width: 100%;
-                        padding: 12px 16px;
-                        background-color: #f1f5f9;
-                        border: 1px solid #e2e8f0; box-shadow: 0 1px 3px rgba(0,0,0,0.1);
-                        border-radius: 6px;
-                        color: #1e293b;
-                        font-size: 14px;
-                    ">
+            <div style="margin-bottom: 20px;">
+                <input type="text" id="keyword-search" class="search-input" placeholder="输入关键字搜索职位...">
             </div>
 
             <!-- 筛选框 -->
-            <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px;">
+            <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px;">
                 <div>
-                    <label style="display: block; margin-bottom: 6px; font-size: 14px; color: #64748b;">职位名称</label>
-                    <select id="job-title-filter" style="
-                            width: 100%;
-                            padding: 10px 12px;
-                            background-color: #f1f5f9;
-                            border: 1px solid #e2e8f0; box-shadow: 0 1px 3px rgba(0,0,0,0.1);
-                            border-radius: 6px;
-                            color: #1e293b;
-                            font-size: 14px;
-                        ">
+                    <label>职位名称</label>
+                    <select id="job-title-filter" class="filter-select">
                         <option value="all">全部职位</option>
                         <option value="CPU IP系统开发工程师">CPU IP系统开发工程师</option>
                         <option value="CPU IP设计工程师">CPU IP设计工程师</option>
@@ -166,16 +234,8 @@
                 </div>
 
                 <div>
-                    <label style="display: block; margin-bottom: 6px; font-size: 14px; color: #64748b;">职位类型</label>
-                    <select id="job-type-filter" style="
-                            width: 100%;
-                            padding: 10px 12px;
-                            background-color: #f1f5f9;
-                            border: 1px solid #e2e8f0; box-shadow: 0 1px 3px rgba(0,0,0,0.1);
-                            border-radius: 6px;
-                            color: #1e293b;
-                            font-size: 14px;
-                        ">
+                    <label>职位类型</label>
+                    <select id="job-type-filter" class="filter-select">
                         <option value="all">全部类型</option>
                         <option value="研发">研发</option>
                         <option value="商务">商务</option>
@@ -183,16 +243,8 @@
                 </div>
 
                 <div>
-                    <label style="display: block; margin-bottom: 6px; font-size: 14px; color: #64748b;">工作地点</label>
-                    <select id="job-category-filter" style="
-                            width: 100%;
-                            padding: 10px 12px;
-                            background-color: #f1f5f9;
-                            border: 1px solid #e2e8f0; box-shadow: 0 1px 3px rgba(0,0,0,0.1);
-                            border-radius: 6px;
-                            color: #1e293b;
-                            font-size: 14px;
-                        ">
+                    <label>工作地点</label>
+                    <select id="job-category-filter" class="filter-select">
                         <option value="all">全部地点</option>
                         <option value="上海">上海</option>
                         <option value="珠海">珠海</option>
@@ -201,16 +253,8 @@
                 </div>
 
                 <div>
-                    <label style="display: block; margin-bottom: 6px; font-size: 14px; color: #64748b;">职位状态</label>
-                    <select id="job-status-filter" style="
-                            width: 100%;
-                            padding: 10px 12px;
-                            background-color: #f1f5f9;
-                            border: 1px solid #e2e8f0; box-shadow: 0 1px 3px rgba(0,0,0,0.1);
-                            border-radius: 6px;
-                            color: #1e293b;
-                            font-size: 14px;
-                        ">
+                    <label>职位状态</label>
+                    <select id="job-status-filter" class="filter-select">
                         <option value="all">全部状态</option>
                         <option value="26应届/需实习">26应届/需实习</option>
                         <option value="全职">全职</option>
