Hugging Face's logo

Spaces:
ColamanAI
/
deepsite
Running

App Files Community
ColamanAI commited on
Commit
4722f1c
·
verified ·
1 Parent(s): ac945dd

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +874 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Deepsite
3
- emoji: 🌖
4
- colorFrom: indigo
5
- colorTo: indigo
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: deepsite
3
+ emoji: 🐳
4
+ colorFrom: yellow
5
+ colorTo: blue
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,874 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="zh-CN">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>智能CAD生成 | 文字转CAD的AI解决方案</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <script>
10
+ tailwind.config = {
11
+ darkMode: 'class',
12
+ theme: {
13
+ extend: {
14
+ colors: {
15
+ primary: {
16
+ 50: '#f0f9ff',
17
+ 100: '#e0f2fe',
18
+ 200: '#bae6fd',
19
+ 300: '#7dd3fc',
20
+ 400: '#38bdf8',
21
+ 500: '#0ea5e9',
22
+ 600: '#0284c7',
23
+ 700: '#0369a1',
24
+ 800: '#075985',
25
+ 900: '#0c4a6e',
26
+ },
27
+ dark: {
28
+ 800: '#1e293b',
29
+ 900: '#0f172a',
30
+ }
31
+ },
32
+ fontFamily: {
33
+ 'sans': ['"Noto Sans SC"', 'sans-serif'],
34
+ },
35
+ }
36
+ }
37
+ }
38
+ </script>
39
+ <style>
40
+ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap');
41
+
42
+ body {
43
+ font-family: 'Noto Sans SC', sans-serif;
44
+ background-color: #0f172a;
45
+ color: #e2e8f0;
46
+ }
47
+
48
+ .gradient-text {
49
+ background: linear-gradient(90deg, #38bdf8 0%, #7dd3fc 50%, #bae6fd 100%);
50
+ -webkit-background-clip: text;
51
+ background-clip: text;
52
+ color: transparent;
53
+ }
54
+
55
+ .hero-gradient {
56
+ background: linear-gradient(135deg, rgba(15, 23, 42, 0.9) 0%, rgba(30, 41, 59, 0.9) 100%);
57
+ }
58
+
59
+ .feature-card:hover {
60
+ transform: translateY(-5px);
61
+ box-shadow: 0 10px 25px rgba(2, 132, 199, 0.3);
62
+ }
63
+
64
+ .input-field {
65
+ background-color: rgba(30, 41, 59, 0.7);
66
+ border: 1px solid #334155;
67
+ transition: all 0.3s ease;
68
+ }
69
+
70
+ .input-field:focus {
71
+ border-color: #38bdf8;
72
+ box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.3);
73
+ }
74
+
75
+ .btn-primary {
76
+ background: linear-gradient(90deg, #0ea5e9 0%, #38bdf8 100%);
77
+ transition: all 0.3s ease;
78
+ }
79
+
80
+ .btn-primary:hover {
81
+ background: linear-gradient(90deg, #0284c7 0%, #0ea5e9 100%);
82
+ transform: translateY(-2px);
83
+ box-shadow: 0 4px 15px rgba(2, 132, 199, 0.4);
84
+ }
85
+
86
+ .nav-link {
87
+ position: relative;
88
+ }
89
+
90
+ .nav-link::after {
91
+ content: '';
92
+ position: absolute;
93
+ bottom: -2px;
94
+ left: 0;
95
+ width: 0;
96
+ height: 2px;
97
+ background: #38bdf8;
98
+ transition: width 0.3s ease;
99
+ }
100
+
101
+ .nav-link:hover::after {
102
+ width: 100%;
103
+ }
104
+
105
+ .scroll-down {
106
+ animation: bounce 2s infinite;
107
+ }
108
+
109
+ @keyframes bounce {
110
+ 0%, 20%, 50%, 80%, 100% {
111
+ transform: translateY(0);
112
+ }
113
+ 40% {
114
+ transform: translateY(-15px);
115
+ }
116
+ 60% {
117
+ transform: translateY(-7px);
118
+ }
119
+ }
120
+ </style>
121
+ </head>
122
+ <body class="dark bg-dark-900 text-gray-200">
123
+ <!-- 导航栏 -->
124
+ <nav class="fixed w-full bg-dark-900/90 backdrop-blur-md z-50 border-b border-gray-800">
125
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
126
+ <div class="flex items-center justify-between h-16">
127
+ <div class="flex items-center">
128
+ <div class="flex-shrink-0">
129
+ <span class="text-2xl font-bold gradient-text">CAD<span class="text-white">AI</span></span>
130
+ </div>
131
+ <div class="hidden md:block">
132
+ <div class="ml-10 flex items-baseline space-x-8">
133
+ <a href="#features" class="nav-link text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">功能特点</a>
134
+ <a href="#how-it-works" class="nav-link text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">工作原理</a>
135
+ <a href="#pricing" class="nav-link text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">定价方案</a>
136
+ <a href="#testimonials" class="nav-link text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">客户评价</a>
137
+ <a href="#faq" class="nav-link text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">常见问题</a>
138
+ </div>
139
+ </div>
140
+ </div>
141
+ <div class="hidden md:block">
142
+ <div class="ml-4 flex items-center md:ml-6">
143
+ <a href="#contact" class="px-4 py-2 rounded-md text-sm font-medium text-white bg-primary-600 hover:bg-primary-700 transition duration-300">联系我们</a>
144
+ </div>
145
+ </div>
146
+ <div class="-mr-2 flex md:hidden">
147
+ <button type="button" id="mobile-menu-button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white">
148
+ <span class="sr-only">打开主菜单</span>
149
+ <i class="fas fa-bars"></i>
150
+ </button>
151
+ </div>
152
+ </div>
153
+ </div>
154
+
155
+ <!-- 移动端菜单 -->
156
+ <div id="mobile-menu" class="hidden md:hidden bg-dark-800">
157
+ <div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
158
+ <a href="#features" class="block px-3 py-2 rounded-md text-base font-medium text-gray-300 hover:text-white hover:bg-gray-700">功能特点</a>
159
+ <a href="#how-it-works" class="block px-3 py-2 rounded-md text-base font-medium text-gray-300 hover:text-white hover:bg-gray-700">工作原理</a>
160
+ <a href="#pricing" class="block px-3 py-2 rounded-md text-base font-medium text-gray-300 hover:text-white hover:bg-gray-700">定价方案</a>
161
+ <a href="#testimonials" class="block px-3 py-2 rounded-md text-base font-medium text-gray-300 hover:text-white hover:bg-gray-700">客户评价</a>
162
+ <a href="#faq" class="block px-3 py-2 rounded-md text-base font-medium text-gray-300 hover:text-white hover:bg-gray-700">常见问题</a>
163
+ <a href="#contact" class="block px-3 py-2 rounded-md text-base font-medium text-white bg-primary-600 hover:bg-primary-700">联系我们</a>
164
+ </div>
165
+ </div>
166
+ </nav>
167
+
168
+ <!-- 英雄区域 -->
169
+ <section class="hero-gradient pt-32 pb-20 px-4 sm:px-6 lg:px-8">
170
+ <div class="max-w-7xl mx-auto">
171
+ <div class="flex flex-col md:flex-row items-center">
172
+ <div class="md:w-1/2 mb-12 md:mb-0">
173
+ <h1 class="text-4xl md:text-5xl lg:text-6xl font-bold leading-tight mb-6">
174
+ <span class="gradient-text">文字描述</span>
175
+ <br>
176
+ <span class="text-white">即刻生成专业</span>
177
+ <span class="gradient-text">CAD图纸</span>
178
+ </h1>
179
+ <p class="text-lg md:text-xl text-gray-300 mb-8 max-w-lg">
180
+ 通过人工智能技术，将您的文字描述自动转换为精确的CAD设计图纸，节省90%的设计时间，让创意快速变为现实。
181
+ </p>
182
+ <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
183
+ <a href="#demo" class="btn-primary text-white font-semibold py-3 px-8 rounded-lg text-center">免费试用</a>
184
+ <a href="#how-it-works" class="bg-dark-800 text-white font-semibold py-3 px-8 rounded-lg border border-gray-700 hover:border-primary-500 transition duration-300 text-center">了解更多</a>
185
+ </div>
186
+ <div class="mt-8 flex items-center">
187
+ <div class="flex -space-x-2">
188
+ <img class="inline-block h-10 w-10 rounded-full ring-2 ring-dark-900" src="https://randomuser.me/api/portraits/women/1.jpg" alt="">
189
+ <img class="inline-block h-10 w-10 rounded-full ring-2 ring-dark-900" src="https://randomuser.me/api/portraits/men/2.jpg" alt="">
190
+ <img class="inline-block h-10 w-10 rounded-full ring-2 ring-dark-900" src="https://randomuser.me/api/portraits/women/3.jpg" alt="">
191
+ </div>
192
+ <p class="ml-4 text-gray-400">
193
+ <span class="text-white font-medium">500+</span> 设计师正在使用
194
+ </p>
195
+ </div>
196
+ </div>
197
+ <div class="md:w-1/2 relative">
198
+ <div class="relative z-10 rounded-xl overflow-hidden border border-gray-800 shadow-2xl">
199
+ <div class="bg-dark-800 py-3 px-4 flex items-center">
200
+ <div class="flex space-x-2">
201
+ <div class="w-3 h-3 rounded-full bg-red-500"></div>
202
+ <div class="w-3 h-3 rounded-full bg-yellow-500"></div>
203
+ <div class="w-3 h-3 rounded-full bg-green-500"></div>
204
+ </div>
205
+ <div class="flex-1 text-center text-sm text-gray-400">CAD设计预览</div>
206
+ </div>
207
+ <img src="https://images.unsplash.com/photo-1635070041078-e363dbe005cb?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="CAD设计示例" class="w-full h-auto">
208
+ </div>
209
+ <div class="absolute -bottom-8 -left-8 w-32 h-32 bg-primary-500 rounded-full mix-blend-multiply filter blur-3xl opacity-20"></div>
210
+ <div class="absolute -top-8 -right-8 w-32 h-32 bg-purple-500 rounded-full mix-blend-multiply filter blur-3xl opacity-20"></div>
211
+ </div>
212
+ </div>
213
+ </div>
214
+ <div class="mt-16 text-center scroll-down">
215
+ <a href="#features" class="text-gray-400 hover:text-white">
216
+ <i class="fas fa-chevron-down text-2xl"></i>
217
+ </a>
218
+ </div>
219
+ </section>
220
+
221
+ <!-- 客户标志 -->
222
+ <section class="py-12 bg-dark-800">
223
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
224
+ <p class="text-center text-gray-400 mb-8">信任我们的行业领导者</p>
225
+ <div class="grid grid-cols-2 md:grid-cols-5 gap-8 items-center justify-center">
226
+ <img src="https://via.placeholder.com/160x60?text=Company+1" alt="Company 1" class="h-8 opacity-70 hover:opacity-100 transition duration-300 mx-auto">
227
+ <img src="https://via.placeholder.com/160x60?text=Company+2" alt="Company 2" class="h-10 opacity-70 hover:opacity-100 transition duration-300 mx-auto">
228
+ <img src="https://via.placeholder.com/160x60?text=Company+3" alt="Company 3" class="h-12 opacity-70 hover:opacity-100 transition duration-300 mx-auto">
229
+ <img src="https://via.placeholder.com/160x60?text=Company+4" alt="Company 4" class="h-10 opacity-70 hover:opacity-100 transition duration-300 mx-auto">
230
+ <img src="https://via.placeholder.com/160x60?text=Company+5" alt="Company 5" class="h-8 opacity-70 hover:opacity-100 transition duration-300 mx-auto">
231
+ </div>
232
+ </div>
233
+ </section>
234
+
235
+ <!-- 功能特点 -->
236
+ <section id="features" class="py-20 px-4 sm:px-6 lg:px-8">
237
+ <div class="max-w-7xl mx-auto">
238
+ <div class="text-center mb-16">
239
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-primary-500 bg-primary-500/10 rounded-full mb-4">强大功能</span>
240
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">释放AI CAD设计的全部潜力</h2>
241
+ <p class="text-lg text-gray-400 max-w-3xl mx-auto">我们的AI技术能够理解复杂的设计需求，并生成精确的CAD图纸，满足各种行业标准</p>
242
+ </div>
243
+
244
+ <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
245
+ <div class="feature-card bg-dark-800 rounded-xl p-8 border border-gray-800 hover:border-primary-500 transition duration-300">
246
+ <div class="w-14 h-14 flex items-center justify-center bg-primary-500/10 rounded-lg mb-6">
247
+ <i class="fas fa-bolt text-2xl text-primary-500"></i>
248
+ </div>
249
+ <h3 class="text-xl font-bold text-white mb-3">极速生成</h3>
250
+ <p class="text-gray-400">只需输入文字描述，几秒钟内即可获得专业级CAD设计，比传统方法快10倍以上</p>
251
+ </div>
252
+
253
+ <div class="feature-card bg-dark-800 rounded-xl p-8 border border-gray-800 hover:border-primary-500 transition duration-300">
254
+ <div class="w-14 h-14 flex items-center justify-center bg-primary-500/10 rounded-lg mb-6">
255
+ <i class="fas fa-cogs text-2xl text-primary-500"></i>
256
+ </div>
257
+ <h3 class="text-xl font-bold text-white mb-3">智能修正</h3>
258
+ <p class="text-gray-400">AI自动检测并修正设计中的不合理之处，确保图纸符合工程标准和最佳实践</p>
259
+ </div>
260
+
261
+ <div class="feature-card bg-dark-800 rounded-xl p-8 border border-gray-800 hover:border-primary-500 transition duration-300">
262
+ <div class="w-14 h-14 flex items-center justify-center bg-primary-500/10 rounded-lg mb-6">
263
+ <i class="fas fa-file-export text-2xl text-primary-500"></i>
264
+ </div>
265
+ <h3 class="text-xl font-bold text-white mb-3">多格式导出</h3>
266
+ <p class="text-gray-400">支持DWG、DXF、STEP、IGES等多种工业标准格式，无缝对接您的工作流程</p>
267
+ </div>
268
+
269
+ <div class="feature-card bg-dark-800 rounded-xl p-8 border border-gray-800 hover:border-primary-500 transition duration-300">
270
+ <div class="w-14 h-14 flex items-center justify-center bg-primary-500/10 rounded-lg mb-6">
271
+ <i class="fas fa-layer-group text-2xl text-primary-500"></i>
272
+ </div>
273
+ <h3 class="text-xl font-bold text-white mb-3">智能分层</h3>
274
+ <p class="text-gray-400">自动按照行业标准对图纸元素进行分层管理，提高后续编辑和生产的效率</p>
275
+ </div>
276
+
277
+ <div class="feature-card bg-dark-800 rounded-xl p-8 border border-gray-800 hover:border-primary-500 transition duration-300">
278
+ <div class="w-14 h-14 flex items-center justify-center bg-primary-500/10 rounded-lg mb-6">
279
+ <i class="fas fa-ruler-combined text-2xl text-primary-500"></i>
280
+ </div>
281
+ <h3 class="text-xl font-bold text-white mb-3">精确尺寸</h3>
282
+ <p class="text-gray-400">AI精确理解并应用您指定的尺寸参数，误差控制在0.1mm以内，满足精密制造需求</p>
283
+ </div>
284
+
285
+ <div class="feature-card bg-dark-800 rounded-xl p-8 border border-gray-800 hover:border-primary-500 transition duration-300">
286
+ <div class="w-14 h-14 flex items-center justify-center bg-primary-500/10 rounded-lg mb-6">
287
+ <i class="fas fa-users text-2xl text-primary-500"></i>
288
+ </div>
289
+ <h3 class="text-xl font-bold text-white mb-3">团队协作</h3>
290
+ <p class="text-gray-400">实时共享和协作编辑功能，让团队成员可以同时参与设计评审和修改</p>
291
+ </div>
292
+ </div>
293
+ </div>
294
+ </section>
295
+
296
+ <!-- 工作原理 -->
297
+ <section id="how-it-works" class="py-20 bg-dark-800 px-4 sm:px-6 lg:px-8">
298
+ <div class="max-w-7xl mx-auto">
299
+ <div class="text-center mb-16">
300
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-primary-500 bg-primary-500/10 rounded-full mb-4">工作原理</span>
301
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">只需三步，文字变CAD</h2>
302
+ <p class="text-lg text-gray-400 max-w-3xl mx-auto">我们的AI经过数百万专业图纸训练，能够理解复杂工程术语并生成精确设计</p>
303
+ </div>
304
+
305
+ <div class="flex flex-col md:flex-row items-center">
306
+ <div class="md:w-1/2 mb-12 md:mb-0 md:pr-12">
307
+ <div class="space-y-8">
308
+ <div class="flex">
309
+ <div class="flex-shrink-0">
310
+ <div class="flex items-center justify-center h-12 w-12 rounded-full bg-primary-500 text-white font-bold text-lg">1</div>
311
+ </div>
312
+ <div class="ml-4">
313
+ <h3 class="text-xl font-bold text-white mb-2">输入设计描述</h3>
314
+ <p class="text-gray-400">用自然语言描述您的设计需求，包括尺寸、形状、材料等参数。可以使用专业术语或简单描述。</p>
315
+ </div>
316
+ </div>
317
+
318
+ <div class="flex">
319
+ <div class="flex-shrink-0">
320
+ <div class="flex items-center justify-center h-12 w-12 rounded-full bg-primary-500 text-white font-bold text-lg">2</div>
321
+ </div>
322
+ <div class="ml-4">
323
+ <h3 class="text-xl font-bold text-white mb-2">AI生成设计</h3>
324
+ <p class="text-gray-400">我们的AI引擎分析您的需求，参考行业标准和最佳实践，生成初步CAD设计方案。</p>
325
+ </div>
326
+ </div>
327
+
328
+ <div class="flex">
329
+ <div class="flex-shrink-0">
330
+ <div class="flex items-center justify-center h-12 w-12 rounded-full bg-primary-500 text-white font-bold text-lg">3</div>
331
+ </div>
332
+ <div class="ml-4">
333
+ <h3 class="text-xl font-bold text-white mb-2">调整与导出</h3>
334
+ <p class="text-gray-400">预览生成的设计，进行必要的调整，然后导出为所需格式，直接用于生产或进一步编辑。</p>
335
+ </div>
336
+ </div>
337
+ </div>
338
+ </div>
339
+
340
+ <div class="md:w-1/2 relative">
341
+ <div class="bg-dark-900 rounded-xl overflow-hidden border border-gray-700 shadow-xl">
342
+ <div class="bg-dark-800 py-3 px-4 flex items-center">
343
+ <div class="flex space-x-2">
344
+ <div class="w-3 h-3 rounded-full bg-red-500"></div>
345
+ <div class="w-3 h-3 rounded-full bg-yellow-500"></div>
346
+ <div class="w-3 h-3 rounded-full bg-green-500"></div>
347
+ </div>
348
+ <div class="flex-1 text-center text-sm text-gray-400">CADAI 工作界面</div>
349
+ </div>
350
+ <div class="p-6">
351
+ <div class="bg-dark-700 rounded-lg p-4 mb-4">
352
+ <div class="flex items-start">
353
+ <div class="flex-shrink-0 h-10 w-10 rounded-full bg-primary-500 flex items-center justify-center text-white">
354
+ <i class="fas fa-user"></i>
355
+ </div>
356
+ <div class="ml-3">
357
+ <div class="text-sm font-medium text-white">用户输入</div>
358
+ <div class="mt-1 text-sm text-gray-300 bg-dark-600 p-3 rounded-lg">
359
+ "设计一个长300mm、宽200mm、高150mm的铝制外壳，正面有5个直径10mm的圆形散热孔，顶部有一个120mm×80mm的矩形开口，四角有R10的圆角"
360
+ </div>
361
+ </div>
362
+ </div>
363
+ </div>
364
+
365
+ <div class="bg-dark-700 rounded-lg p-4">
366
+ <div class="flex items-start">
367
+ <div class="flex-shrink-0 h-10 w-10 rounded-full bg-purple-500 flex items-center justify-center text-white">
368
+ <i class="fas fa-robot"></i>
369
+ </div>
370
+ <div class="ml-3">
371
+ <div class="text-sm font-medium text-white">CADAI 响应</div>
372
+ <div class="mt-1 text-sm text-gray-300 bg-dark-600 p-3 rounded-lg">
373
+ "已生成符合要求的3D模型和工程图纸。散热孔按均匀分布排列，顶部开口居中。已应用所有指定尺寸和圆角。是否需要进一步调整或导出为特定格式？"
374
+ </div>
375
+ </div>
376
+ </div>
377
+ </div>
378
+ </div>
379
+ </div>
380
+ </div>
381
+ </div>
382
+ </div>
383
+ </section>
384
+
385
+ <!-- 演示视频 -->
386
+ <section class="py-20 px-4 sm:px-6 lg:px-8">
387
+ <div class="max-w-7xl mx-auto">
388
+ <div class="text-center mb-16">
389
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-primary-500 bg-primary-500/10 rounded-full mb-4">产品演示</span>
390
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">见证AI CAD的魔力</h2>
391
+ <p class="text-lg text-gray-400 max-w-3xl mx-auto">观看我们的产品如何将简单的文字描述转化为专业级CAD设计</p>
392
+ </div>
393
+
394
+ <div class="bg-dark-800 rounded-xl overflow-hidden border border-gray-700 shadow-xl max-w-4xl mx-auto">
395
+ <div class="aspect-w-16 aspect-h-9">
396
+ <div class="w-full h-0 pb-[56.25%] relative">
397
+ <div class="absolute inset-0 bg-gradient-to-br from-dark-700 to-dark-900 flex items-center justify-center">
398
+ <button class="w-20 h-20 rounded-full bg-primary-500/20 border border-primary-500/50 flex items-center justify-center text-primary-500 hover:bg-primary-500/30 transition duration-300">
399
+ <i class="fas fa-play text-2xl"></i>
400
+ </button>
401
+ </div>
402
+ </div>
403
+ </div>
404
+ <div class="p-6 border-t border-gray-700">
405
+ <h3 class="text-xl font-bold text-white mb-2">从文字到CAD的完整工作流程</h3>
406
+ <p class="text-gray-400">本视频展示了如何从简单的文字描述开始，通过我们的AI平台生成复杂的机械零件CAD图纸，并进行必要的调整和导出。</p>
407
+ </div>
408
+ </div>
409
+ </div>
410
+ </section>
411
+
412
+ <!-- 定价方案 -->
413
+ <section id="pricing" class="py-20 bg-dark-800 px-4 sm:px-6 lg:px-8">
414
+ <div class="max-w-7xl mx-auto">
415
+ <div class="text-center mb-16">
416
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-primary-500 bg-primary-500/10 rounded-full mb-4">定价方案</span>
417
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">灵活选择，满足各种需求</h2>
418
+ <p class="text-lg text-gray-400 max-w-3xl mx-auto">无论您是独立设计师还是大型团队，我们都有适合您的方案</p>
419
+ </div>
420
+
421
+ <div class="grid md:grid-cols-3 gap-8 max-w-5xl mx-auto">
422
+ <div class="bg-dark-900 rounded-xl p-8 border border-gray-700 hover:border-primary-500 transition duration-300">
423
+ <h3 class="text-xl font-bold text-white mb-4">入门版</h3>
424
+ <div class="mb-6">
425
+ <span class="text-4xl font-bold text-white">¥99</span>
426
+ <span class="text-gray-400">/月</span>
427
+ </div>
428
+ <p class="text-gray-400 mb-6">适合个人设计师和小型项目</p>
429
+ <ul class="space-y-3 mb-8">
430
+ <li class="flex items-center">
431
+ <i class="fas fa-check text-primary-500 mr-3"></i>
432
+ <span class="text-gray-300">每月50次设计生成</span>
433
+ </li>
434
+ <li class="flex items-center">
435
+ <i class="fas fa-check text-primary-500 mr-3"></i>
436
+ <span class="text-gray-300">基础CAD格式导出</span>
437
+ </li>
438
+ <li class="flex items-center">
439
+ <i class="fas fa-check text-primary-500 mr-3"></i>
440
+ <span class="text-gray-300">单个用户许可</span>
441
+ </li>
442
+ <li class="flex items-center text-gray-500">
443
+ <i class="fas fa-times mr-3"></i>
444
+ <span>高级技术支持</span>
445
+ </li>
446
+ <li class="flex items-center text-gray-500">
447
+ <i class="fas fa-times mr-3"></i>
448
+ <span>团队协作功能</span>
449
+ </li>
450
+ </ul>
451
+ <a href="#" class="block w-full py-3 px-4 text-center rounded-lg bg-dark-700 hover:bg-dark-600 text-white font-medium border border-gray-700 transition duration-300">开始使用</a>
452
+ </div>
453
+
454
+ <div class="bg-dark-900 rounded-xl p-8 border-2 border-primary-500 transform scale-105 z-10 shadow-lg">
455
+ <div class="absolute top-0 right-0 bg-primary-500 text-white text-xs font-bold px-3 py-1 rounded-bl-lg rounded-tr-lg">最受欢迎</div>
456
+ <h3 class="text-xl font-bold text-white mb-4">专业版</h3>
457
+ <div class="mb-6">
458
+ <span class="text-4xl font-bold text-white">¥299</span>
459
+ <span class="text-gray-400">/月</span>
460
+ </div>
461
+ <p class="text-gray-400 mb-6">适合中小型设计团队</p>
462
+ <ul class="space-y-3 mb-8">
463
+ <li class="flex items-center">
464
+ <i class="fas fa-check text-primary-500 mr-3"></i>
465
+ <span class="text-gray-300">每月200次设计生成</span>
466
+ </li>
467
+ <li class="flex items-center">
468
+ <i class="fas fa-check text-primary-500 mr-3"></i>
469
+ <span class="text-gray-300">所有CAD格式导出</span>
470
+ </li>
471
+ <li class="flex items-center">
472
+ <i class="fas fa-check text-primary-500 mr-3"></i>
473
+ <span class="text-gray-300">最多5个用户许可</span>
474
+ </li>
475
+ <li class="flex items-center">
476
+ <i class="fas fa-check text-primary-500 mr-3"></i>
477
+ <span class="text-gray-300">优先技术支持</span>
478
+ </li>
479
+ <li class="flex items-center">
480
+ <i class="fas fa-check text-primary-500 mr-3"></i>
481
+ <span class="text-gray-300">基础团队协作功能</span>
482
+ </li>
483
+ </ul>
484
+ <a href="#" class="block w-full py-3 px-4 text-center rounded-lg btn-primary font-medium transition duration-300">开始使用</a>
485
+ </div>
486
+
487
+ <div class="bg-dark-900 rounded-xl p-8 border border-gray-700 hover:border-primary-500 transition duration-300">
488
+ <h3 class="text-xl font-bold text-white mb-4">企业版</h3>
489
+ <div class="mb-6">
490
+ <span class="text-4xl font-bold text-white">定制</span>
491
+ </div>
492
+ <p class="text-gray-400 mb-6">适合大型企业和定制需求</p>
493
+ <ul class="space-y-3 mb-8">
494
+ <li class="flex items-center">
495
+ <i class="fas fa-check text-primary-500 mr-3"></i>
496
+ <span class="text-gray-300">无限设计生成</span>
497
+ </li>
498
+ <li class="flex items-center">
499
+ <i class="fas fa-check text-primary-500 mr-3"></i>
500
+ <span class="text-gray-300">所有CAD格式导出</span>
501
+ </li>
502
+ <li class="flex items-center">
503
+ <i class="fas fa-check text-primary-500 mr-3"></i>
504
+ <span class="text-gray-300">多用户团队管理</span>
505
+ </li>
506
+ <li class="flex items-center">
507
+ <i class="fas fa-check text-primary-500 mr-3"></i>
508
+ <span class="text-gray-300">专属客户经理</span>
509
+ </li>
510
+ <li class="flex items-center">
511
+ <i class="fas fa-check text-primary-500 mr-3"></i>
512
+ <span class="text-gray-300">高级团队协作功能</span>
513
+ </li>
514
+ </ul>
515
+ <a href="#" class="block w-full py-3 px-4 text-center rounded-lg bg-dark-700 hover:bg-dark-600 text-white font-medium border border-gray-700 transition duration-300">联系我们</a>
516
+ </div>
517
+ </div>
518
+
519
+ <div class="mt-12 text-center">
520
+ <p class="text-gray-400">不确定哪种方案适合您？ <a href="#contact" class="text-primary-500 hover:text-primary-400 underline">联系我们</a> 获取个性化建议</p>
521
+ </div>
522
+ </div>
523
+ </section>
524
+
525
+ <!-- 客户评价 -->
526
+ <section id="testimonials" class="py-20 px-4 sm:px-6 lg:px-8">
527
+ <div class="max-w-7xl mx-auto">
528
+ <div class="text-center mb-16">
529
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-primary-500 bg-primary-500/10 rounded-full mb-4">客户评价</span>
530
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">听听我们的用户怎么说</h2>
531
+ <p class="text-lg text-gray-400 max-w-3xl mx-auto">来自各行业设计师和工程师的真实反馈</p>
532
+ </div>
533
+
534
+ <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
535
+ <div class="bg-dark-800 rounded-xl p-8 border border-gray-700">
536
+ <div class="flex items-center mb-6">
537
+ <img class="w-12 h-12 rounded-full" src="https://randomuser.me/api/portraits/women/44.jpg" alt="Sarah Zhang">
538
+ <div class="ml-4">
539
+ <h4 class="text-lg font-bold text-white">张雨薇</h4>
540
+ <p class="text-gray-400">机械设计师</p>
541
+ </div>
542
+ </div>
543
+ <p class="text-gray-300 mb-6">"使用CADAI后，我的设计效率提高了3倍。以前需要一整天完成的设计现在只需几小时，而且AI生成的图纸质量非常高，减少了大量返工。"</p>
544
+ <div class="flex">
545
+ <i class="fas fa-star text-yellow-400"></i>
546
+ <i class="fas fa-star text-yellow-400"></i>
547
+ <i class="fas fa-star text-yellow-400"></i>
548
+ <i class="fas fa-star text-yellow-400"></i>
549
+ <i class="fas fa-star text-yellow-400"></i>
550
+ </div>
551
+ </div>
552
+
553
+ <div class="bg-dark-800 rounded-xl p-8 border border-gray-700">
554
+ <div class="flex items-center mb-6">
555
+ <img class="w-12 h-12 rounded-full" src="https://randomuser.me/api/portraits/men/32.jpg" alt="Li Wei">
556
+ <div class="ml-4">
557
+ <h4 class="text-lg font-bold text-white">李伟</h4>
558
+ <p class="text-gray-400">产品经理</p>
559
+ </div>
560
+ </div>
561
+ <p class="text-gray-300 mb-6">"作为非技术人员，CADAI让我能够直接将想法转化为设计图纸，与工程师沟通效率大幅提升。我们的产品开发周期缩短了40%。"</p>
562
+ <div class="flex">
563
+ <i class="fas fa-star text-yellow-400"></i>
564
+ <i class="fas fa-star text-yellow-400"></i>
565
+ <i class="fas fa-star text-yellow-400"></i>
566
+ <i class="fas fa-star text-yellow-400"></i>
567
+ <i class="fas fa-star text-yellow-400"></i>
568
+ </div>
569
+ </div>
570
+
571
+ <div class="bg-dark-800 rounded-xl p-8 border border-gray-700">
572
+ <div class="flex items-center mb-6">
573
+ <img class="w-12 h-12 rounded-full" src="https://randomuser.me/api/portraits/women/68.jpg" alt="Wang Jing">
574
+ <div class="ml-4">
575
+ <h4 class="text-lg font-bold text-white">王静</h4>
576
+ <p class="text-gray-400">建筑设计师</p>
577
+ </div>
578
+ </div>
579
+ <p class="text-gray-300 mb-6">"CADAI理解建筑术语的能力令人印象深刻。它生成的图纸符合我们的行业标准，节省了大量重复性工作，让我们能专注于创意设计。"</p>
580
+ <div class="flex">
581
+ <i class="fas fa-star text-yellow-400"></i>
582
+ <i class="fas fa-star text-yellow-400"></i>
583
+ <i class="fas fa-star text-yellow-400"></i>
584
+ <i class="fas fa-star text-yellow-400"></i>
585
+ <i class="fas fa-star text-yellow-400"></i>
586
+ </div>
587
+ </div>
588
+ </div>
589
+ </div>
590
+ </section>
591
+
592
+ <!-- 常见问题 -->
593
+ <section id="faq" class="py-20 bg-dark-800 px-4 sm:px-6 lg:px-8">
594
+ <div class="max-w-4xl mx-auto">
595
+ <div class="text-center mb-16">
596
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-primary-500 bg-primary-500/10 rounded-full mb-4">常见问题</span>
597
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">您可能关心的问题</h2>
598
+ <p class="text-lg text-gray-400">找不到答案？<a href="#contact" class="text-primary-500 hover:text-primary-400 ml-2">联系我们</a></p>
599
+ </div>
600
+
601
+ <div class="space-y-4">
602
+ <div class="bg-dark-900 rounded-xl overflow-hidden border border-gray-700">
603
+ <button class="faq-toggle w-full flex items-center justify-between p-6 text-left">
604
+ <h3 class="text-lg font-medium text-white">CADAI支持哪些CAD格式？</h3>
605
+ <i class="fas fa-chevron-down text-gray-400 transform transition-transform duration-300"></i>
606
+ </button>
607
+ <div class="faq-content hidden px-6 pb-6 pt-0">
608
+ <p class="text-gray-400">CADAI支持所有主流CAD格式，包括DWG、DXF、STEP、IGES、STL、OBJ等。我们还支持导出为PDF、SVG等通用格式，方便查看和分享。如果您有特殊格式需求，可以联系我们定制解决方案。</p>
609
+ </div>
610
+ </div>
611
+
612
+ <div class="bg-dark-900 rounded-xl overflow-hidden border border-gray-700">
613
+ <button class="faq-toggle w-full flex items-center justify-between p-6 text-left">
614
+ <h3 class="text-lg font-medium text-white">AI生成的设计精度如何？</h3>
615
+ <i class="fas fa-chevron-down text-gray-400 transform transition-transform duration-300"></i>
616
+ </button>
617
+ <div class="faq-content hidden px-6 pb-6 pt-0">
618
+ <p class="text-gray-400">CADAI生成的图纸精度控制在0.1mm以内，满足绝大多数工程需求。对于特别精密的零件(如公差要求±0.01mm)，我们建议在生成后进行人工复核。AI会自动标注关键尺寸和公差，帮助您快速验证设计。</p>
619
+ </div>
620
+ </div>
621
+
622
+ <div class="bg-dark-900 rounded-xl overflow-hidden border border-gray-700">
623
+ <button class="faq-toggle w-full flex items-center justify-between p-6 text-left">
624
+ <h3 class="text-lg font-medium text-white">是否需要CAD专业知识才能使用？</h3>
625
+ <i class="fas fa-chevron-down text-gray-400 transform transition-transform duration-300"></i>
626
+ </button>
627
+ <div class="faq-content hidden px-6 pb-6 pt-0">
628
+ <p class="text-gray-400">不需要。CADAI设计初衷就是让非专业人士也能快速创建CAD设计。您可以用自然语言描述需求，AI会处理技术细节。当然，如果您有CAD经验，可以使用专业术语获得更精确的结果。我们还提供模板库和示例，帮助您快速上手。</p>
629
+ </div>
630
+ </div>
631
+
632
+ <div class="bg-dark-900 rounded-xl overflow-hidden border border-gray-700">
633
+ <button class="faq-toggle w-full flex items-center justify-between p-6 text-left">
634
+ <h3 class="text-lg font-medium text-white">如何保证设计的安全性和隐私？</h3>
635
+ <i class="fas fa-chevron-down text-gray-400 transform transition-transform duration-300"></i>
636
+ </button>
637
+ <div class="faq-content hidden px-6 pb-6 pt-0">
638
+ <p class="text-gray-400">我们采用企业级加密技术保护您的数据。所有设计文件和通信都经过加密传输和存储。您可以选择将数据保存在本地服务器(企业版功能)。我们不会将您的设计用于训练AI模型，除非获得明确授权。详细内容请参阅我们的隐私政策。</p>
639
+ </div>
640
+ </div>
641
+
642
+ <div class="bg-dark-900 rounded-xl overflow-hidden border border-gray-700">
643
+ <button class="faq-toggle w-full flex items-center justify-between p-6 text-left">
644
+ <h3 class="text-lg font-medium text-white">能否集成到现有设计流程中？</h3>
645
+ <i class="fas fa-chevron-down text-gray-400 transform transition-transform duration-300"></i>
646
+ </button>
647
+ <div class="faq-content hidden px-6 pb-6 pt-0">
648
+ <p class="text-gray-400">可以。CADAI提供API接口，支持与主流CAD软件(如AutoCAD、SolidWorks等)和PLM系统集成。我们还支持自定义工作流和自动化脚本，让AI生成的设计无缝融入您现有的设计验证和生产流程。企业客户可获得专属集成支持。</p>
649
+ </div>
650
+ </div>
651
+ </div>
652
+ </div>
653
+ </section>
654
+
655
+ <!-- 联系我们 -->
656
+ <section id="contact" class="py-20 px-4 sm:px-6 lg:px-8">
657
+ <div class="max-w-7xl mx-auto">
658
+ <div class="text-center mb-16">
659
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-primary-500 bg-primary-500/10 rounded-full mb-4">联系我们</span>
660
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">准备好改变您的设计方式了吗？</h2>
661
+ <p class="text-lg text-gray-400 max-w-3xl mx-auto">填写下方表单，我们的专家会尽快与您联系</p>
662
+ </div>
663
+
664
+ <div class="flex flex-col lg:flex-row bg-dark-800 rounded-xl overflow-hidden border border-gray-700 shadow-xl">
665
+ <div class="lg:w-1/2 p-12">
666
+ <h3 class="text-2xl font-bold text-white mb-6">发送消息</h3>
667
+ <form>
668
+ <div class="mb-6">
669
+ <label for="name" class="block text-sm font-medium text-gray-300 mb-2">您的姓名</label>
670
+ <input type="text" id="name" class="w-full input-field py-3 px-4 rounded-lg text-white" placeholder="张三">
671
+ </div>
672
+ <div class="mb-6">
673
+ <label for="email" class="block text-sm font-medium text-gray-300 mb-2">电子邮箱</label>
674
+ <input type="email" id="email" class="w-full input-field py-3 px-4 rounded-lg text-white" placeholder="[email protected]">
675
+ </div>
676
+ <div class="mb-6">
677
+ <label for="company" class="block text-sm font-medium text-gray-300 mb-2">公司名称 (选填)</label>
678
+ <input type="text" id="company" class="w-full input-field py-3 px-4 rounded-lg text-white" placeholder="ABC科技有限公司">
679
+ </div>
680
+ <div class="mb-6">
681
+ <label for="message" class="block text-sm font-medium text-gray-300 mb-2">您的需求</label>
682
+ <textarea id="message" rows="4" class="w-full input-field py-3 px-4 rounded-lg text-white" placeholder="请描述您的CAD设计需求..."></textarea>
683
+ </div>
684
+ <button type="submit" class="w-full btn-primary py-3 px-4 rounded-lg font-medium">发送消息</button>
685
+ </form>
686
+ </div>
687
+ <div class="lg:w-1/2 bg-gradient-to-br from-dark-700 to-dark-900 p-12 flex flex-col justify-between">
688
+ <div>
689
+ <h3 class="text-2xl font-bold text-white mb-6">其他联系方式</h3>
690
+ <div class="space-y-6">
691
+ <div class="flex items-start">
692
+ <div class="flex-shrink-0 h-10 w-10 rounded-full bg-primary-500/10 flex items-center justify-center text-primary-500">
693
+ <i class="fas fa-envelope"></i>
694
+ </div>
695
+ <div class="ml-4">
696
+ <h4 class="text-lg font-medium text-white">电子邮件</h4>
697
+ <p class="text-gray-400">[email protected]</p>
698
+ </div>
699
+ </div>
700
+ <div class="flex items-start">
701
+ <div class="flex-shrink-0 h-10 w-10 rounded-full bg-primary-500/10 flex items-center justify-center text-primary-500">
702
+ <i class="fas fa-phone-alt"></i>
703
+ </div>
704
+ <div class="ml-4">
705
+ <h4 class="text-lg font-medium text-white">电话支持</h4>
706
+ <p class="text-gray-400">400-888-8888</p>
707
+ <p class="text-sm text-gray-500">周一至周五 9:00-18:00</p>
708
+ </div>
709
+ </div>
710
+ <div class="flex items-start">
711
+ <div class="flex-shrink-0 h-10 w-10 rounded-full bg-primary-500/10 flex items-center justify-center text-primary-500">
712
+ <i class="fas fa-map-marker-alt"></i>
713
+ </div>
714
+ <div class="ml-4">
715
+ <h4 class="text-lg font-medium text-white">公司地址</h4>
716
+ <p class="text-gray-400">上海市浦东新区张江高科技园区亮秀路112号Y1座</p>
717
+ </div>
718
+ </div>
719
+ </div>
720
+ </div>
721
+ <div class="mt-12">
722
+ <h4 class="text-lg font-medium text-white mb-4">关注我们</h4>
723
+ <div class="flex space-x-4">
724
+ <a href="#" class="h-10 w-10 rounded-full bg-dark-700 hover:bg-dark-600 flex items-center justify-center text-gray-400 hover:text-white transition duration-300">
725
+ <i class="fab fa-weixin"></i>
726
+ </a>
727
+ <a href="#" class="h-10 w-10 rounded-full bg-dark-700 hover:bg-dark-600 flex items-center justify-center text-gray-400 hover:text-white transition duration-300">
728
+ <i class="fab fa-weibo"></i>
729
+ </a>
730
+ <a href="#" class="h-10 w-10 rounded-full bg-dark-700 hover:bg-dark-600 flex items-center justify-center text-gray-400 hover:text-white transition duration-300">
731
+ <i class="fab fa-linkedin-in"></i>
732
+ </a>
733
+ <a href="#" class="h-10 w-10 rounded-full bg-dark-700 hover:bg-dark-600 flex items-center justify-center text-gray-400 hover:text-white transition duration-300">
734
+ <i class="fab fa-github"></i>
735
+ </a>
736
+ </div>
737
+ </div>
738
+ </div>
739
+ </div>
740
+ </div>
741
+ </section>
742
+
743
+ <!-- 免费试用 -->
744
+ <section id="demo" class="py-20 bg-gradient-to-br from-dark-800 to-dark-900 px-4 sm:px-6 lg:px-8">
745
+ <div class="max-w-4xl mx-auto text-center">
746
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-6">立即体验AI CAD生成</h2>
747
+ <p class="text-xl text-gray-400 mb-10">无需信用卡，注册即可获得7天专业版试用</p>
748
+ <div class="max-w-md mx-auto">
749
+ <div class="flex">
750
+ <input type="email" placeholder="输入您的电子邮箱" class="flex-1 input-field py-4 px-6 rounded-l-lg text-white">
751
+ <button class="btn-primary py-4 px-6 rounded-r-lg font-medium whitespace-nowrap">开始免费试用</button>
752
+ </div>
753
+ <p class="text-sm text-gray-500 mt-3">点击"开始免费试用"即表示您同意我们的服务条款和隐私政策</p>
754
+ </div>
755
+ </div>
756
+ </section>
757
+
758
+ <!-- 页脚 -->
759
+ <footer class="bg-dark-900 border-t border-gray-800">
760
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
761
+ <div class="grid grid-cols-2 md:grid-cols-5 gap-8">
762
+ <div class="col-span-2">
763
+ <span class="text-2xl font-bold gradient-text">CAD<span class="text-white">AI</span></span>
764
+ <p class="mt-4 text-gray-400">通过人工智能技术革新CAD设计流程，让创意更快变为现实。</p>
765
+ <div class="mt-6 flex space-x-6">
766
+ <a href="#" class="text-gray-400 hover:text-white">
767
+ <i class="fab fa-weixin text-xl"></i>
768
+ </a>
769
+ <a href="#" class="text-gray-400 hover:text-white">
770
+ <i class="fab fa-weibo text-xl"></i>
771
+ </a>
772
+ <a href="#" class="text-gray-400 hover:text-white">
773
+ <i class="fab fa-linkedin-in text-xl"></i>
774
+ </a>
775
+ <a href="#" class="text-gray-400 hover:text-white">
776
+ <i class="fab fa-github text-xl"></i>
777
+ </a>
778
+ </div>
779
+ </div>
780
+ <div>
781
+ <h3 class="text-sm font-semibold text-white uppercase tracking-wider">产品</h3>
782
+ <ul class="mt-4 space-y-3">
783
+ <li><a href="#" class="text-gray-400 hover:text-white">功能</a></li>
784
+ <li><a href="#" class="text-gray-400 hover:text-white">定价</a></li>
785
+ <li><a href="#" class="text-gray-400 hover:text-white">演示</a></li>
786
+ <li><a href="#" class="text-gray-400 hover:text-white">更新</a></li>
787
+ </ul>
788
+ </div>
789
+ <div>
790
+ <h3 class="text-sm font-semibold text-white uppercase tracking-wider">资源</h3>
791
+ <ul class="mt-4 space-y-3">
792
+ <li><a href="#" class="text-gray-400 hover:text-white">文档</a></li>
793
+ <li><a href="#" class="text-gray-400 hover:text-white">教程</a></li>
794
+ <li><a href="#" class="text-gray-400 hover:text-white">博客</a></li>
795
+ <li><a href="#" class="text-gray-400 hover:text-white">API</a></li>
796
+ </ul>
797
+ </div>
798
+ <div>
799
+ <h3 class="text-sm font-semibold text-white uppercase tracking-wider">公司</h3>
800
+ <ul class="mt-4 space-y-3">
801
+ <li><a href="#" class="text-gray-400 hover:text-white">关于我们</a></li>
802
+ <li><a href="#" class="text-gray-400 hover:text-white">加入我们</a></li>
803
+ <li><a href="#" class="text-gray-400 hover:text-white">隐私政策</a></li>
804
+ <li><a href="#" class="text-gray-400 hover:text-white">服务条款</a></li>
805
+ </ul>
806
+ </div>
807
+ </div>
808
+ <div class="mt-12 pt-8 border-t border-gray-800 flex flex-col md:flex-row justify-between items-center">
809
+ <p class="text-gray-400 text-sm">© 2023 CADAI Technologies. 保留所有权利。</p>
810
+ <div class="mt-4 md:mt-0 flex space-x-6">
811
+ <a href="#" class="text-gray-400 hover:text-white text-sm">隐私政策</a>
812
+ <a href="#" class="text-gray-400 hover:text-white text-sm">服务条款</a>
813
+ <a href="#" class="text-gray-400 hover:text-white text-sm">Cookie政策</a>
814
+ </div>
815
+ </div>
816
+ </div>
817
+ </footer>
818
+
819
+ <script>
820
+ // 移动端菜单切换
821
+ document.getElementById('mobile-menu-button').addEventListener('click', function() {
822
+ const menu = document.getElementById('mobile-menu');
823
+ menu.classList.toggle('hidden');
824
+ });
825
+
826
+ // FAQ 切换
827
+ document.querySelectorAll('.faq-toggle').forEach(button => {
828
+ button.addEventListener('click', () => {
829
+ const content = button.nextElementSibling;
830
+ const icon = button.querySelector('i');
831
+
832
+ content.classList.toggle('hidden');
833
+ icon.classList.toggle('rotate-180');
834
+ });
835
+ });
836
+
837
+ // 平滑滚动
838
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
839
+ anchor.addEventListener('click', function(e) {
840
+ e.preventDefault();
841
+
842
+ const targetId = this.getAttribute('href');
843
+ if (targetId === '#') return;
844
+
845
+ const targetElement = document.querySelector(targetId);
846
+ if (targetElement) {
847
+ window.scrollTo({
848
+ top: targetElement.offsetTop - 80,
849
+ behavior: 'smooth'
850
+ });
851
+
852
+ // 关闭移动端菜单
853
+ const mobileMenu = document.getElementById('mobile-menu');
854
+ mobileMenu.classList.add('hidden');
855
+ }
856
+ });
857
+ });
858
+
859
+ // 滚动时导航栏效果
860
+ window.addEventListener('scroll', function() {
861
+ const nav = document.querySelector('nav');
862
+ if (window.scrollY > 50) {
863
+ nav.classList.add('shadow-lg');
864
+ nav.classList.remove('bg-dark-900/90');
865
+ nav.classList.add('bg-dark-900');
866
+ } else {
867
+ nav.classList.remove('shadow-lg');
868
+ nav.classList.add('bg-dark-900/90');
869
+ nav.classList.remove('bg-dark-900');
870
+ }
871
+ });
872
+ </script>
873
+ <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=ColamanAI/deepsite" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
874
+ </html>