From ec6222d183c551ee886d90aa5c1a1d9fd16646d3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=BD=98?=
 <16176807+xaioppan@user.noreply.gitee.com>
Date: Fri, 29 May 2026 17:32:15 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AD=97=E4=BD=93=E5=93=8D=E5=BA=94=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 website/src/components/HeroSection.jsx |   2 +-
 website/src/components/Navbar.jsx      |   4 +
 website/src/data/products.js           |  28 +------
 website/src/index.css                  |   1 +
 website/src/pages/Contact.jsx          |   5 +-
 website/src/pages/Home.jsx             | 108 ++++++++++++-------------
 website/src/pages/ProductPage.jsx      |  29 +++----
 7 files changed, 79 insertions(+), 98 deletions(-)

diff --git a/website/src/components/HeroSection.jsx b/website/src/components/HeroSection.jsx
index 9546316..11f471d 100644
--- a/website/src/components/HeroSection.jsx
+++ b/website/src/components/HeroSection.jsx
@@ -198,7 +198,7 @@ export default function HeroSection() {
         {/* Heading */}
         <h1 className="text-center"
           style={{ animation: 'fadeInUp 1.4s cubic-bezier(0.16, 1, 0.3, 1) 0.4s both' }}>
-          <span className="block text-7xl md:text-9xl lg:text-[110px] font-black hero-main-title">
+          <span className="block text-5xl md:text-8xl lg:text-[110px] font-black hero-main-title">
             智慧教育
           </span>
           <span className="block mt-3 text-3xl md:text-[42px] lg:text-[48px] font-extralight hero-sec-title">
diff --git a/website/src/components/Navbar.jsx b/website/src/components/Navbar.jsx
index 6d32854..4e199eb 100644
--- a/website/src/components/Navbar.jsx
+++ b/website/src/components/Navbar.jsx
@@ -8,6 +8,8 @@ export default function Navbar() {
   const [mobileOpen, setMobileOpen] = useState(false);
   const location = useLocation();
 
+  
+
   useEffect(() => {
     const handleScroll = () => setScrolled(window.scrollY > window.innerHeight * 0.7);
     window.addEventListener('scroll', handleScroll, { passive: true });
@@ -24,6 +26,8 @@ export default function Navbar() {
     { to: '/contact', label: '联系我们' },
   ];
 
+  
+
   return (
     <>
       <style>{`
diff --git a/website/src/data/products.js b/website/src/data/products.js
index 7917767..55c44cc 100644
--- a/website/src/data/products.js
+++ b/website/src/data/products.js
@@ -39,12 +39,7 @@ export const products = [
       { q: '能否与学校现有系统对接？', a: '支持。我们提供标准API接口，可与学校现有的教务系统、学工系统、一卡通系统等进行数据对接，实现统一身份认证和数据共享。' },
       { q: '售后服务如何保障？', a: '我们提供完整的培训服务：管理员培训、教师培训、学生培训。售后阶段配备专属客户经理，7×24小时响应，定期回访优化。' },
       { q: '数据安全怎么保证？', a: '系统通过等保三级认证，采用银行级数据加密存储，每日自动备份，多机房容灾。所有数据存储在国内合规云服务器，确保数据安全合规。' },
-    ],
-    demo: {
-      url: 'https://demo.xunchi.com/smart-campus',
-      account: 'demo',
-      password: 'demo123',
-    },
+    ]
   },
   {
     slug: 'exam-system',
@@ -84,12 +79,7 @@ export const products = [
       { q: '能否与学校现有系统对接？', a: '支持。我们提供标准API接口，可与学校现有的教务系统、学工系统、一卡通系统等进行数据对接，实现统一身份认证和数据共享。' },
       { q: '售后服务如何保障？', a: '我们提供完整的培训服务：管理员培训、教师培训、学生培训。售后阶段配备专属客户经理，7×24小时响应，定期回访优化。' },
       { q: '数据安全怎么保证？', a: '系统通过等保三级认证，采用银行级数据加密存储，每日自动备份，多机房容灾。所有数据存储在国内合规云服务器，确保数据安全合规。' },
-    ],
-    demo: {
-      url: 'https://demo.xunchi.com/exam-system',
-      account: 'demo',
-      password: 'demo123',
-    },
+    ]
   },
   {
     slug: 'teaching-resource',
@@ -137,12 +127,7 @@ export const products = [
       { q: '能否与学校现有系统对接？', a: '支持。我们提供标准API接口，可与学校现有的教务系统、学工系统、一卡通系统等进行数据对接，实现统一身份认证和数据共享。' },
       { q: '售后服务如何保障？', a: '我们提供完整的培训服务：管理员培训、教师培训、学生培训。售后阶段配备专属客户经理，7×24小时响应，定期回访优化。' },
       { q: '数据安全怎么保证？', a: '系统通过等保三级认证，采用银行级数据加密存储，每日自动备份，多机房容灾。所有数据存储在国内合规云服务器，确保数据安全合规。' },
-    ],
-    demo: {
-      url: 'https://demo.xunchi.com/teaching-resource',
-      account: 'demo',
-      password: 'demo123',
-    },
+    ]
   },
   {
     slug: 'internship',
@@ -185,12 +170,7 @@ export const products = [
       { q: '能否与学校现有系统对接？', a: '支持。我们提供标准API接口，可与学校现有的教务系统、学工系统、一卡通系统等进行数据对接，实现统一身份认证和数据共享。' },
       { q: '售后服务如何保障？', a: '我们提供完整的培训服务：管理员培训、教师培训、学生培训。售后阶段配备专属客户经理，7×24小时响应，定期回访优化。' },
       { q: '数据安全怎么保证？', a: '系统通过等保三级认证，采用银行级数据加密存储，每日自动备份，多机房容灾。所有数据存储在国内合规云服务器，确保数据安全合规。' },
-    ],
-    demo: {
-      url: 'https://demo.xunchi.com/internship',
-      account: 'demo',
-      password: 'demo123',
-    },
+    ]
   },
 ];
 
diff --git a/website/src/index.css b/website/src/index.css
index c741d05..9e3fc94 100644
--- a/website/src/index.css
+++ b/website/src/index.css
@@ -2,6 +2,7 @@
 
 @theme {
   --font-sans: "DengXian", "SimHei", "Heiti SC", sans-serif;
+  --breakpoint-xs: 480px;
 }
 
 @utility line-clamp-2 {
diff --git a/website/src/pages/Contact.jsx b/website/src/pages/Contact.jsx
index 8c52de6..fbce1dc 100644
--- a/website/src/pages/Contact.jsx
+++ b/website/src/pages/Contact.jsx
@@ -105,7 +105,6 @@ export default function Contact() {
           </ScrollReveal>
           <div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-14 max-w-3xl mx-auto">
             {agentBenefits.map((item, i) => {
-              const Icon = item.icon
               return (
                 <ScrollReveal key={i} delay={i * 0.05}>
                   <div className="relative bg-white rounded-2xl p-8 md:p-10 h-full border border-gray-100 hover:shadow-xl hover:shadow-[#043b8f]/5 transition-all duration-500 group overflow-hidden">
@@ -165,9 +164,9 @@ export default function Contact() {
         />
         <div className="relative max-w-3xl mx-auto text-center">
           <ScrollReveal>
-            <h2 className="text-5xl md:text-6xl font-bold text-white mb-8">携手讯驰 共建智慧校园</h2>
+            <h2 className="text-4xl md:text-6xl font-bold text-white mb-8">携手讯驰 共建智慧校园</h2>
 
-            <p className="text-white text-lg mb-14 max-w-xl mx-auto leading-relaxed">
+            <p className="text-white text-md mb-14 max-w-xl mx-auto leading-relaxed">
               获取产品演示与个性化方案，迈出数字化转型第一步
             </p>
             <div className="flex flex-col sm:flex-row gap-4 justify-center">
diff --git a/website/src/pages/Home.jsx b/website/src/pages/Home.jsx
index c8ceb04..e368c4d 100644
--- a/website/src/pages/Home.jsx
+++ b/website/src/pages/Home.jsx
@@ -1,14 +1,11 @@
 import { Link } from 'react-router-dom';
 import HeroSection from '../components/HeroSection'
-import ProductCard from '../components/ProductCard'
+
 import ScrollReveal from '../components/ScrollReveal'
 import { products } from '../data/products'
 import RosePieChart from '../components/RosePieChart'
 import hunBg from '../assets/images/hun.jpg'
-import {
-  MapPin, CheckCircle2, HeadphonesIcon, ShieldCheck,
-  ArrowRight, Play, Quote, Award, Users, Building2, BookOpen, Briefcase
-} from 'lucide-react'
+import {ArrowRight, Play, Users, Building2} from 'lucide-react'
 
 /* ─── Section 3: 数据亮点 ─── */
 const stats = [
@@ -79,23 +76,8 @@ const customerCards = [
   },
 ]
 
-/* ─── Section 8: 荣誉展示 ─── */
-const honors = [
-  { icon: Award, title: '高新技术企业', desc: '国家级高新技术企业认定，技术创新能力获官方认可' },
-  { icon: ShieldCheck, title: 'AAA级信用企业', desc: '企业信用等级AAA级，商业信誉优良' },
-  { icon: BookOpen, title: 'ISO五项认证', desc: '质量、环境、安全、信息、服务五大国际体系认证' },
-  { icon: CheckCircle2, title: '软件著作权40+', desc: '拥有40余项软件著作权，自主知识产权体系完善' },
-  { icon: Briefcase, title: '等保三级备案', desc: '信息系统安全等级保护三级，数据安全保障有力' },
-  { icon: HeadphonesIcon, title: '全周期服务', desc: '需求调研到运维保障，提供一站式本地化服务' },
-]
 
-const certifications = [
-  'ISO 9001 质量管理体系',
-  'ISO 14001 环境管理体系',
-  'ISO 45001 职业健康安全管理体系',
-  'ISO 27001 信息安全管理体系',
-  'ISO 20000 信息技术服务管理体系',
-]
+
 
 /* ─── Animated counter ─── */
 function StatNumber({ target, suffix }) {
@@ -132,6 +114,20 @@ import { useState, useEffect, useRef } from 'react'
 
 export default function Home() {
   const [activeCapability, setActiveCapability] = useState(0)
+  const [tagRadius, setTagRadius] = useState(68)
+
+  useEffect(() => {
+    const updateRadius = () => {
+      const w = window.innerWidth
+      if (w < 480) setTagRadius(40)
+      else if (w < 768) setTagRadius(48)
+      else if (w < 1024) setTagRadius(54)
+      else setTagRadius(60)
+    }
+    updateRadius()
+    window.addEventListener('resize', updateRadius)
+    return () => window.removeEventListener('resize', updateRadius)
+  }, [])
 
   return (
     <main>
@@ -149,10 +145,10 @@ export default function Home() {
               <div className="grid grid-cols-2 md:grid-cols-4 gap-8 md:gap-10">
                 {stats.map((s, i) => (
                   <div key={i} className="text-center">
-                    <div className="text-4xl md:text-5xl font-black text-[#004ec4] tabular-nums">
+                    <div className="text-3xl xs:text-4xl md:text-5xl lg:text-6xl font-black text-[#004ec4] tabular-nums">
                       <StatNumber target={s.num} suffix={s.suffix} />
                     </div>
-                    <div className="mt-3 text-sm text-[#64748b] font-medium">{s.label}</div>
+                    <div className="mt-3 text-xs xs:text-sm md:text-base text-[#64748b] font-medium">{s.label}</div>
                   </div>
                 ))}
               </div>
@@ -165,9 +161,9 @@ export default function Home() {
       <section id="products" className="py-20 px-4 bg-white">
         <div className="max-w-6xl mx-auto">
           <ScrollReveal className="text-center mb-14">
-            <p className="text-xs text-[#004ec4] tracking-[0.25em] uppercase mb-3 font-semibold">Core Capabilities</p>
-            <h2 className="text-5xl md:text-7xl font-bold text-[#0f172a] mb-6">四大产品体系</h2>
-            <p className="text-[#64748b] text-lg md:text-xl mx-auto whitespace-nowrap mb-4 leading-relaxed">全面覆盖职业院校教学、管理、党建、科研四大核心场景，为数字化校园建设提供一站式解决方案</p>
+            <p className="text-[10px] xs:text-xs text-[#004ec4] tracking-[0.25em] uppercase mb-3 font-semibold">Core Capabilities</p>
+            <h2 className="text-3xl xs:text-4xl sm:text-5xl md:text-7xl font-bold text-[#0f172a] mb-6">四大产品体系</h2>
+            <p className="text-[#64748b] text-sm xs:text-base md:text-lg lg:text-xl mx-auto md:whitespace-nowrap mb-4 leading-relaxed">全面覆盖职业院校教学、管理、党建、科研四大核心场景，为数字化校园建设提供一站式解决方案</p>
           </ScrollReveal>
 
           {/* Tab bar */}
@@ -177,12 +173,12 @@ export default function Home() {
                 <button
                   key={p.slug}
                   onClick={() => setActiveCapability(i)}
-                  className={`flex items-center gap-2 px-6 py-3 rounded-lg text-sm font-medium transition-all border ${activeCapability === i
+                  className={`flex items-center gap-1.5 xs:gap-2 px-3 xs:px-4 sm:px-6 py-2 xs:py-3 rounded-lg text-xs xs:text-sm font-medium transition-all border ${activeCapability === i
                     ? 'text-[#043b8f] border-[#043b8f]'
                     : 'text-[#475569] border-gray-200 hover:text-[#043b8f] hover:border-[#043b8f]'
                     }`}
                 >
-                  <p.icon className="w-5 h-5" style={{ color: activeCapability === i ? '#043b8f' : p.themeColor }} />
+                  <p.icon className="w-4 h-4 xs:w-5 xs:h-5" style={{ color: activeCapability === i ? '#043b8f' : p.themeColor }} />
                   {p.name}
                 </button>
               ))}
@@ -222,15 +218,15 @@ export default function Home() {
                           : 'bg-gray-100'
                           }`} />
                       </div>
-                      <h3 className={`text-2xl font-bold transition-colors duration-300 ${activeCapability === idx ? 'text-[#043b8f]' : 'text-[#0f172a]'
+                      <h3 className={`text-lg xs:text-xl sm:text-2xl font-bold transition-colors duration-300 ${activeCapability === idx ? 'text-[#043b8f]' : 'text-[#0f172a]'
                         }`}>{c.title}</h3>
-                      <p className={`text-base mt-1.5 font-medium transition-colors duration-300 ${activeCapability === idx ? 'text-[#043b8f]/60' : 'text-[#94a3b8]'
+                      <p className={`text-sm xs:text-base mt-1.5 font-medium transition-colors duration-300 ${activeCapability === idx ? 'text-[#043b8f]/60' : 'text-[#94a3b8]'
                         }`}>{c.sub}</p>
-                      <p className="text-base text-[#334155] leading-[2] mt-4">{c.desc}</p>
+                      <p className="text-sm xs:text-base text-[#334155] leading-[2] mt-4">{c.desc}</p>
                       {c.tip && (
                         <div className="mt-5 flex flex-wrap gap-2">
                           {c.tip.split('、').map((t, ti) => (
-                            <span key={ti} className={`px-4 py-1.5 text-sm font-medium rounded-md transition-all duration-200 ${
+                            <span key={ti} className={`px-3 py-1 xs:px-4 xs:py-1.5 text-xs xs:text-sm font-medium rounded-md transition-all duration-200 ${
                               activeCapability === idx
                                 ? 'text-[#043b8f] bg-[#043b8f]/[0.08]'
                                 : 'text-[#94a3b8] bg-gray-50'
@@ -276,25 +272,25 @@ export default function Home() {
 
         <div className="relative max-w-5xl mx-auto text-center">
           <ScrollReveal>
-            <p className="text-xs text-white/80 tracking-[0.3em] uppercase mb-4 font-semibold">Why Choose Us</p>
-            <h2 className="text-4xl md:text-6xl font-black mb-6 leading-tight text-white"
+            <p className="text-[10px] xs:text-xs text-white/80 tracking-[0.3em] uppercase mb-4 font-semibold">Why Choose Us</p>
+            <h2 className="text-3xl xs:text-4xl md:text-6xl font-black mb-6 leading-tight text-white"
               style={{
                 textShadow: '0 4px 30px rgba(59,130,246,0.3), 0 2px 4px rgba(0,0,0,0.4)',
               }}>为什么选择讯驰</h2>
             <div className="flex items-center justify-center gap-3 mb-16">
               <span className="w-12 h-px bg-gradient-to-r from-transparent to-white/60" />
-              <p className="text-white text-xl md:text-2xl font-medium tracking-wider">AAA级信用企业 · 高新技术企业</p>
+              <p className="text-white text-base xs:text-lg sm:text-xl md:text-2xl font-medium tracking-wider">AAA级信用企业 · 高新技术企业</p>
               <span className="w-12 h-px bg-gradient-to-l from-transparent to-white/60" />
             </div>
           </ScrollReveal>
 
           {/* Surrounding tags */}
           <ScrollReveal>
-            <div className="relative w-[320px] h-[320px] md:w-[420px] md:h-[420px] mx-auto mb-16">
+            <div className="relative w-[280px] h-[280px] xs:w-[320px] xs:h-[320px] md:w-[420px] md:h-[420px] lg:w-[500px] lg:h-[500px] mx-auto mb-16">
               {/* Outer rings */}
               <div className="absolute inset-0 rounded-full border border-white/[0.08]" />
-              <div className="absolute inset-8 rounded-full border border-white/[0.06]" />
-              <div className="absolute inset-16 rounded-full border border-white/[0.04]" />
+              <div className="absolute inset-6 xs:inset-8 md:inset-10 lg:inset-12 rounded-full border border-white/[0.06]" />
+              <div className="absolute inset-12 xs:inset-16 md:inset-20 lg:inset-24 rounded-full border border-white/[0.04]" />
 
               {/* Orbiting dots */}
               <div className="absolute w-2 h-2 rounded-full bg-[#004ec4]"
@@ -310,7 +306,7 @@ export default function Home() {
                 { text: '数据安全，合规可靠', angle: 120 },
               ].map((tag, i) => {
                 const rad = (tag.angle * Math.PI) / 180
-                const r = 68
+                const r = tagRadius
                 const x = 50 + r * Math.sin(rad)
                 const y = 50 - r * Math.cos(rad)
                 const colors = [
@@ -331,7 +327,7 @@ export default function Home() {
                   >
                     {/* 书签主体 */}
                     <div
-                      className="relative px-6 py-3.5 text-base font-bold text-white/95 overflow-hidden"
+                      className="relative px-3 py-2 xs:px-4 xs:py-2.5 md:px-6 md:py-3.5 lg:px-7 lg:py-4 text-xs xs:text-sm md:text-base lg:text-lg font-bold text-white/95 overflow-hidden"
                       style={{
                         background: colors[i].bg,
                         borderRadius: '12px 12px 4px 4px',
@@ -352,8 +348,8 @@ export default function Home() {
                         }}
                       />
                       {i < 2
-                        ? <>{tag.text}<span className="inline-block w-2 h-2 rounded-full bg-white/80 ml-2 align-middle" /></>
-                        : <><span className="inline-block w-2 h-2 rounded-full bg-white/80 mr-2 align-middle" />{tag.text}</>
+                        ? <>{tag.text}<span className="inline-block w-1.5 h-1.5 xs:w-2 xs:h-2 rounded-full bg-white/80 ml-1.5 xs:ml-2 align-middle" /></>
+                        : <><span className="inline-block w-1.5 h-1.5 xs:w-2 xs:h-2 rounded-full bg-white/80 mr-1.5 xs:mr-2 align-middle" />{tag.text}</>
                       }
                     </div>
                   </div>
@@ -366,7 +362,7 @@ export default function Home() {
           <ScrollReveal>
             <Link
               to="/contact"
-              className="inline-flex items-center gap-2 px-8 py-3 rounded-full text-base font-medium text-white border border-white/20 hover:bg-white/10 hover:border-white/40 transition-all duration-300"
+              className="inline-flex items-center gap-2 px-6 xs:px-8 py-2.5 xs:py-3 rounded-full text-sm xs:text-base font-medium text-white border border-white/20 hover:bg-white/10 hover:border-white/40 transition-all duration-300"
               style={{ boxShadow: '0 4px 20px rgba(0,0,0,0.2)' }}
             >
               获取解决方案
@@ -382,9 +378,9 @@ export default function Home() {
       <section className="py-20 px-4 bg-[#f8fafc]">
         <div className="max-w-6xl mx-auto">
           <ScrollReveal className="text-center mb-14">
-            <p className="text-xs text-[#004ec4] tracking-[0.25em] uppercase mb-3 font-semibold">Recognition</p>
-            <h2 className="text-5xl md:text-6xl font-bold text-[#0f172a] mb-4">资质与认证</h2>
-            <p className="text-[#64748b] text-base max-w-xl mx-auto">AAA级信用企业 · 高新技术企业</p>
+            <p className="text-[10px] xs:text-xs text-[#004ec4] tracking-[0.25em] uppercase mb-3 font-semibold">Recognition</p>
+            <h2 className="text-3xl xs:text-4xl sm:text-5xl md:text-6xl font-bold text-[#0f172a] mb-4">资质与认证</h2>
+            <p className="text-[#64748b] text-sm xs:text-base max-w-xl mx-auto">AAA级信用企业 · 高新技术企业</p>
           </ScrollReveal>
 
           <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
@@ -398,13 +394,13 @@ export default function Home() {
                     <div className="absolute top-0 right-0 w-20 h-20 bg-[#043b8f]/[0.03] rounded-bl-full opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
                     <div className="absolute bottom-0 left-0 w-14 h-14 border border-[#043b8f]/[0.06] rounded-tr-3xl opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
                     {/* 图标 */}
-                    <div className="w-16 h-16 rounded-xl bg-[#043b8f]/[0.06] border border-[#043b8f]/10 flex items-center justify-center mb-5 group-hover:bg-[#043b8f]/10 transition-all duration-300">
-                      <Icon className="w-8 h-8 text-[#043b8f]" />
+                    <div className="w-12 h-12 xs:w-14 xs:h-14 sm:w-16 sm:h-16 rounded-xl bg-[#043b8f]/[0.06] border border-[#043b8f]/10 flex items-center justify-center mb-5 group-hover:bg-[#043b8f]/10 transition-all duration-300">
+                      <Icon className="w-6 h-6 xs:w-7 xs:h-7 sm:w-8 sm:h-8 text-[#043b8f]" />
                     </div>
                     {/* 数字 */}
-                    <div className="text-5xl font-black text-transparent bg-clip-text bg-gradient-to-b from-[#0f172a] to-[#334155] mb-1">{card.count}</div>
+                    <div className="text-3xl xs:text-4xl sm:text-5xl font-black text-transparent bg-clip-text bg-gradient-to-b from-[#0f172a] to-[#334155] mb-1">{card.count}</div>
                     {/* 标题 */}
-                    <h3 className="text-lg font-bold text-[#0f172a] mb-3">{card.title}</h3>
+                    <h3 className="text-sm xs:text-base sm:text-lg font-bold text-[#0f172a] mb-3">{card.title}</h3>
                     {/* 分隔线 */}
                     <div className="w-8 h-px bg-gradient-to-r from-transparent via-[#043b8f]/20 to-transparent mb-3" />
                     {/* 描述 */}
@@ -431,22 +427,22 @@ export default function Home() {
         />
         <div className="relative max-w-3xl mx-auto text-center">
           <ScrollReveal>
-            <h2 className="text-5xl md:text-6xl font-bold text-white mb-8">携手讯驰，共建智慧校园</h2>
-            <p className="text-white text-lg mb-14 max-w-xl mx-auto leading-relaxed">
+            <h2 className="text-3xl xs:text-4xl sm:text-5xl md:text-6xl font-bold text-white mb-8">携手讯驰，共建智慧校园</h2>
+            <p className="text-white text-sm xs:text-base sm:text-lg mb-14 max-w-xl mx-auto leading-relaxed">
               获取产品演示与个性化方案，迈出数字化转型第一步
             </p>
-            <div className="flex flex-col sm:flex-row gap-4 justify-center">
+            <div className="flex flex-col sm:flex-row gap-3 xs:gap-4 justify-center mx-auto w-[60%] xs:w-[85%] sm:w-auto">
               <Link
                 to="/contact"
-                className="inline-flex items-center gap-2 px-8 py-3 rounded-xl text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
+                className="inline-flex items-center justify-center gap-2 px-5 xs:px-6 py-2.5 xs:py-3 rounded-xl text-md xs:text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
               >
                 联系我们
-                <ArrowRight className="w-4 h-4" />
+                <ArrowRight className="w-3.5 h-3.5 xs:w-4 xs:h-4" />
               </Link>
               <a
                 href="tel:07713864294"
 
-                className="inline-flex items-center gap-2 px-8 py-3 rounded-xl text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
+                className="inline-flex items-center justify-center gap-2 px-5 xs:px-6 py-2.5 xs:py-3 rounded-xl text-md xs:text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
               >
                 致电 0771-3864294
               </a>
diff --git a/website/src/pages/ProductPage.jsx b/website/src/pages/ProductPage.jsx
index 12131d6..33217cd 100644
--- a/website/src/pages/ProductPage.jsx
+++ b/website/src/pages/ProductPage.jsx
@@ -1,13 +1,14 @@
 import { useParams, Link } from 'react-router-dom'
-import { ChevronDown, ArrowRight, Shield, Clock, Headphones, Sparkles, CheckCircle2, AlertCircle } from 'lucide-react'
-import { getProduct, products } from '../data/products'
-import ProductCard from '../components/ProductCard'
+import { ChevronDown, ArrowRight, Shield, Clock, Headphones,  AlertCircle } from 'lucide-react'
+import { getProduct } from '../data/products'
 import ScrollReveal from '../components/ScrollReveal'
 
 export default function ProductPage() {
   const { slug } = useParams()
   const product = getProduct(slug)
 
+  
+
   if (!product) {
     return (
       <div className="min-h-screen flex items-center justify-center bg-white">
@@ -20,8 +21,8 @@ export default function ProductPage() {
     )
   }
 
-  const Icon = product.icon
-  const otherProducts = products.filter(p => p.slug !== slug)
+  // const Icon = product.icon
+  // const otherProducts = products.filter(p => p.slug !== slug)
 
   return (
     <main className="bg-white">
@@ -40,7 +41,7 @@ export default function ProductPage() {
           <div className="relative max-w-4xl mx-auto px-6 text-center pt-32">
 
 
-            <h1 className="text-5xl md:text-7xl font-extrabold mb-5 tracking-tight leading-[1.1] text-white hero-product-title">
+            <h1 className="text-4xl md:text-7xl font-extrabold mb-5 tracking-tight leading-[1.1] text-white hero-product-title">
               {product.name}
             </h1>
             <p className="text-2xl md:text-3xl mb-6 max-w-xl mx-auto leading-relaxed hero-product-slogan">
@@ -107,7 +108,7 @@ export default function ProductPage() {
                   <span className="w-5 h-[2px] rounded-full bg-[#043b8f]" />
                   <span className="text-xs font-semibold uppercase tracking-[0.25em] text-[#043b8f]">Pain Points</span>
                 </div>
-                <h2 className="text-4xl md:text-[3.5rem] font-black text-[#0f172a] tracking-tight leading-[1.1]">
+                <h2 className="text-2xl md:text-[3.5rem] font-black text-[#0f172a] tracking-tight leading-[1.1]">
                   {product.painPointsTitle || `${product.name}解决的核心问题`}
                 </h2>
                 <p className="text-[#475569] text-lg md:text-xl mt-6 max-w-xl leading-relaxed">深入理解管理难题，提供经过实战验证的解决方案</p>
@@ -147,7 +148,7 @@ export default function ProductPage() {
                 <span className="w-5 h-[2px] rounded-full bg-[#043b8f]" />
                 <span className="text-xs font-semibold uppercase tracking-[0.25em] text-[#043b8f]">Core Features</span>
               </div>
-              <h2 className="text-4xl md:text-[3.5rem] font-black text-[#0f172a] tracking-tight leading-[1.1]">
+              <h2 className="text-3xl md:text-[3.5rem] font-black text-[#0f172a] tracking-tight leading-[1.1]">
                 核心功能
               </h2>
               {product.target && (
@@ -287,21 +288,21 @@ export default function ProductPage() {
         />
         <div className="relative max-w-3xl mx-auto text-center">
           <ScrollReveal>
-            <h2 className="text-5xl md:text-6xl font-bold text-white mb-8">对{product.name}感兴趣？</h2>
-            <p className="text-white text-lg mb-14 max-w-xl mx-auto leading-relaxed">
+            <h2 className="text-3xl xs:text-4xl sm:text-5xl md:text-6xl font-bold text-white mb-8">对{product.name}感兴趣？</h2>
+            <p className="text-white text-sm xs:text-base sm:text-lg mb-14 max-w-xl mx-auto leading-relaxed">
               获取产品演示与个性化方案，迈出数字化转型第一步
             </p>
-            <div className="flex flex-col sm:flex-row gap-4 justify-center">
+            <div className="flex flex-col sm:flex-row gap-3 xs:gap-4 justify-center mx-auto w-[90%] xs:w-[85%] sm:w-auto">
               <Link
                 to="/contact"
-                className="inline-flex items-center gap-2 px-8 py-3 rounded-xl text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
+                className="inline-flex items-center justify-center gap-2 px-5 xs:px-6 py-2.5 xs:py-3 rounded-xl text-xs xs:text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
               >
                 联系我们
-                <ArrowRight className="w-4 h-4" />
+                <ArrowRight className="w-3.5 h-3.5 xs:w-4 xs:h-4" />
               </Link>
               <a
                 href="tel:07713864294"
-                className="inline-flex items-center gap-2 px-8 py-3 rounded-xl text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
+                className="inline-flex items-center justify-center gap-2 px-5 xs:px-6 py-2.5 xs:py-3 rounded-xl text-xs xs:text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
               >
                 致电 0771-3864294
               </a>