feat(app): 新增支持页面组件

- 添加了售后服务页面组件，包括售后服务部分和服务咨询部分
- 集成了SubTitle组件和Next.js的Image组件
- 设计了响应式布局，适应不同屏幕尺寸
- 添加了背景图片和渐变效果，提升页面视觉

src/app/support/page.tsx

@@ -0,0 +1,107 @@
+import SubTitle from "@/components/subTitle";
+import Image from "next/image";
+
+export default function ServicePage() {
+  return (
+    <>
+      <div>
+        <Image src={"/assets/support/1.png"} alt={"banner"} width={1920} height={1080} />
+      </div>
+      {/* After-sales Service Section */}
+      <section className="py-16 px-4 bg-[#EFF5FB]">
+        <div className="max-w-4/5 mx-auto">
+          {/* Section Title */}
+          <div className="mb-12 sm:text-left text-center">
+            <SubTitle title={"售后服务"}/>
+          </div>
+
+          {/* Service Cards Grid */}
+          <div className="grid grid-cols-2 lg:grid-cols-4 gap-8">
+            {/* Card 1 */}
+            <div className="text-center">
+              <div className="w-24 h-24 bg-blue-500 rounded-full mx-auto mb-4 flex items-center justify-center">
+                <Image src={"/assets/support/2.png"} alt={"提供专属保障"} width={500} height={500} />
+              </div>
+              <h3 className="text-2xl font-semibold mb-2 text-[#0F397B]">提供专属保障</h3>
+              <p className="text-gray-600 text-sm leading-relaxed">单独安排技术专家，保障快速响应</p>
+            </div>
+
+            {/* Card 2 */}
+            <div className="text-center">
+              <div className="w-24 h-24 bg-blue-500 rounded-full mx-auto mb-4 flex items-center justify-center">
+                <Image src={"/assets/support/2.png"} alt={"提供专属保障"} width={500} height={500} />
+              </div>
+              <h3 className="text-2xl font-semibold mb-2 text-[#0F397B]">7*24*365远程运维</h3>
+              <p className="text-gray-600 text-sm leading-relaxed">远程线上维护，服务不间断</p>
+            </div>
+
+            {/* Card 3 */}
+            <div className="text-center">
+              <div className="w-24 h-24 bg-blue-500 rounded-full mx-auto mb-4 flex items-center justify-center">
+                <Image src={"/assets/support/2.png"} alt={"提供专属保障"} width={500} height={500} />
+              </div>
+              <h3 className="text-2xl font-semibold mb-2 text-[#0F397B]">透明公开</h3>
+              <p className="text-gray-600 text-sm leading-relaxed">服务过程进度，线上公开透明化</p>
+            </div>
+
+            {/* Card 4 */}
+            <div className="text-center">
+              <div className="w-24 h-24 bg-blue-500 rounded-full mx-auto mb-4 flex items-center justify-center">
+                <Image src={"/assets/support/2.png"} alt={"提供专属保障"} width={500} height={500} />
+              </div>
+              <h3 className="text-2xl font-semibold mb-2 text-[#0F397B]">主动排除故障</h3>
+              <p className="text-gray-600 text-sm leading-relaxed">实现&#34;救火式&#34;向&#34;预防式&#34;产品运维转型</p>
+            </div>
+          </div>
+        </div>
+      </section>
+
+      {/* Service Consultation Section */}
+      <section className="bg-[url('/assets/support/3.png')] bg-cover py-16 px-4 relative overflow-hidden">
+        {/* Background Light Effects */}
+        <div className="absolute right-0 top-1/2 transform -translate-y-1/2 w-96 h-96 opacity-30">
+          <div className="w-full h-full bg-gradient-radial from-blue-400 via-blue-600 to-transparent rounded-full blur-3xl"></div>
+        </div>
+        <div className="absolute right-20 top-1/2 transform -translate-y-1/2 w-64 h-64 opacity-20">
+          <div className="w-full h-full bg-gradient-radial from-cyan-300 via-blue-500 to-transparent rounded-full blur-2xl"></div>
+        </div>
+
+        <div className="max-w-4/5 mx-auto relative z-10">
+          <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
+            {/* Left Content */}
+            <div className="text-white">
+              {/* Section Title */}
+              <div className="mb-8 sm:text-left text-center">
+                <SubTitle title={"服务咨询"} color={"#fff"}/>
+              </div>
+
+              {/* Contact Information */}
+              <div className="space-y-6">
+                <div>
+                  <p className="text-gray-300 mb-2">中科盛阳服务热线：</p>
+                  <p className="text-4xl font-bold">0731-85315153</p>
+                </div>
+
+                <div className="space-y-2">
+                  <p className="text-gray-300">如需自选以下业务，您可以直接拨打相关热线电话：</p>
+                  <p className="text-gray-300">24小时产品售前咨询服务热线：400-666-7001</p>
+                </div>
+
+                <div>
+                  <button className="bg-blue-600 hover:bg-blue-700 text-white text-xl px-8 py-3 rounded-lg font-medium transition-colors duration-200">
+                    咨询
+                  </button>
+                </div>
+              </div>
+            </div>
+
+            {/* Right Side - Light Effects Area */}
+            <div className="hidden lg:block">
+              {/* This space is for the light effects which are handled by the background */}
+            </div>
+          </div>
+        </div>
+      </section>
+    </>
+  )
+}