feat: 添加连锁门店系统首页及核心UI组件

新增首页布局、导航栏、页脚及多个核心UI组件（按钮、卡片、表格等）
添加图片资源、工具函数和样式配置
实现响应式设计和主题支持
包含行业解决方案展示区块

components/sections/process-section.tsx

@@ -0,0 +1,111 @@
+"use client"
+
+import { Badge } from "@/components/ui/badge"
+import { Button } from "@/components/ui/button"
+import { SectionReveal } from "@/components/ui/section-reveal"
+import { ArrowRight } from "lucide-react"
+import { useParallax } from "@/hooks/use-parallax"
+import homeData from "@/data/home.json"
+import Link from "next/link"
+
+export function ProcessSection() {
+  const homeDataAny = homeData as any
+  const process = homeDataAny.process ?? homeDataAny.howItWorks
+  const sectionBadge = process?.sectionBadge ?? process?.sectionTag
+  const steps = (Array.isArray(process?.steps) ? process.steps : []).map((step: any) => ({
+    ...step,
+    num: step.num ?? step.number,
+  }))
+  const { ref: bgRef, translateY: bgY } = useParallax(0.2)
+
+  if (!process) {
+    return null
+  }
+
+  return (
+    <section
+      id="process"
+      className="section-panel overflow-hidden"
+    >
+      {/* Parallax dark background */}
+      <div
+        ref={bgRef}
+        className="absolute inset-[-15%] will-change-transform"
+        style={{ transform: `translateY(${bgY})` }}
+        aria-hidden="true"
+      >
+        <div className="absolute inset-0 bg-surface-dark" />
+        {/* Dot grid */}
+        <div
+          className="absolute inset-0 opacity-[0.07]"
+          style={{
+            backgroundImage: "radial-gradient(circle, oklch(1 0 0 / 1) 1px, transparent 1px)",
+            backgroundSize: "32px 32px",
+          }}
+        />
+        {/* Blue glow */}
+        <div
+          className="absolute bottom-0 left-1/2 -translate-x-1/2 w-[800px] h-[400px] opacity-20"
+          style={{
+            background: "radial-gradient(ellipse at center bottom, oklch(0.46 0.22 264) 0%, transparent 70%)",
+          }}
+        />
+      </div>
+
+      <SectionReveal className="relative z-10 w-full max-w-7xl mx-auto px-4 sm:px-6 lg:px-8" delay={100}>
+
+        {/* Header */}
+        <div className="text-center max-w-xl mx-auto mb-16">
+          <Badge className="mb-4 bg-primary/20 text-primary border-primary/30 px-3 py-1">
+            {sectionBadge}
+          </Badge>
+          <h2 className="text-3xl sm:text-4xl lg:text-5xl font-extrabold text-white text-balance tracking-tight">
+            {process.title}
+          </h2>
+          <p className="text-white/65 leading-relaxed text-pretty mt-4">
+            {process.subtitle}
+          </p>
+        </div>
+
+        {/* Steps */}
+        <div className="relative grid grid-cols-1 md:grid-cols-3 gap-8">
+          {/* Connector line (desktop) */}
+          <div
+            className="hidden md:block absolute top-10 left-[calc(16.7%+1rem)] right-[calc(16.7%+1rem)] h-px border-t border-dashed border-white/20"
+            aria-hidden="true"
+          />
+
+          {steps.map((step) => (
+            <article key={step.num} className="relative flex flex-col items-center text-center gap-5">
+              {/* Number circle */}
+              <div className="relative z-10 w-20 h-20 rounded-full border-2 border-primary bg-surface-dark flex items-center justify-center shadow-lg shadow-primary/20">
+                <span className="text-2xl font-black text-primary">{step.num}</span>
+              </div>
+
+              {/* Content card */}
+              <div className="bg-white/6 backdrop-blur-sm border border-white/10 rounded-2xl p-6 w-full">
+                <h3 className="text-xl font-bold text-white mb-3">{step.title}</h3>
+                <p className="text-white/60 text-sm leading-relaxed">{step.description}</p>
+              </div>
+            </article>
+          ))}
+        </div>
+
+        {/* CTA */}
+        <div className="mt-14 flex justify-center">
+          <Button
+            asChild
+            size="lg"
+            className="bg-primary hover:bg-primary-dark text-white shadow-xl shadow-primary/30 px-8 h-12 text-base font-semibold group"
+          >
+            <Link href="#contact" className="flex items-center gap-2">
+              预约方案诊断
+              <ArrowRight className="w-4 h-4 group-hover:translate-x-0.5 transition-transform" />
+            </Link>
+          </Button>
+        </div>
+
+      </SectionReveal>
+    </section>
+  )
+}