build: 更新Next.js配置以支持静态导出并添加新依赖

更新next.config.ts文件以支持静态导出功能，并添加了多个新的依赖项到package.json中，包括UI组件库和动画库。同时生成了构建相关的文件和配置。

src/app/(marketing)/about/page.tsx

@@ -0,0 +1,183 @@
+import { COMPANY_INFO, STATS } from '@/lib/constants';
+import { Badge } from '@/components/ui/badge';
+import { Card, CardContent } from '@/components/ui/card';
+import { Lightbulb, Users, Target, Award, MapPin, Mail, Phone } from 'lucide-react';
+
+export const metadata = {
+  title: `关于我们 - ${COMPANY_INFO.name}`,
+  description: `了解${COMPANY_INFO.name}的发展历程、企业文化和核心价值观。成立于2026年，专注于企业数字化转型服务。`,
+};
+
+export default function AboutPage() {
+  const values = [
+    {
+      icon: Lightbulb,
+      title: '创新驱动',
+      description: '持续探索前沿技术，以创新思维解决业务挑战，为客户创造差异化价值',
+    },
+    {
+      icon: Users,
+      title: '客户至上',
+      description: '深入理解客户需求，提供个性化解决方案，建立长期合作伙伴关系',
+    },
+    {
+      icon: Target,
+      title: '追求卓越',
+      description: '精益求精的工作态度，确保每个项目都达到最高质量标准',
+    },
+    {
+      icon: Award,
+      title: '诚信负责',
+      description: '恪守商业道德，对承诺负责，赢得客户和社会的信任与尊重',
+    },
+  ];
+
+  const milestones = [
+    {
+      date: '2026年1月15日',
+      title: '公司成立',
+      description: '四川睿新致远科技有限公司在成都龙泉驿区正式成立，开始提供软件开发服务',
+    },
+    {
+      date: '2026年1月20日',
+      title: '推出转型方案',
+      description: '发布企业数字化转型解决方案，整合云计算、大数据、人工智能等前沿技术',
+    },
+    {
+      date: '2026年1月25日',
+      title: '战略合作',
+      description: '与本地知名制造企业签署战略合作协议，共同打造智能制造示范工厂',
+    },
+    {
+      date: '2026年2月1日',
+      title: '行业认可',
+      description: '正式加入四川省软件行业协会，成为协会成员单位',
+    },
+    {
+      date: '2026年2月2日',
+      title: '官网上线',
+      description: '公司官方网站正式上线，为客户提供更加便捷的信息获取渠道',
+    },
+  ];
+
+  return (
+    <div className="pt-32 pb-20">
+      <div className="container-custom">
+        {/* 头部介绍 */}
+        <div className="max-w-4xl mx-auto">
+          <div className="text-center mb-16">
+            <Badge variant="outline" className="mb-4">
+              关于我们
+            </Badge>
+            <h1 className="text-4xl sm:text-5xl font-bold text-black mb-6">
+              关于 {COMPANY_INFO.shortName}
+            </h1>
+            <p className="text-lg text-gray-600">
+              {COMPANY_INFO.slogan}
+            </p>
+          </div>
+
+          {/* 公司简介 */}
+          <div className="prose prose-lg max-w-none mb-16">
+            <h2 className="text-2xl font-bold text-black mb-4">公司简介</h2>
+            <p className="text-gray-600 mb-6 leading-relaxed">
+              {COMPANY_INFO.name}成立于{COMPANY_INFO.founded}年1月15日，总部位于{COMPANY_INFO.location}龙泉驿区幸福路12号。
+              公司专注于信息技术服务与解决方案，致力于为企业提供全方位的数字化转型支持。
+            </p>
+            <p className="text-gray-600 mb-6 leading-relaxed">
+              我们拥有一支经验丰富的技术团队，在软件开发、云计算、数据分析、信息安全等领域具有深厚的技术积累。
+              公司秉承"专注科技创新，驱动智慧未来"的理念，为客户提供高质量的产品和服务，助力企业在数字经济时代实现转型升级。
+            </p>
+          </div>
+
+          {/* 数据统计 */}
+          <div className="grid grid-cols-2 md:grid-cols-4 gap-6 mb-16">
+            {STATS.map((stat, idx) => (
+              <Card key={idx} className="text-center">
+                <CardContent className="pt-6">
+                  <div className="text-3xl sm:text-4xl font-bold text-black mb-2">{stat.value}</div>
+                  <div className="text-sm text-gray-600">{stat.label}</div>
+                </CardContent>
+              </Card>
+            ))}
+          </div>
+
+          {/* 核心价值观 */}
+          <div className="mb-16">
+            <h2 className="text-2xl font-bold text-black mb-6 text-center">核心价值观</h2>
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+              {values.map((value, idx) => (
+                <Card key={idx} className="group hover:shadow-md transition-shadow">
+                  <CardContent className="p-6">
+                    <div className="flex items-start gap-4">
+                      <div className="p-3 bg-gray-100 rounded-lg group-hover:bg-black group-hover:text-white transition-colors">
+                        <value.icon className="w-6 h-6" />
+                      </div>
+                      <div>
+                        <h3 className="font-semibold text-lg mb-2">{value.title}</h3>
+                        <p className="text-gray-600 text-sm leading-relaxed">{value.description}</p>
+                      </div>
+                    </div>
+                  </CardContent>
+                </Card>
+              ))}
+            </div>
+          </div>
+
+          {/* 发展历程 */}
+          <div className="mb-16">
+            <h2 className="text-2xl font-bold text-black mb-6 text-center">发展历程</h2>
+            <div className="space-y-6">
+              {milestones.map((milestone, idx) => (
+                <div key={idx} className="flex gap-4 md:gap-6">
+                  <div className="w-32 md:w-40 flex-shrink-0">
+                    <div className="font-semibold text-black text-sm md:text-base">{milestone.date}</div>
+                  </div>
+                  <div className="flex-1 pb-6 border-l-2 border-gray-200 pl-6 relative">
+                    <div className="absolute -left-[9px] top-1 w-4 h-4 bg-black rounded-full"></div>
+                    <h3 className="font-semibold text-black mb-1">{milestone.title}</h3>
+                    <p className="text-gray-600 text-sm leading-relaxed">{milestone.description}</p>
+                  </div>
+                </div>
+              ))}
+            </div>
+          </div>
+
+          {/* 联系我们 */}
+          <div className="bg-gray-50 rounded-2xl p-8">
+            <h2 className="text-2xl font-bold text-black mb-6 text-center">联系我们</h2>
+            <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
+              <div className="flex items-center gap-3">
+                <div className="p-2 bg-white rounded-lg">
+                  <MapPin className="w-5 h-5 text-gray-600" />
+                </div>
+                <div>
+                  <p className="text-sm text-gray-500">公司地址</p>
+                  <p className="text-sm font-medium">{COMPANY_INFO.address}</p>
+                </div>
+              </div>
+              <div className="flex items-center gap-3">
+                <div className="p-2 bg-white rounded-lg">
+                  <Mail className="w-5 h-5 text-gray-600" />
+                </div>
+                <div>
+                  <p className="text-sm text-gray-500">电子邮箱</p>
+                  <p className="text-sm font-medium">{COMPANY_INFO.email}</p>
+                </div>
+              </div>
+              <div className="flex items-center gap-3">
+                <div className="p-2 bg-white rounded-lg">
+                  <Phone className="w-5 h-5 text-gray-600" />
+                </div>
+                <div>
+                  <p className="text-sm text-gray-500">联系电话</p>
+                  <p className="text-sm font-medium">{COMPANY_INFO.phone}</p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

src/app/(marketing)/contact/page.tsx

@@ -0,0 +1,198 @@
+'use client';
+
+import { useState } from 'react';
+import { COMPANY_INFO } from '@/lib/constants';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { Textarea } from '@/components/ui/textarea';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { Mail, Phone, MapPin, Send, Loader2 } from 'lucide-react';
+
+export default function ContactPage() {
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [isSubmitted, setIsSubmitted] = useState(false);
+
+  async function handleSubmit(formData: FormData) {
+    setIsSubmitting(true);
+    
+    // Simulate form submission
+    await new Promise(resolve => setTimeout(resolve, 1500));
+    
+    setIsSubmitting(false);
+    setIsSubmitted(true);
+  }
+
+  return (
+    <div className="pt-32 pb-20">
+      <div className="container-custom">
+        <div className="text-center max-w-3xl mx-auto mb-16">
+          <Badge variant="outline" className="mb-4">
+            联系我们
+          </Badge>
+          <h1 className="text-4xl sm:text-5xl font-bold text-black mb-6">
+            与我们取得联系
+          </h1>
+          <p className="text-lg text-gray-600">
+            无论您有任何问题或合作意向，我们都很乐意与您交流
+          </p>
+        </div>
+
+        <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 max-w-6xl mx-auto">
+          {/* Contact Info */}
+          <div className="space-y-8">
+            <Card>
+              <CardHeader>
+                <CardTitle>联系方式</CardTitle>
+              </CardHeader>
+              <CardContent className="space-y-6">
+                <div className="flex items-start gap-4">
+                  <div className="w-10 h-10 bg-black rounded-lg flex items-center justify-center flex-shrink-0">
+                    <MapPin className="w-5 h-5 text-white" />
+                  </div>
+                  <div>
+                    <h3 className="font-semibold text-black">公司地址</h3>
+                    <p className="text-gray-600">{COMPANY_INFO.address}</p>
+                  </div>
+                </div>
+                <div className="flex items-start gap-4">
+                  <div className="w-10 h-10 bg-black rounded-lg flex items-center justify-center flex-shrink-0">
+                    <Phone className="w-5 h-5 text-white" />
+                  </div>
+                  <div>
+                    <h3 className="font-semibold text-black">联系电话</h3>
+                    <p className="text-gray-600">{COMPANY_INFO.phone}</p>
+                  </div>
+                </div>
+                <div className="flex items-start gap-4">
+                  <div className="w-10 h-10 bg-black rounded-lg flex items-center justify-center flex-shrink-0">
+                    <Mail className="w-5 h-5 text-white" />
+                  </div>
+                  <div>
+                    <h3 className="font-semibold text-black">电子邮箱</h3>
+                    <p className="text-gray-600">{COMPANY_INFO.email}</p>
+                  </div>
+                </div>
+              </CardContent>
+            </Card>
+
+            <Card>
+              <CardHeader>
+                <CardTitle>工作时间</CardTitle>
+              </CardHeader>
+              <CardContent>
+                <div className="space-y-2">
+                  <div className="flex justify-between">
+                    <span className="text-gray-600">周一至周五</span>
+                    <span className="text-black font-medium">9:00 - 18:00</span>
+                  </div>
+                  <div className="flex justify-between">
+                    <span className="text-gray-600">周六</span>
+                    <span className="text-black font-medium">9:00 - 12:00</span>
+                  </div>
+                  <div className="flex justify-between">
+                    <span className="text-gray-600">周日</span>
+                    <span className="text-gray-400">休息</span>
+                  </div>
+                </div>
+              </CardContent>
+            </Card>
+          </div>
+
+          {/* Contact Form */}
+          <Card>
+            <CardHeader>
+              <CardTitle>发送消息</CardTitle>
+            </CardHeader>
+            <CardContent>
+              {isSubmitted ? (
+                <div className="text-center py-12">
+                  <div className="w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-4">
+                    <Send className="w-8 h-8 text-green-600" />
+                  </div>
+                  <h3 className="text-xl font-semibold text-black mb-2">消息已发送</h3>
+                  <p className="text-gray-600">感谢您的留言，我们会尽快与您联系！</p>
+                </div>
+              ) : (
+                <form action={handleSubmit} className="space-y-6">
+                  <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
+                    <div>
+                      <label htmlFor="name" className="block text-sm font-medium text-gray-700 mb-2">
+                        姓名 *
+                      </label>
+                      <Input
+                        id="name"
+                        name="name"
+                        placeholder="请输入您的姓名"
+                        required
+                      />
+                    </div>
+                    <div>
+                      <label htmlFor="phone" className="block text-sm font-medium text-gray-700 mb-2">
+                        电话
+                      </label>
+                      <Input
+                        id="phone"
+                        name="phone"
+                        type="tel"
+                        placeholder="请输入您的电话"
+                      />
+                    </div>
+                  </div>
+                  <div>
+                    <label htmlFor="email" className="block text-sm font-medium text-gray-700 mb-2">
+                      邮箱 *
+                    </label>
+                    <Input
+                      id="email"
+                      name="email"
+                      type="email"
+                      placeholder="请输入您的邮箱"
+                      required
+                    />
+                  </div>
+                  <div>
+                    <label htmlFor="subject" className="block text-sm font-medium text-gray-700 mb-2">
+                      主题 *
+                    </label>
+                    <Input
+                      id="subject"
+                      name="subject"
+                      placeholder="请输入消息主题"
+                      required
+                    />
+                  </div>
+                  <div>
+                    <label htmlFor="message" className="block text-sm font-medium text-gray-700 mb-2">
+                      消息内容 *
+                    </label>
+                    <Textarea
+                      id="message"
+                      name="message"
+                      placeholder="请输入您想要咨询的内容"
+                      rows={5}
+                      required
+                    />
+                  </div>
+                  <Button type="submit" className="w-full" disabled={isSubmitting}>
+                    {isSubmitting ? (
+                      <>
+                        <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+                        发送中...
+                      </>
+                    ) : (
+                      <>
+                        <Send className="mr-2 h-4 w-4" />
+                        发送消息
+                      </>
+                    )}
+                  </Button>
+                </form>
+              )}
+            </CardContent>
+          </Card>
+        </div>
+      </div>
+    </div>
+  );
+}

src/app/(marketing)/layout.tsx

@@ -0,0 +1,16 @@
+import { Header } from '@/components/layout/header';
+import { Footer } from '@/components/layout/footer';
+
+export default function MarketingLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <div className="min-h-screen flex flex-col">
+      <Header />
+      <main className="flex-1">{children}</main>
+      <Footer />
+    </div>
+  );
+}

src/app/(marketing)/news/[slug]/page.tsx

@@ -0,0 +1,109 @@
+import { notFound } from 'next/navigation';
+import { COMPANY_INFO, NEWS } from '@/lib/constants';
+import { Badge } from '@/components/ui/badge';
+import { Card, CardContent } from '@/components/ui/card';
+import { Calendar, ArrowLeft } from 'lucide-react';
+import Link from 'next/link';
+import { Button } from '@/components/ui/button';
+
+interface NewsDetailPageProps {
+  params: Promise<{
+    slug: string;
+  }>;
+}
+
+// 定义新闻项类型
+type NewsItem = {
+  id: string;
+  title: string;
+  excerpt: string;
+  date: string;
+  category: string;
+  image: string;
+  content?: string;
+};
+
+export function generateStaticParams() {
+  return NEWS.map((news) => ({
+    slug: news.id,
+  }));
+}
+
+export async function generateMetadata({ params }: NewsDetailPageProps) {
+  const { slug } = await params;
+  const news = (NEWS as unknown as NewsItem[]).find((n) => n.id === slug);
+  
+  if (!news) {
+    return {
+      title: `新闻未找到 - ${COMPANY_INFO.name}`,
+    };
+  }
+  
+  return {
+    title: `${news.title} - ${COMPANY_INFO.name}`,
+    description: news.excerpt,
+  };
+}
+
+export default async function NewsDetailPage({ params }: NewsDetailPageProps) {
+  const { slug } = await params;
+  const news = (NEWS as unknown as NewsItem[]).find((n) => n.id === slug);
+  
+  if (!news) {
+    notFound();
+  }
+
+  return (
+    <div className="pt-32 pb-20">
+      <div className="container-custom">
+        <div className="max-w-4xl mx-auto">
+          <Button variant="ghost" asChild className="mb-8">
+            <Link href="/news">
+              <ArrowLeft className="mr-2 w-4 h-4" />
+              返回新闻列表
+            </Link>
+          </Button>
+
+          <article>
+            <div className="flex items-center gap-3 mb-6">
+              <Badge>{news.category}</Badge>
+              <span className="text-sm text-gray-500 flex items-center gap-1">
+                <Calendar className="w-4 h-4" />
+                {news.date}
+              </span>
+            </div>
+
+            <h1 className="text-3xl sm:text-4xl font-bold text-black mb-8">
+              {news.title}
+            </h1>
+
+            <Card>
+              <CardContent className="p-8">
+                <div className="prose prose-lg max-w-none">
+                  {news.content ? (
+                    news.content.split('\n\n').map((paragraph, idx) => (
+                      <p key={idx} className="text-gray-600 leading-relaxed mb-6">
+                        {paragraph}
+                      </p>
+                    ))
+                  ) : (
+                    <>
+                      <p className="text-gray-600 leading-relaxed">
+                        {news.excerpt}
+                      </p>
+                      <p className="text-gray-600 leading-relaxed mt-6">
+                        四川睿新致远科技有限公司始终致力于为客户提供最优质的技术服务和解决方案，
+                        不断创新，追求卓越。我们相信，通过技术的力量，可以帮助更多企业实现数字化转型，
+                        提升竞争力。
+                      </p>
+                    </>
+                  )}
+                </div>
+              </CardContent>
+            </Card>
+          </article>
+        </div>
+      </div>
+    </div>
+  );
+}

src/app/(marketing)/news/page.tsx

@@ -0,0 +1,59 @@
+import Link from 'next/link';
+import { COMPANY_INFO, NEWS } from '@/lib/constants';
+import { Badge } from '@/components/ui/badge';
+import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '@/components/ui/card';
+import { ArrowRight, Calendar } from 'lucide-react';
+
+export const metadata = {
+  title: `新闻动态 - ${COMPANY_INFO.name}`,
+  description: `了解${COMPANY_INFO.name}的最新动态和行业资讯`,
+};
+
+export default function NewsPage() {
+  return (
+    <div className="pt-32 pb-20">
+      <div className="container-custom">
+        <div className="text-center max-w-3xl mx-auto mb-16">
+          <Badge variant="outline" className="mb-4">
+            新闻动态
+          </Badge>
+          <h1 className="text-4xl sm:text-5xl font-bold text-black mb-6">
+            最新资讯
+          </h1>
+          <p className="text-lg text-gray-600">
+            了解公司最新动态、行业资讯和技术分享
+          </p>
+        </div>
+
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
+          {NEWS.map((news) => (
+            <Card key={news.id} className="h-full flex flex-col">
+              <CardHeader>
+                <div className="flex items-center gap-2 mb-3">
+                  <Badge variant="secondary">{news.category}</Badge>
+                  <span className="text-sm text-gray-500 flex items-center gap-1">
+                    <Calendar className="w-3 h-3" />
+                    {news.date}
+                  </span>
+                </div>
+                <CardTitle className="text-xl leading-tight">{news.title}</CardTitle>
+              </CardHeader>
+              <CardContent className="flex-1 flex flex-col">
+                <CardDescription className="text-base leading-relaxed mb-6 flex-1">
+                  {news.excerpt}
+                </CardDescription>
+                <Link
+                  href={`/news/${news.id}`}
+                  className="inline-flex items-center text-sm font-medium text-black hover:underline"
+                >
+                  阅读更多
+                  <ArrowRight className="ml-1 w-4 h-4" />
+                </Link>
+              </CardContent>
+            </Card>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+}

src/app/(marketing)/page.tsx

@@ -0,0 +1,25 @@
+import { HeroSection } from '@/components/sections/hero-section';
+import { AboutSection } from '@/components/sections/about-section';
+import { ServicesSection } from '@/components/sections/services-section';
+import { ProductsSection } from '@/components/sections/products-section';
+import { NewsSection } from '@/components/sections/news-section';
+import { ContactSection } from '@/components/sections/contact-section';
+import { COMPANY_INFO } from '@/lib/constants';
+
+export const metadata = {
+  title: `${COMPANY_INFO.name} - 专业科技服务提供商`,
+  description: COMPANY_INFO.description,
+};
+
+export default function HomePage() {
+  return (
+    <>
+      <HeroSection />
+      <AboutSection />
+      <ServicesSection />
+      <ProductsSection />
+      <NewsSection />
+      <ContactSection />
+    </>
+  );
+}

src/app/(marketing)/products/page.tsx

@@ -0,0 +1,101 @@
+import { COMPANY_INFO, PRODUCTS } from '@/lib/constants';
+import { Badge } from '@/components/ui/badge';
+import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '@/components/ui/card';
+import { Button } from '@/components/ui/button';
+import { ArrowRight, Check, TrendingUp } from 'lucide-react';
+
+export const metadata = {
+  title: `产品服务 - ${COMPANY_INFO.name}`,
+  description: `了解${COMPANY_INFO.name}的产品和服务解决方案，包括ERP、CRM、OA、BI、物联网和AI智能应用`,
+};
+
+export default function ProductsPage() {
+  return (
+    <div className="pt-32 pb-20">
+      <div className="container-custom">
+        <div className="text-center max-w-3xl mx-auto mb-16">
+          <Badge variant="outline" className="mb-4">
+            产品服务
+          </Badge>
+          <h1 className="text-4xl sm:text-5xl font-bold text-black mb-6">
+            我们的产品
+          </h1>
+          <p className="text-lg text-gray-600">
+            自主研发的企业级产品，助力企业高效运营，实现数字化转型
+          </p>
+        </div>
+
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+          {PRODUCTS.map((product) => (
+            <Card key={product.id} className="h-full flex flex-col group hover:shadow-lg transition-shadow">
+              <CardHeader>
+                <Badge variant="secondary" className="w-fit mb-3">
+                  {product.category}
+                </Badge>
+                <CardTitle className="text-xl">{product.title}</CardTitle>
+              </CardHeader>
+              <CardContent className="flex-1 flex flex-col">
+                <CardDescription className="text-base leading-relaxed mb-4 flex-1">
+                  {product.description}
+                </CardDescription>
+                
+                {/* 核心功能 */}
+                <div className="mb-4">
+                  <p className="text-sm font-medium text-black mb-2">核心功能</p>
+                  <div className="flex flex-wrap gap-1.5">
+                    {product.features.slice(0, 4).map((feature, idx) => (
+                      <span 
+                        key={idx} 
+                        className="inline-flex items-center text-xs px-2 py-1 bg-gray-100 text-gray-700 rounded"
+                      >
+                        <Check className="w-3 h-3 mr-1 text-green-600" />
+                        {feature}
+                      </span>
+                    ))}
+                  </div>
+                </div>
+
+                {/* 核心价值 */}
+                <div className="mb-4">
+                  <p className="text-sm font-medium text-black mb-2 flex items-center">
+                    <TrendingUp className="w-4 h-4 mr-1 text-blue-600" />
+                    核心价值
+                  </p>
+                  <ul className="space-y-1">
+                    {product.benefits.map((benefit, idx) => (
+                      <li key={idx} className="text-xs text-gray-600 flex items-start">
+                        <span className="text-blue-600 mr-1.5">•</span>
+                        {benefit}
+                      </li>
+                    ))}
+                  </ul>
+                </div>
+
+                <Button variant="outline" className="w-full mt-auto group-hover:bg-black group-hover:text-white transition-colors">
+                  了解详情
+                  <ArrowRight className="ml-2 w-4 h-4" />
+                </Button>
+              </CardContent>
+            </Card>
+          ))}
+        </div>
+
+        {/* 底部CTA */}
+        <div className="mt-20 text-center">
+          <div className="bg-gradient-to-r from-gray-50 to-gray-100 rounded-2xl p-12">
+            <h2 className="text-2xl sm:text-3xl font-bold text-black mb-4">
+              需要定制化解决方案？
+            </h2>
+            <p className="text-gray-600 mb-8 max-w-2xl mx-auto">
+              我们的专业团队可以根据您的业务需求，提供量身定制的产品开发和系统集成服务
+            </p>
+            <Button size="lg" className="bg-black text-white hover:bg-gray-800">
+              联系我们
+              <ArrowRight className="ml-2 w-4 h-4" />
+            </Button>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

src/app/(marketing)/services/page.tsx

@@ -0,0 +1,57 @@
+import { COMPANY_INFO, SERVICES } from '@/lib/constants';
+import { Badge } from '@/components/ui/badge';
+import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '@/components/ui/card';
+import { Code, Cloud, BarChart3, Shield } from 'lucide-react';
+
+const iconMap: Record<string, React.ComponentType<{ className?: string }>> = {
+  Code,
+  Cloud,
+  BarChart3,
+  Shield,
+};
+
+export const metadata = {
+  title: `核心业务 - ${COMPANY_INFO.name}`,
+  description: `了解${COMPANY_INFO.name}的核心业务领域和专业服务`,
+};
+
+export default function ServicesPage() {
+  return (
+    <div className="pt-32 pb-20">
+      <div className="container-custom">
+        <div className="text-center max-w-3xl mx-auto mb-16">
+          <Badge variant="outline" className="mb-4">
+            核心业务
+          </Badge>
+          <h1 className="text-4xl sm:text-5xl font-bold text-black mb-6">
+            我们的服务
+          </h1>
+          <p className="text-lg text-gray-600">
+            提供全方位的技术解决方案，助力企业数字化转型
+          </p>
+        </div>
+
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
+          {SERVICES.map((service) => {
+            const Icon = iconMap[service.icon];
+            return (
+              <Card key={service.id} className="h-full">
+                <CardHeader>
+                  <div className="w-14 h-14 bg-black rounded-xl flex items-center justify-center mb-4">
+                    {Icon && <Icon className="w-7 h-7 text-white" />}
+                  </div>
+                  <CardTitle className="text-2xl">{service.title}</CardTitle>
+                </CardHeader>
+                <CardContent>
+                  <CardDescription className="text-base leading-relaxed">
+                    {service.description}
+                  </CardDescription>
+                </CardContent>
+              </Card>
+            );
+          })}
+        </div>
+      </div>
+    </div>
+  );
+}

src/app/globals.css

@@ -1,26 +1,131 @@
 @import "tailwindcss";
+@import "tw-animate-css";
 
-:root {
-  --background: #ffffff;
-  --foreground: #171717;
-}
+@custom-variant dark (&:is(.dark *));
 
 @theme inline {
   --color-background: var(--background);
   --color-foreground: var(--foreground);
   --font-sans: var(--font-geist-sans);
   --font-mono: var(--font-geist-mono);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar: var(--sidebar);
+  --color-chart-5: var(--chart-5);
+  --color-chart-4: var(--chart-4);
+  --color-chart-3: var(--chart-3);
+  --color-chart-2: var(--chart-2);
+  --color-chart-1: var(--chart-1);
+  --color-ring: var(--ring);
+  --color-input: var(--input);
+  --color-border: var(--border);
+  --color-destructive: var(--destructive);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-accent: var(--accent);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-muted: var(--muted);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-secondary: var(--secondary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-primary: var(--primary);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-popover: var(--popover);
+  --color-card-foreground: var(--card-foreground);
+  --color-card: var(--card);
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
 }
 
-@media (prefers-color-scheme: dark) {
-  :root {
-    --background: #0a0a0a;
-    --foreground: #ededed;
+:root {
+  --radius: 0.625rem;
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.145 0 0);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.145 0 0);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.145 0 0);
+  --primary: oklch(0.145 0 0);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.97 0 0);
+  --secondary-foreground: oklch(0.145 0 0);
+  --muted: oklch(0.97 0 0);
+  --muted-foreground: oklch(0.556 0 0);
+  --accent: oklch(0.97 0 0);
+  --accent-foreground: oklch(0.145 0 0);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.922 0 0);
+  --input: oklch(0.922 0 0);
+  --ring: oklch(0.708 0 0);
+  --chart-1: oklch(0.646 0.222 41.116);
+  --chart-2: oklch(0.6 0.118 184.704);
+  --chart-3: oklch(0.398 0.07 227.392);
+  --chart-4: oklch(0.828 0.189 84.429);
+  --chart-5: oklch(0.769 0.188 70.08);
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: oklch(0.205 0 0);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.97 0 0);
+  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
+}
+
+.dark {
+  --background: oklch(0.145 0 0);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.205 0 0);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.205 0 0);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.922 0 0);
+  --primary-foreground: oklch(0.205 0 0);
+  --secondary: oklch(0.269 0 0);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.269 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.556 0 0);
+  --chart-1: oklch(0.488 0.243 264.376);
+  --chart-2: oklch(0.696 0.17 162.48);
+  --chart-3: oklch(0.769 0.188 70.08);
+  --chart-4: oklch(0.627 0.265 303.9);
+  --chart-5: oklch(0.645 0.246 16.439);
+  --sidebar: oklch(0.205 0 0);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.269 0 0);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.556 0 0);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+  html {
+    scroll-behavior: smooth;
   }
 }
 
-body {
-  background: var(--background);
-  color: var(--foreground);
-  font-family: Arial, Helvetica, sans-serif;
+@layer utilities {
+  .container-custom {
+    @apply w-full max-w-7xl mx-auto px-4 sm:px-6 lg:px-8;
+  }
 }

src/app/layout.tsx

@@ -1,5 +1,5 @@
 import type { Metadata } from "next";
-import { Geist, Geist_Mono } from "next/font/google";
+import { Geist, Geist_Mono, Ma_Shan_Zheng, ZCOOL_XiaoWei, Noto_Serif_SC } from "next/font/google";
 import "./globals.css";
 
 const geistSans = Geist({
@@ -12,9 +12,61 @@ const geistMono = Geist_Mono({
   subsets: ["latin"],
 });
 
+// 书法字体
+const maShanZheng = Ma_Shan_Zheng({
+  weight: "400",
+  variable: "--font-ma-shan-zheng",
+  subsets: ["latin"],
+});
+
+const zcoolXiaoWei = ZCOOL_XiaoWei({
+  weight: "400",
+  variable: "--font-zcool-xiaowei",
+  subsets: ["latin"],
+});
+
+// 思源宋体 - 作为青柳隶书的替代
+const notoSerifSC = Noto_Serif_SC({
+  weight: ["400", "700"],
+  variable: "--font-noto-serif-sc",
+  subsets: ["latin"],
+});
+
 export const metadata: Metadata = {
-  title: "Create Next App",
-  description: "Generated by create next app",
+  title: {
+    default: "四川睿新致远科技有限公司 - 企业数字化转型服务商",
+    template: "%s | 四川睿新致远科技有限公司",
+  },
+  description: "四川睿新致远科技有限公司成立于2026年，专注于企业数字化转型服务，提供软件开发、云计算、数据分析、信息安全等一站式解决方案。联系电话：028-88888888",
+  keywords: ["数字化转型", "企业软件", "ERP系统", "CRM系统", "云计算", "数据分析", "软件开发", "成都科技公司"],
+  authors: [{ name: "四川睿新致远科技有限公司" }],
+  creator: "四川睿新致远科技有限公司",
+  publisher: "四川睿新致远科技有限公司",
+  robots: {
+    index: true,
+    follow: true,
+  },
+  openGraph: {
+    type: "website",
+    locale: "zh_CN",
+    url: "https://www.novalon.cn",
+    siteName: "四川睿新致远科技有限公司",
+    title: "四川睿新致远科技有限公司 - 企业数字化转型服务商",
+    description: "专注于企业数字化转型服务，提供软件开发、云计算、数据分析、信息安全等一站式解决方案",
+  },
+  twitter: {
+    card: "summary_large_image",
+    title: "四川睿新致远科技有限公司",
+    description: "企业数字化转型服务商",
+  },
+  verification: {
+    // 可以添加搜索引擎验证代码
+    // google: "your-google-verification-code",
+    // baidu: "your-baidu-verification-code",
+  },
+  alternates: {
+    canonical: "https://www.novalon.cn",
+  },
 };
 
 export default function RootLayout({
@@ -23,9 +75,21 @@ export default function RootLayout({
   children: React.ReactNode;
 }>) {
   return (
-    <html lang="en">
+    <html lang="zh-CN">
+      <head>
+        {/* Favicon */}
+        <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+        <link rel="apple-touch-icon" href="/favicon.svg" />
+        {/* 中文字体 - 从Google Fonts加载 */}
+        <link rel="preconnect" href="https://fonts.googleapis.com" />
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="anonymous" />
+        <link
+          href="https://fonts.googleapis.com/css2?family=Ma+Shan+Zheng&family=ZCOOL+XiaoWei&display=swap"
+          rel="stylesheet"
+        />
+      </head>
       <body
-        className={`${geistSans.variable} ${geistMono.variable} antialiased`}
+        className={`${geistSans.variable} ${geistMono.variable} ${maShanZheng.variable} ${zcoolXiaoWei.variable} ${notoSerifSC.variable} antialiased`}
       >
         {children}
       </body>

src/app/page.tsx

@@ -1,65 +0,0 @@
-import Image from "next/image";
-
-export default function Home() {
-  return (
-    <div className="flex min-h-screen items-center justify-center bg-zinc-50 font-sans dark:bg-black">
-      <main className="flex min-h-screen w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
-        <Image
-          className="dark:invert"
-          src="/next.svg"
-          alt="Next.js logo"
-          width={100}
-          height={20}
-          priority
-        />
-        <div className="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
-          <h1 className="max-w-xs text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50">
-            To get started, edit the page.tsx file.
-          </h1>
-          <p className="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400">
-            Looking for a starting point or more instructions? Head over to{" "}
-            <a
-              href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-              className="font-medium text-zinc-950 dark:text-zinc-50"
-            >
-              Templates
-            </a>{" "}
-            or the{" "}
-            <a
-              href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-              className="font-medium text-zinc-950 dark:text-zinc-50"
-            >
-              Learning
-            </a>{" "}
-            center.
-          </p>
-        </div>
-        <div className="flex flex-col gap-4 text-base font-medium sm:flex-row">
-          <a
-            className="flex h-12 w-full items-center justify-center gap-2 rounded-full bg-foreground px-5 text-background transition-colors hover:bg-[#383838] dark:hover:bg-[#ccc] md:w-[158px]"
-            href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <Image
-              className="dark:invert"
-              src="/vercel.svg"
-              alt="Vercel logomark"
-              width={16}
-              height={16}
-            />
-            Deploy Now
-          </a>
-          <a
-            className="flex h-12 w-full items-center justify-center rounded-full border border-solid border-black/[.08] px-5 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-[158px]"
-            href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            Documentation
-          </a>
-        </div>
-      </main>
-    </div>
-  );
-}