Spaces:

Botopia
/

caigong

Running

App Files Files Community

donk commited on Jul 15, 2025

Commit

64a1f64

verified ·

1 Parent(s): 640560e

帮我制作一个AI的网站 - Follow Up Deployment

Browse files

Files changed (1) hide show

index.html +631 -18

index.html CHANGED Viewed

@@ -1,20 +1,633 @@
 <!DOCTYPE html>
-<html>
-  <head>
-    <title>My app</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta charset="utf-8">
     <script src="https://cdn.tailwindcss.com"></script>
-  </head>
-  <body class="flex justify-center items-center h-screen overflow-hidden bg-white font-sans text-center px-6">
-    <div class="w-full">
-      <span class="text-xs rounded-full mb-2 inline-block px-2 py-1 border border-amber-500/15 bg-amber-500/15 text-amber-500">🔥 New version dropped!</span>
-      <h1 class="text-4xl lg:text-6xl font-bold font-sans">
-        <span class="text-2xl lg:text-4xl text-gray-400 block font-medium">I'm ready to work,</span>
-        Ask me anything.
-      </h1>
-    </div>
-      <img src="https://enzostvs-deepsite.hf.space/arrow.svg" class="absolute bottom-8 left-0 w-[100px] transform rotate-[30deg]" />
-    <script></script>
-  <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=donk245/caigong" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
-</html>

 <!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>未来智能 - AI创新平台</title>
     <script src="https://cdn.tailwindcss.com"></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        @keyframes float {
+            0%, 100% { transform: translateY(0); }
+            50% { transform: translateY(-20px); }
+        }
+        .floating {
+            animation: float 6s ease-in-out infinite;
+        }
+        .gradient-text {
+            background: linear-gradient(90deg, #3b82f6, #8b5cf6, #ec4899);
+            -webkit-background-clip: text;
+            background-clip: text;
+            color: transparent;
+        }
+        .card-hover:hover {
+            transform: translateY(-10px);
+            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
+        }
+        .typewriter {
+            overflow: hidden;
+            border-right: .15em solid #3b82f6;
+            white-space: nowrap;
+            margin: 0 auto;
+            letter-spacing: .15em;
+            animation: typing 3.5s steps(40, end), blink-caret .75s step-end infinite;
+        }
+        @keyframes typing {
+            from { width: 0 }
+            to { width: 100% }
+        }
+        @keyframes blink-caret {
+            from, to { border-color: transparent }
+            50% { border-color: #3b82f6; }
+        }
+    </style>
+</head>
+<body class="bg-gray-50 font-sans">
+    <!-- 导航栏 -->
+    <nav class="bg-white shadow-lg sticky top-0 z-50">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="flex justify-between h-16">
+                <div class="flex items-center">
+                    <div class="flex-shrink-0 flex items-center">
+                        <i class="fas fa-robot text-3xl text-indigo-600 mr-2"></i>
+                        <span class="text-xl font-bold text-gray-900">未来<span class="gradient-text">智能</span></span>
+                    </div>
+                </div>
+                <div class="hidden md:flex items-center space-x-8">
+                    <a href="#home" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium">首页</a>
+                    <a href="#features" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium">功能</a>
+                    <a href="#solutions" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium">解决方案</a>
+                    <a href="#pricing" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium">定价</a>
+                    <a href="#contact" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium">联系我们</a>
+                </div>
+                <div class="flex items-center">
+                    <button class="bg-indigo-600 hover:bg-indigo-700 text-white px-4 py-2 rounded-md text-sm font-medium transition duration-300">
+                        免费试用
+                    </button>
+                    <button class="md:hidden ml-4 inline-flex items-center justify-center p-2 rounded-md text-gray-700 hover:text-indigo-600 hover:bg-gray-100 focus:outline-none">
+                        <i class="fas fa-bars"></i>
+                    </button>
+                </div>
+            </div>
+        </div>
+    </nav>
+    <!-- 英雄区域 -->
+    <section id="home" class="relative overflow-hidden">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20 md:py-32">
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-12 items-center">
+                <div>
+                    <h1 class="text-4xl md:text-5xl lg:text-6xl font-bold text-gray-900 leading-tight mb-6">
+                        用<span class="gradient-text">人工智能</span><br>改变您的业务
+                    </h1>
+                    <p class="text-lg text-gray-600 mb-8">
+                        我们提供最先进的AI解决方案，帮助企业自动化流程、提升效率并创造新的商业机会。
+                    </p>
+                    <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
+                        <button class="bg-indigo-600 hover:bg-indigo-700 text-white px-6 py-3 rounded-md text-lg font-medium transition duration-300 transform hover:scale-105">
+                            开始免费试用
+                        </button>
+                        <button class="border border-indigo-600 text-indigo-600 hover:bg-indigo-50 px-6 py-3 rounded-md text-lg font-medium transition duration-300 transform hover:scale-105">
+                            观看演示 <i class="fas fa-play-circle ml-2"></i>
+                        </button>
+                    </div>
+                </div>
+                <div class="relative">
+                    <div class="floating">
+                        <img src="https://images.unsplash.com/photo-1620712943543-bcc4688e7485?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80" alt="AI Technology" class="rounded-xl shadow-2xl border-8 border-white transform rotate-3">
+                    </div>
+                    <div class="absolute -bottom-8 -left-8 bg-indigo-100 rounded-xl w-32 h-32 -z-10"></div>
+                    <div class="absolute -top-8 -right-8 bg-pink-100 rounded-xl w-32 h-32 -z-10"></div>
+                </div>
+            </div>
+        </div>
+        <div class="absolute top-0 right-0 w-1/2 h-full bg-gradient-to-r from-indigo-50 to-transparent -z-10"></div>
+    </section>
+    <!-- 合作伙伴 -->
+    <section class="bg-gray-100 py-12">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <p class="text-center text-gray-500 mb-8">信任我们的全球领先企业</p>
+            <div class="grid grid-cols-2 md:grid-cols-5 gap-8 items-center justify-center">
+                <div class="flex justify-center">
+                    <i class="fab fa-google text-4xl text-gray-700 opacity-70 hover:opacity-100 transition duration-300"></i>
+                </div>
+                <div class="flex justify-center">
+                    <i class="fab fa-microsoft text-4xl text-gray-700 opacity-70 hover:opacity-100 transition duration-300"></i>
+                </div>
+                <div class="flex justify-center">
+                    <i class="fab fa-amazon text-4xl text-gray-700 opacity-70 hover:opacity-100 transition duration-300"></i>
+                </div>
+                <div class="flex justify-center">
+                    <i class="fab fa-apple text-4xl text-gray-700 opacity-70 hover:opacity-100 transition duration-300"></i>
+                </div>
+                <div class="flex justify-center">
+                    <i class="fab fa-spotify text-4xl text-gray-700 opacity-70 hover:opacity-100 transition duration-300"></i>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- 功能特性 -->
+    <section id="features" class="py-20 bg-white">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-16">
+                <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">强大的<span class="gradient-text">AI功能</span></h2>
+                <p class="text-lg text-gray-600 max-w-3xl mx-auto">
+                    我们的平台集成了多种先进的AI技术，为您提供全方位的智能解决方案
+                </p>
+            </div>
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+                <!-- 功能卡片1 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-500 card-hover">
+                    <div class="p-6">
+                        <div class="flex items-center mb-4">
+                            <div class="bg-indigo-100 p-3 rounded-full mr-4">
+                                <i class="fas fa-brain text-indigo-600 text-xl"></i>
+                            </div>
+                            <h3 class="text-xl font-bold text-gray-900">机器学习</h3>
+                        </div>
+                        <p class="text-gray-600 mb-4">
+                            利用先进的机器学习算法，从您的数据中提取有价值的见解，预测未来趋势并自动优化业务流程。
+                        </p>
+                        <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium inline-flex items-center">
+                            了解更多 <i class="fas fa-arrow-right ml-2"></i>
+                        </a>
+                    </div>
+                </div>
+                <!-- 功能卡片2 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-500 card-hover">
+                    <div class="p-6">
+                        <div class="flex items-center mb-4">
+                            <div class="bg-pink-100 p-3 rounded-full mr-4">
+                                <i class="fas fa-comments text-pink-600 text-xl"></i>
+                            </div>
+                            <h3 class="text-xl font-bold text-gray-900">自然语言处理</h3>
+                        </div>
+                        <p class="text-gray-600 mb-4">
+                            我们的NLP技术可以理解、解释和生成人类语言，实现智能客服、文档分析和多语言翻译等功能。
+                        </p>
+                        <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium inline-flex items-center">
+                            了解更多 <i class="fas fa-arrow-right ml-2"></i>
+                        </a>
+                    </div>
+                </div>
+                <!-- 功能卡片3 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-500 card-hover">
+                    <div class="p-6">
+                        <div class="flex items-center mb-4">
+                            <div class="bg-blue-100 p-3 rounded-full mr-4">
+                                <i class="fas fa-eye text-blue-600 text-xl"></i>
+                            </div>
+                            <h3 class="text-xl font-bold text-gray-900">计算机视觉</h3>
+                        </div>
+                        <p class="text-gray-600 mb-4">
+                            通过图像和视频分析技术，实现人脸识别、物体检测、场景理解等视觉智能应用。
+                        </p>
+                        <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium inline-flex items-center">
+                            了解更多 <i class="fas fa-arrow-right ml-2"></i>
+                        </a>
+                    </div>
+                </div>
+                <!-- 功能卡片4 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-500 card-hover">
+                    <div class="p-6">
+                        <div class="flex items-center mb-4">
+                            <div class="bg-purple-100 p-3 rounded-full mr-4">
+                                <i class="fas fa-chart-line text-purple-600 text-xl"></i>
+                            </div>
+                            <h3 class="text-xl font-bold text-gray-900">预测分析</h3>
+                        </div>
+                        <p class="text-gray-600 mb-4">
+                            基于历史数据和实时信息，预测未来市场趋势、客户行为和业务风险，帮助您做出更明智的决策。
+                        </p>
+                        <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium inline-flex items-center">
+                            了解更多 <i class="fas fa-arrow-right ml-2"></i>
+                        </a>
+                    </div>
+                </div>
+                <!-- 功能卡片5 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-500 card-hover">
+                    <div class="p-6">
+                        <div class="flex items-center mb-4">
+                            <div class="bg-green-100 p-3 rounded-full mr-4">
+                                <i class="fas fa-robot text-green-600 text-xl"></i>
+                            </div>
+                            <h3 class="text-xl font-bold text-gray-900">自动化流程</h3>
+                        </div>
+                        <p class="text-gray-600 mb-4">
+                            自动化重复性任务和工作流程，提高效率，减少人为错误，让您的团队专注于更有价值的工作。
+                        </p>
+                        <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium inline-flex items-center">
+                            了解更多 <i class="fas fa-arrow-right ml-2"></i>
+                        </a>
+                    </div>
+                </div>
+                <!-- 功能卡片6 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-500 card-hover">
+                    <div class="p-6">
+                        <div class="flex items-center mb-4">
+                            <div class="bg-yellow-100 p-3 rounded-full mr-4">
+                                <i class="fas fa-shield-alt text-yellow-600 text-xl"></i>
+                            </div>
+                            <h3 class="text-xl font-bold text-gray-900">安全合规</h3>
+                        </div>
+                        <p class="text-gray-600 mb-4">
+                            我们的AI系统符合最高安全标准，确保数据隐私和合规性，让您安心使用。
+                        </p>
+                        <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium inline-flex items-center">
+                            了解更多 <i class="fas fa-arrow-right ml-2"></i>
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- 解决方案 -->
+    <section id="solutions" class="py-20 bg-gray-50">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-16">
+                <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">行业<span class="gradient-text">解决方案</span></h2>
+                <p class="text-lg text-gray-600 max-w-3xl mx-auto">
+                    我们为不同行业提供定制化的AI解决方案，满足您的特定需求
+                </p>
+            </div>
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
+                <!-- 解决方案1 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-500 card-hover">
+                    <img src="https://images.unsplash.com/photo-1579621970563-ebec7560ff3e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80" alt="金融科技" class="w-full h-48 object-cover">
+                    <div class="p-6">
+                        <h3 class="text-xl font-bold text-gray-900 mb-3">金融科技</h3>
+                        <p class="text-gray-600 mb-4">
+                            利用AI进行风险评估、欺诈检测、信用评分和算法交易，提高金融服务的效率和安全性。
+                        </p>
+                        <div class="flex flex-wrap gap-2 mb-4">
+                            <span class="bg-indigo-100 text-indigo-800 text-xs font-medium px-2.5 py-0.5 rounded">欺诈检测</span>
+                            <span class="bg-indigo-100 text-indigo-800 text-xs font-medium px-2.5 py-0.5 rounded">算法交易</span>
+                            <span class="bg-indigo-100 text-indigo-800 text-xs font-medium px-2.5 py-0.5 rounded">信用评分</span>
+                        </div>
+                        <button class="text-indigo-600 hover:text-indigo-800 font-medium inline-flex items-center">
+                            查看案例 <i class="fas fa-external-link-alt ml-2"></i>
+                        </button>
+                    </div>
+                </div>
+                <!-- 解决方案2 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-500 card-hover">
+                    <img src="https://images.unsplash.com/photo-1576091160550-2173dba999ef?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80" alt="医疗健康" class="w-full h-48 object-cover">
+                    <div class="p-6">
+                        <h3 class="text-xl font-bold text-gray-900 mb-3">医疗健康</h3>
+                        <p class="text-gray-600 mb-4">
+                            AI辅助诊断、药物研发、个性化治疗和医疗影像分析，提高医疗服务的准确性和可及性。
+                        </p>
+                        <div class="flex flex-wrap gap-2 mb-4">
+                            <span class="bg-pink-100 text-pink-800 text-xs font-medium px-2.5 py-0.5 rounded">医学影像</span>
+                            <span class="bg-pink-100 text-pink-800 text-xs font-medium px-2.5 py-0.5 rounded">药物研发</span>
+                            <span class="bg-pink-100 text-pink-800 text-xs font-medium px-2.5 py-0.5 rounded">个性化治疗</span>
+                        </div>
+                        <button class="text-indigo-600 hover:text-indigo-800 font-medium inline-flex items-center">
+                            查看案例 <i class="fas fa-external-link-alt ml-2"></i>
+                        </button>
+                    </div>
+                </div>
+                <!-- 解决方案3 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-500 card-hover">
+                    <img src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80" alt="零售电商" class="w-full h-48 object-cover">
+                    <div class="p-6">
+                        <h3 class="text-xl font-bold text-gray-900 mb-3">零售电商</h3>
+                        <p class="text-gray-600 mb-4">
+                            个性化推荐、需求预测、库存优化和智能客服，提升客户体验和运营效率。
+                        </p>
+                        <div class="flex flex-wrap gap-2 mb-4">
+                            <span class="bg-blue-100 text-blue-800 text-xs font-medium px-2.5 py-0.5 rounded">个性化推荐</span>
+                            <span class="bg-blue-100 text-blue-800 text-xs font-medium px-2.5 py-0.5 rounded">需求预测</span>
+                            <span class="bg-blue-100 text-blue-800 text-xs font-medium px-2.5 py-0.5 rounded">智能客服</span>
+                        </div>
+                        <button class="text-indigo-600 hover:text-indigo-800 font-medium inline-flex items-center">
+                            查看案例 <i class="fas fa-external-link-alt ml-2"></i>
+                        </button>
+                    </div>
+                </div>
+                <!-- 解决方案4 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-500 card-hover">
+                    <img src="https://images.unsplash.com/photo-1485827404703-89b55fcc595e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80" alt="智能制造" class="w-full h-48 object-cover">
+                    <div class="p-6">
+                        <h3 class="text-xl font-bold text-gray-900 mb-3">智能制造</h3>
+                        <p class="text-gray-600 mb-4">
+                            预测性维护、质量控制、供应链优化和生产流程自动化，提高制造效率和产品质量。
+                        </p>
+                        <div class="flex flex-wrap gap-2 mb-4">
+                            <span class="bg-purple-100 text-purple-800 text-xs font-medium px-2.5 py-0.5 rounded">预测性维护</span>
+                            <span class="bg-purple-100 text-purple-800 text-xs font-medium px-2.5 py-0.5 rounded">质量控制</span>
+                            <span class="bg-purple-100 text-purple-800 text-xs font-medium px-2.5 py-0.5 rounded">供应链优化</span>
+                        </div>
+                        <button class="text-indigo-600 hover:text-indigo-800 font-medium inline-flex items-center">
+                            查看案例 <i class="fas fa-external-link-alt ml-2"></i>
+                        </button>
+                    </div>
+                </div>
+            </div>
+            <div class="text-center mt-12">
+                <button class="border border-indigo-600 text-indigo-600 hover:bg-indigo-50 px-6 py-3 rounded-md text-lg font-medium transition duration-300">
+                    查看更多行业解决方案 <i class="fas fa-chevron-down ml-2"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+    <!-- 统计数据 -->
+    <section class="py-16 bg-indigo-600 text-white">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="grid grid-cols-2 md:grid-cols-4 gap-8 text-center">
+                <div>
+                    <div class="text-4xl md:text-5xl font-bold mb-2">500+</div>
+                    <div class="text-lg opacity-90">企业客户</div>
+                </div>
+                <div>
+                    <div class="text-4xl md:text-5xl font-bold mb-2">95%</div>
+                    <div class="text-lg opacity-90">客户满意度</div>
+                </div>
+                <div>
+                    <div class="text-4xl md:text-5xl font-bold mb-2">24/7</div>
+                    <div class="text-lg opacity-90">技术支持</div>
+                </div>
+                <div>
+                    <div class="text-4xl md:text-5xl font-bold mb-2">3x</div>
+                    <div class="text-lg opacity-90">平均效率提升</div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- 定价 -->
+    <section id="pricing" class="py-20 bg-white">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-16">
+                <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">简单透明的<span class="gradient-text">定价</span></h2>
+                <p class="text-lg text-gray-600 max-w-3xl mx-auto">
+                    选择适合您业务需求的定价方案，无需隐藏费用
+                </p>
+            </div>
+            <div class="flex justify-center mb-8">
+                <div class="inline-flex rounded-md shadow-sm" role="group">
+                    <button type="button" class="px-6 py-3 text-sm font-medium text-white bg-indigo-600 rounded-l-lg">
+                        月度
+                    </button>
+                    <button type="button" class="px-6 py-3 text-sm font-medium text-gray-900 bg-white hover:bg-gray-100 border-t border-b border-gray-200">
+                        年度 (节省20%)
+                    </button>
+                </div>
+            </div>
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8 max-w-5xl mx-auto">
+                <!-- 基础版 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden border border-gray-200 transition duration-500 card-hover">
+                    <div class="p-6 border-b border-gray-200">
+                        <h3 class="text-xl font-bold text-gray-900 mb-1">基础版</h3>
+                        <p class="text-gray-600 mb-4">适合小型企业和初创公司</p>
+                        <div class="flex items-baseline mb-4">
+                            <span class="text-4xl font-bold text-gray-900">¥999</span>
+                            <span class="text-gray-500 ml-1">/月</span>
+                        </div>
+                        <button class="w-full bg-gray-100 hover:bg-gray-200 text-gray-800 font-medium py-2 px-4 rounded-md transition duration-300">
+                            开始使用
+                        </button>
+                    </div>
+                    <div class="p-6">
+                        <ul class="space-y-3">
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>每月10,000次API调用</span>
+                            </li>
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>基础机器学习模型</span>
+                            </li>
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>电子邮件支持</span>
+                            </li>
+                            <li class="flex items-center text-gray-400">
+                                <i class="fas fa-times text-gray-300 mr-2"></i>
+                                <span>高级分析功能</span>
+                            </li>
+                            <li class="flex items-center text-gray-400">
+                                <i class="fas fa-times text-gray-300 mr-2"></i>
+                                <span>定制模型训练</span>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+                <!-- 专业版 -->
+                <div class="bg-white rounded-xl shadow-lg overflow-hidden border-2 border-indigo-600 transform scale-105 z-10 transition duration-500 card-hover">
+                    <div class="bg-indigo-600 text-white text-center py-2">
+                        <span class="text-sm font-medium">最受欢迎</span>
+                    </div>
+                    <div class="p-6 border-b border-gray-200">
+                        <h3 class="text-xl font-bold text-gray-900 mb-1">专业版</h3>
+                        <p class="text-gray-600 mb-4">适合中型企业和成长型公司</p>
+                        <div class="flex items-baseline mb-4">
+                            <span class="text-4xl font-bold text-gray-900">¥2,999</span>
+                            <span class="text-gray-500 ml-1">/月</span>
+                        </div>
+                        <button class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-medium py-2 px-4 rounded-md transition duration-300 transform hover:scale-105">
+                            开始使用
+                        </button>
+                    </div>
+                    <div class="p-6">
+                        <ul class="space-y-3">
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>每月50,000次API调用</span>
+                            </li>
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>高级机器学习模型</span>
+                            </li>
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>优先支持</span>
+                            </li>
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>高级分析功能</span>
+                            </li>
+                            <li class="flex items-center text-gray-400">
+                                <i class="fas fa-times text-gray-300 mr-2"></i>
+                                <span>定制模型训练</span>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+                <!-- 企业版 -->
+                <div class="bg-white rounded-xl shadow-md overflow-hidden border border-gray-200 transition duration-500 card-hover">
+                    <div class="p-6 border-b border-gray-200">
+                        <h3 class="text-xl font-bold text-gray-900 mb-1">企业版</h3>
+                        <p class="text-gray-600 mb-4">适合大型企业和定制需求</p>
+                        <div class="flex items-baseline mb-4">
+                            <span class="text-4xl font-bold text-gray-900">定制</span>
+                        </div>
+                        <button class="w-full bg-gray-100 hover:bg-gray-200 text-gray-800 font-medium py-2 px-4 rounded-md transition duration-300">
+                            联系我们
+                        </button>
+                    </div>
+                    <div class="p-6">
+                        <ul class="space-y-3">
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>无限API调用</span>
+                            </li>
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>定制机器学习模型</span>
+                            </li>
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>24/7专属支持</span>
+                            </li>
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>高级分析功能</span>
+                            </li>
+                            <li class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                <span>定制模型训练</span>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- 客户评价 -->
+    <section class="py-20 bg-gray-50">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-16">
+                <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">客户<span class="gradient-text">评价</span></h2>
+                <p class="text-lg text-gray-600 max-w-3xl mx-auto">
+                    听听我们的客户是如何评价我们的AI解决方案的
+                </p>
+            </div>
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+                <!-- 评价1 -->
+                <div class="bg-white p-6 rounded-xl shadow-md">
+                    <div class="flex items-center mb-4">
+                        <img src="https://randomuser.me/api/portraits/women/43.jpg" alt="客户评价" class="w-12 h-12 rounded-full mr-4">
+                        <div>
+                            <h4 class="font-bold text-gray-900">张女士</h4>
+                            <p class="text-gray-600 text-sm">某电商平台CTO</p>
+                        </div>
+                    </div>
+                    <div class="flex mb-2">
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                    </div>
+                    <p class="text-gray-600">
+                        "使用未来智能的推荐系统后，我们的转化率提高了35%，客户满意度也显著提升。他们的技术支持团队非常专业，响应迅速。"
+                    </p>
+                </div>
+                <!-- 评价2 -->
+                <div class="bg-white p-6 rounded-xl shadow-md">
+                    <div class="flex items-center mb-4">
+                        <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="客户评价" class="w-12 h-12 rounded-full mr-4">
+                        <div>
+                            <h4 class="font-bold text-gray-900">王先生</h4>
+                            <p class="text-gray-600 text-sm">某金融机构数据总监</p>
+                        </div>
+                    </div>
+                    <div class="flex mb-2">
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                    </div>
+                    <p class="text-gray-600">
+                        "他们的欺诈检测系统帮助我们减少了60%的欺诈交易，同时降低了误报率。集成过程非常顺利，文档齐全。"
+                    </p>
+                </div>
+                <!-- 评价3 -->
+                <div class="bg-white p-6 rounded-xl shadow-md">
+                    <div class="flex items-center mb-4">
+                        <img src="https://randomuser.me/api/portraits/women/65.jpg" alt="客户评价" class="w-12 h-12 rounded-full mr-4">
+                        <div>
+                            <h4 class="font-bold text-gray-900">李女士</h4>
+                            <p class="text-gray-600 text-sm">某制造企业CIO</p>
+                        </div>
+                    </div>
+                    <div class="flex mb-2">
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star text-yellow-400"></i>
+                        <i class="fas fa-star-half-alt text-yellow-400"></i>
+                    </div>
+                    <p class="text-gray-600">
+                        "预测性维护解决方案帮助我们减少了30%的设备停机时间，每年节省了数百万元的维护成本。非常值得投资。"
+                    </p>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- CTA区域 -->
+    <section class="py-20 bg-gradient-to-r from-indigo-600 to-purple-600 text-white">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+            <h2 class="text-3xl md:text-4xl font-bold mb-6">准备好用AI改变您的业务了吗？</h2>
+            <p class="text-xl opacity-90 mb-8 max-w-3xl mx-auto">
+                立即开始免费试用，体验人工智能如何为您的业务带来变革。
+            </p>
+            <div class="flex flex-col sm:flex-row justify-center space-y-4 sm:space-y-0 sm:space-x-4">
+                <button class="bg-white text-indigo-600 hover:bg-gray-100 px-8 py-4 rounded-md text-lg font-bold transition duration-300 transform hover:scale-105">
+                    开始免费试用
+                </button>
+                <button class="border-2 border-white text-white hover:bg-white hover:bg-opacity-10 px-8 py-4 rounded-md text-lg font-bold transition duration-300 transform hover:scale-105">
+                    预约演示 <i class="fas fa-calendar-alt ml-2"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+    <!-- 联系我们 -->
+    <section id="contact" class="py-20 bg-white">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-12 items-center">
+                <div>
+                    <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-6">联系我们</h2>
+                    <p class="text-lg text-gray-600 mb-8">
+                        无论您有任何问题或需求，我们的团队都随时准备为您提供帮助。请填写右侧表单，我们会尽快与您联系。
+                    </p>
+                    <div class="space-y-6">
+                        <div class="flex items-start">
+                            <div class="bg-indigo-100 p-3 rounded-full mr-4">
+                                <i class="fas fa-map-marker-alt text-indigo-600"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-bold text-gray-900 mb-1">办公地址</h4>
+                                <p class="text-gray-600">北京市海淀区中关村南大街5号未来科技大厦18层</p>
+                            </div>
+<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=donk245/caigong" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>