Hugging Face's logo

Spaces:
flowinx
/
flowinx-ia
Running

App Files Community
flowinx commited on
Commit
4f8c869
·
verified ·
1 Parent(s): 3647c4a

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +930 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Flowinx Ia
3
- emoji: 🏢
4
- colorFrom: yellow
5
- colorTo: yellow
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: flowinx-ia
3
+ emoji: 🐳
4
+ colorFrom: red
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,930 @@
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="pt-BR">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Flowinx | Automações Inteligentes com IA</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
+ <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
10
+ <script src="https://cdn.jsdelivr.net/npm/tsparticles@2.0.6/tsparticles.min.js"></script>
11
+ <style>
12
+ body {
13
+ font-family: 'Poppins', sans-serif;
14
+ background-color: #000000;
15
+ color: #FFFFFF;
16
+ scroll-behavior: smooth;
17
+ }
18
+
19
+ .gradient-bg {
20
+ background: linear-gradient(135deg, #6B00E6 0%, #000000 100%);
21
+ }
22
+
23
+ .purple-glow {
24
+ box-shadow: 0 0 20px rgba(107, 0, 230, 0.5);
25
+ }
26
+
27
+ .purple-glow-lg {
28
+ box-shadow: 0 0 40px rgba(107, 0, 230, 0.7);
29
+ }
30
+
31
+ .particles-js {
32
+ position: absolute;
33
+ width: 100%;
34
+ height: 100%;
35
+ top: 0;
36
+ left: 0;
37
+ z-index: 0;
38
+ }
39
+
40
+ .hero-content {
41
+ position: relative;
42
+ z-index: 10;
43
+ }
44
+
45
+ .feature-card:hover {
46
+ transform: translateY(-10px);
47
+ transition: all 0.3s ease;
48
+ }
49
+
50
+ .plan-card:hover {
51
+ transform: scale(1.03);
52
+ transition: all 0.3s ease;
53
+ }
54
+
55
+ .accordion-content {
56
+ max-height: 0;
57
+ overflow: hidden;
58
+ transition: max-height 0.3s ease-out;
59
+ }
60
+
61
+ .accordion.active .accordion-content {
62
+ max-height: 500px;
63
+ transition: max-height 0.5s ease-in;
64
+ }
65
+
66
+ .testimonial-slide {
67
+ flex: 0 0 100%;
68
+ transition: transform 0.5s ease;
69
+ }
70
+
71
+ @media (min-width: 768px) {
72
+ .testimonial-slide {
73
+ flex: 0 0 50%;
74
+ }
75
+ }
76
+
77
+ @media (min-width: 1024px) {
78
+ .testimonial-slide {
79
+ flex: 0 0 33.333%;
80
+ }
81
+ }
82
+ </style>
83
+ </head>
84
+ <body>
85
+ <!-- Header/Navigation -->
86
+ <header class="fixed w-full z-50 bg-black bg-opacity-90 backdrop-blur-sm">
87
+ <div class="container mx-auto px-6 py-4">
88
+ <div class="flex justify-between items-center">
89
+ <div class="flex items-center">
90
+ <a href="#" class="flex items-center">
91
+ <div class="w-10 h-10 rounded-full gradient-bg flex items-center justify-center mr-3">
92
+ <i class="fas fa-bolt text-white text-xl"></i>
93
+ </div>
94
+ <span class="text-white text-2xl font-bold">Flow<span class="text-purple-500">inx</span></span>
95
+ </a>
96
+ </div>
97
+
98
+ <nav class="hidden md:flex space-x-8">
99
+ <a href="#solucoes" class="text-white hover:text-purple-400 transition">Soluções</a>
100
+ <a href="#como-funciona" class="text-white hover:text-purple-400 transition">Como Funciona</a>
101
+ <a href="#beneficios" class="text-white hover:text-purple-400 transition">Benefícios</a>
102
+ <a href="#planos" class="text-white hover:text-purple-400 transition">Planos</a>
103
+ <a href="#contato" class="text-white hover:text-purple-400 transition">Contato</a>
104
+ </nav>
105
+
106
+ <div class="hidden md:block">
107
+ <a href="#contato" class="bg-purple-600 hover:bg-purple-700 text-white px-6 py-2 rounded-full font-medium transition purple-glow hover:purple-glow-lg">
108
+ Entrar em Contato
109
+ </a>
110
+ </div>
111
+
112
+ <button class="md:hidden text-white focus:outline-none" id="mobile-menu-button">
113
+ <i class="fas fa-bars text-2xl"></i>
114
+ </button>
115
+ </div>
116
+
117
+ <!-- Mobile menu -->
118
+ <div class="md:hidden hidden mt-4 pb-4" id="mobile-menu">
119
+ <a href="#solucoes" class="block py-2 text-white hover:text-purple-400">Soluções</a>
120
+ <a href="#como-funciona" class="block py-2 text-white hover:text-purple-400">Como Funciona</a>
121
+ <a href="#beneficios" class="block py-2 text-white hover:text-purple-400">Benefícios</a>
122
+ <a href="#planos" class="block py-2 text-white hover:text-purple-400">Planos</a>
123
+ <a href="#contato" class="block py-2 text-white hover:text-purple-400">Contato</a>
124
+ <a href="#contato" class="block mt-4 bg-purple-600 hover:bg-purple-700 text-white px-6 py-2 rounded-full font-medium text-center">
125
+ Entrar em Contato
126
+ </a>
127
+ </div>
128
+ </div>
129
+ </header>
130
+
131
+ <!-- Hero Section -->
132
+ <section class="relative min-h-screen flex items-center pt-20 overflow-hidden">
133
+ <div id="particles-js" class="particles-js"></div>
134
+ <div class="container mx-auto px-6 hero-content">
135
+ <div class="flex flex-col lg:flex-row items-center">
136
+ <div class="lg:w-1/2 mb-12 lg:mb-0">
137
+ <h1 class="text-4xl md:text-5xl lg:text-6xl font-bold leading-tight mb-6">
138
+ Automatize, otimize e escale seus processos com <span class="text-purple-400">IA de verdade</span>
139
+ </h1>
140
+ <p class="text-xl text-gray-300 mb-8">
141
+ Soluções inteligentes para empresas que querem sair na frente com eficiência.
142
+ </p>
143
+ <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
144
+ <a href="#contato" class="bg-purple-600 hover:bg-purple-700 text-white px-8 py-4 rounded-full font-medium text-lg text-center transition purple-glow hover:purple-glow-lg">
145
+ Entrar em Contato
146
+ </a>
147
+ </div>
148
+ </div>
149
+ <div class="lg:w-1/2 flex justify-center">
150
+ <div class="relative w-full max-w-xl">
151
+ <div class="absolute -inset-4 rounded-2xl bg-purple-500 opacity-20 blur-lg"></div>
152
+ <div class="relative bg-gray-900 rounded-xl overflow-hidden purple-glow-lg">
153
+ <img src="https://images.unsplash.com/photo-1620712943543-bcc4688e7485?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1200&q=80" alt="Dashboard Flowinx" class="w-full h-auto">
154
+ <div class="absolute inset-0 flex items-center justify-center">
155
+ <div class="w-16 h-16 rounded-full bg-purple-600 flex items-center justify-center cursor-pointer">
156
+ <i class="fas fa-play text-white text-2xl"></i>
157
+ </div>
158
+ </div>
159
+ </div>
160
+ </div>
161
+ </div>
162
+ </div>
163
+ </div>
164
+ </section>
165
+ <!-- Como Funciona -->
166
+ <section id="como-funciona" class="py-20 bg-black">
167
+ <div class="container mx-auto px-6">
168
+ <div class="text-center mb-16">
169
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">
170
+ Como a <span class="text-purple-400">Flowinx</span> transforma seu negócio
171
+ </h2>
172
+ <p class="text-xl text-gray-400 max-w-3xl mx-auto">
173
+ Nossa abordagem em 3 etapas simples para revolucionar seus processos
174
+ </p>
175
+ </div>
176
+
177
+ <div class="flex flex-col lg:flex-row justify-between items-center gap-12">
178
+ <!-- Step 1 -->
179
+ <div class="flex-1 text-center">
180
+ <div class="w-24 h-24 gradient-bg rounded-full flex items-center justify-center mx-auto mb-6">
181
+ <i class="fas fa-search text-white text-3xl"></i>
182
+ </div>
183
+ <h3 class="text-2xl font-bold mb-3">1. Diagnóstico</h3>
184
+ <p class="text-gray-400">
185
+ Nossa equipe analisa seus processos e identifica oportunidades de automação e otimização.
186
+ </p>
187
+ </div>
188
+
189
+ <!-- Arrow -->
190
+ <div class="hidden lg:block">
191
+ <i class="fas fa-arrow-right text-purple-500 text-3xl"></i>
192
+ </div>
193
+
194
+ <!-- Step 2 -->
195
+ <div class="flex-1 text-center">
196
+ <div class="w-24 h-24 gradient-bg rounded-full flex items-center justify-center mx-auto mb-6">
197
+ <i class="fas fa-robot text-white text-3xl"></i>
198
+ </div>
199
+ <h3 class="text-2xl font-bold mb-3">2. Automação de Processos</h3>
200
+ <p class="text-gray-400">
201
+ Implementamos soluções personalizadas que automatizam tarefas repetitivas e complexas.
202
+ </p>
203
+ </div>
204
+
205
+ <!-- Arrow -->
206
+ <div class="hidden lg:block">
207
+ <i class="fas fa-arrow-right text-purple-500 text-3xl"></i>
208
+ </div>
209
+
210
+ <!-- Step 3 -->
211
+ <div class="flex-1 text-center">
212
+ <div class="w-24 h-24 gradient-bg rounded-full flex items-center justify-center mx-auto mb-6">
213
+ <i class="fas fa-chart-line text-white text-3xl"></i>
214
+ </div>
215
+ <h3 class="text-2xl font-bold mb-3">3. Monitoramento Contínuo</h3>
216
+ <p class="text-gray-400">
217
+ Acompanhamos os resultados e ajustamos as automações para garantir melhoria constante.
218
+ </p>
219
+ </div>
220
+ </div>
221
+
222
+ <div class="mt-16 text-center">
223
+ <a href="#contato" class="inline-block bg-purple-600 hover:bg-purple-700 text-white px-8 py-3 rounded-full font-medium transition purple-glow hover:purple-glow-lg">
224
+ Quero saber mais
225
+ </a>
226
+ </div>
227
+ </div>
228
+ </section>
229
+
230
+ <!-- Benefícios -->
231
+ <section id="beneficios" class="py-20 bg-gray-900">
232
+ <div class="container mx-auto px-6">
233
+ <div class="text-center mb-16">
234
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">
235
+ Benefícios <span class="text-purple-400">exclusivos</span>
236
+ </h2>
237
+ <p class="text-xl text-gray-400 max-w-3xl mx-auto">
238
+ Descubra como a Flowinx pode transformar sua operação
239
+ </p>
240
+ </div>
241
+
242
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
243
+ <!-- Benefit 1 -->
244
+ <div class="bg-gray-800 rounded-xl p-8 feature-card transition">
245
+ <div class="w-16 h-16 gradient-bg rounded-full flex items-center justify-center mb-6">
246
+ <i class="fas fa-money-bill-wave text-white text-2xl"></i>
247
+ </div>
248
+ <h3 class="text-xl font-bold mb-3">Redução de custos</h3>
249
+ <p class="text-gray-400">
250
+ Diminua seus custos operacionais em até 60% com nossas soluções de automação inteligente.
251
+ </p>
252
+ </div>
253
+
254
+ <!-- Benefit 2 -->
255
+ <div class="bg-gray-800 rounded-xl p-8 feature-card transition">
256
+ <div class="w-16 h-16 gradient-bg rounded-full flex items-center justify-center mb-6">
257
+ <i class="fas fa-clock text-white text-2xl"></i>
258
+ </div>
259
+ <h3 class="text-xl font-bold mb-3">Economia de tempo</h3>
260
+ <p class="text-gray-400">
261
+ Libere sua equipe de tarefas repetitivas, economizando centenas de horas por mês.
262
+ </p>
263
+ </div>
264
+
265
+ <!-- Benefit 3 -->
266
+ <div class="bg-gray-800 rounded-xl p-8 feature-card transition">
267
+ <div class="w-16 h-16 gradient-bg rounded-full flex items-center justify-center mb-6">
268
+ <i class="fas fa-lightbulb text-white text-2xl"></i>
269
+ </div>
270
+ <h3 class="text-xl font-bold mb-3">Insights automáticos</h3>
271
+ <p class="text-gray-400">
272
+ Nossa IA identifica padrões e oportunidades que passariam despercebidos pelo olho humano.
273
+ </p>
274
+ </div>
275
+
276
+ <!-- Benefit 4 -->
277
+ <div class="bg-gray-800 rounded-xl p-8 feature-card transition">
278
+ <div class="w-16 h-16 gradient-bg rounded-full flex items-center justify-center mb-6">
279
+ <i class="fas fa-plug text-white text-2xl"></i>
280
+ </div>
281
+ <h3 class="text-xl font-bold mb-3">Integração fácil</h3>
282
+ <p class="text-gray-400">
283
+ Conecte-se facilmente com seus sistemas existentes sem necessidade de grandes mudanças.
284
+ </p>
285
+ </div>
286
+ </div>
287
+ </div>
288
+ </section>
289
+
290
+ <!-- Demonstração Visual -->
291
+ <section class="py-20 bg-black">
292
+ <div class="container mx-auto px-6">
293
+ <div class="flex flex-col lg:flex-row items-center gap-12">
294
+ <div class="lg:w-1/2 mb-12 lg:mb-0">
295
+ <h2 class="text-3xl md:text-4xl font-bold mb-6">
296
+ Veja a <span class="text-purple-400">Flowinx</span> em ação
297
+ </h2>
298
+ <p class="text-xl text-gray-400 mb-8">
299
+ Nossa plataforma transforma dados em decisões estratégicas de forma automática e inteligente.
300
+ </p>
301
+
302
+ <ul class="space-y-4">
303
+ <li class="flex items-start">
304
+ <div class="flex-shrink-0 mt-1">
305
+ <div class="w-6 h-6 rounded-full bg-purple-600 flex items-center justify-center">
306
+ <i class="fas fa-check text-white text-xs"></i>
307
+ </div>
308
+ </div>
309
+ <p class="ml-3 text-gray-300">
310
+ <span class="font-medium">Análise em tempo real:</span> Processe grandes volumes de dados instantaneamente
311
+ </p>
312
+ </li>
313
+ <li class="flex items-start">
314
+ <div class="flex-shrink-0 mt-1">
315
+ <div class="w-6 h-6 rounded-full bg-purple-600 flex items-center justify-center">
316
+ <i class="fas fa-check text-white text-xs"></i>
317
+ </div>
318
+ </div>
319
+ <p class="ml-3 text-gray-300">
320
+ <span class="font-medium">Relatórios automáticos:</span> Gere insights estratégicos sem esforço
321
+ </p>
322
+ </li>
323
+ <li class="flex items-start">
324
+ <div class="flex-shrink-0 mt-1">
325
+ <div class="w-6 h-6 rounded-full bg-purple-600 flex items-center justify-center">
326
+ <i class="fas fa-check text-white text-xs"></i>
327
+ </div>
328
+ </div>
329
+ <p class="ml-3 text-gray-300">
330
+ <span class="font-medium">Alertas inteligentes:</span> Seja notificado sobre oportunidades e riscos
331
+ </p>
332
+ </li>
333
+ <li class="flex items-start">
334
+ <div class="flex-shrink-0 mt-1">
335
+ <div class="w-6 h-6 rounded-full bg-purple-600 flex items-center justify-center">
336
+ <i class="fas fa-check text-white text-xs"></i>
337
+ </div>
338
+ </div>
339
+ <p class="ml-3 text-gray-300">
340
+ <span class="font-medium">Personalização total:</span> Adapte-se às necessidades específicas do seu negócio
341
+ </p>
342
+ </li>
343
+ </ul>
344
+
345
+ <div class="mt-8">
346
+ <a href="#contato" class="inline-block bg-purple-600 hover:bg-purple-700 text-white px-8 py-3 rounded-full font-medium transition purple-glow hover:purple-glow-lg">
347
+ Agendar reunião on-line
348
+ </a>
349
+ </div>
350
+ </div>
351
+
352
+ <div class="lg:w-1/2">
353
+ <div class="relative">
354
+ <div class="absolute -inset-4 rounded-2xl bg-purple-500 opacity-20 blur-lg"></div>
355
+ <div class="relative bg-gray-900 rounded-xl overflow-hidden purple-glow-lg">
356
+ <img src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1200&q=80" alt="Demonstração Flowinx" class="w-full h-auto">
357
+ </div>
358
+ </div>
359
+ </div>
360
+ </div>
361
+ </div>
362
+ </section>
363
+
364
+ <!-- Depoimentos -->
365
+ <section class="py-20 bg-gray-900">
366
+ <div class="container mx-auto px-6">
367
+ <div class="text-center mb-16">
368
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">
369
+ O que nossos <span class="text-purple-400">clientes</span> dizem
370
+ </h2>
371
+ <p class="text-xl text-gray-400 max-w-3xl mx-auto">
372
+ Empresas que já transformaram seus processos com a Flowinx
373
+ </p>
374
+ </div>
375
+
376
+ <div class="relative overflow-hidden">
377
+ <div class="flex transition-transform duration-500 ease-in-out" id="testimonial-slider">
378
+ <!-- Testimonial 1 -->
379
+ <div class="testimonial-slide px-4">
380
+ <div class="bg-gray-800 rounded-xl p-8 h-full">
381
+ <div class="flex items-center mb-6">
382
+ <img src="https://randomuser.me/api/portraits/women/44.jpg" alt="Cliente 1" class="w-16 h-16 rounded-full object-cover mr-4">
383
+ <div>
384
+ <h4 class="font-bold text-lg">Ana Carolina Silva</h4>
385
+ <p class="text-purple-400">Diretora de Operações</p>
386
+ <p class="text-gray-500 text-sm">Empresa X</p>
387
+ </div>
388
+ </div>
389
+ <p class="text-gray-300 italic">
390
+ "A Flowinx revolucionou nossa operação. Em 3 meses, reduzimos 45% dos custos operacionais e aumentamos a produtividade em 60%. A equipe está mais focada em estratégias e menos em tarefas repetitivas."
391
+ </p>
392
+ <div class="mt-4 text-purple-400">
393
+ <i class="fas fa-star"></i>
394
+ <i class="fas fa-star"></i>
395
+ <i class="fas fa-star"></i>
396
+ <i class="fas fa-star"></i>
397
+ <i class="fas fa-star"></i>
398
+ </div>
399
+ </div>
400
+ </div>
401
+
402
+ <!-- Testimonial 2 -->
403
+ <div class="testimonial-slide px-4">
404
+ <div class="bg-gray-800 rounded-xl p-8 h-full">
405
+ <div class="flex items-center mb-6">
406
+ <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="Cliente 2" class="w-16 h-16 rounded-full object-cover mr-4">
407
+ <div>
408
+ <h4 class="font-bold text-lg">Ricardo Almeida</h4>
409
+ <p class="text-purple-400">CEO</p>
410
+ <p class="text-gray-500 text-sm">Startup Y</p>
411
+ </div>
412
+ </div>
413
+ <p class="text-gray-300 italic">
414
+ "Implementamos a Flowinx em toda nossa cadeia de suprimentos. Os insights gerados pela IA nos ajudaram a identificar gargalos que nem sabíamos que existiam. Agora tomamos decisões baseadas em dados em tempo real."
415
+ </p>
416
+ <div class="mt-4 text-purple-400">
417
+ <i class="fas fa-star"></i>
418
+ <i class="fas fa-star"></i>
419
+ <i class="fas fa-star"></i>
420
+ <i class="fas fa-star"></i>
421
+ <i class="fas fa-star"></i>
422
+ </div>
423
+ </div>
424
+ </div>
425
+
426
+ <!-- Testimonial 3 -->
427
+ <div class="testimonial-slide px-4">
428
+ <div class="bg-gray-800 rounded-xl p-8 h-full">
429
+ <div class="flex items-center mb-6">
430
+ <img src="https://randomuser.me/api/portraits/women/68.jpg" alt="Cliente 3" class="w-16 h-16 rounded-full object-cover mr-4">
431
+ <div>
432
+ <h4 class="font-bold text-lg">Fernanda Oliveira</h4>
433
+ <p class="text-purple-400">Gerente de TI</p>
434
+ <p class="text-gray-500 text-sm">Grupo Z</p>
435
+ </div>
436
+ </div>
437
+ <p class="text-gray-300 italic">
438
+ "A integração foi surpreendentemente simples. Em duas semanas já tínhamos os primeiros processos automatizados. O suporte da equipe Flowinx é excepcional - estão sempre disponíveis para nos ajudar a extrair o máximo da plataforma."
439
+ </p>
440
+ <div class="mt-4 text-purple-400">
441
+ <i class="fas fa-star"></i>
442
+ <i class="fas fa-star"></i>
443
+ <i class="fas fa-star"></i>
444
+ <i class="fas fa-star"></i>
445
+ <i class="fas fa-star-half-alt"></i>
446
+ </div>
447
+ </div>
448
+ </div>
449
+ </div>
450
+
451
+ <div class="flex justify-center mt-8 space-x-2">
452
+ <button class="w-3 h-3 rounded-full bg-gray-700 hover:bg-purple-600 transition" onclick="goToSlide(0)"></button>
453
+ <button class="w-3 h-3 rounded-full bg-gray-700 hover:bg-purple-600 transition" onclick="goToSlide(1)"></button>
454
+ <button class="w-3 h-3 rounded-full bg-gray-700 hover:bg-purple-600 transition" onclick="goToSlide(2)"></button>
455
+ </div>
456
+ </div>
457
+ </div>
458
+ </section>
459
+ <!-- Segurança -->
460
+ <section class="py-20 bg-gray-900">
461
+ <div class="container mx-auto px-6">
462
+ <div class="flex flex-col lg:flex-row items-center gap-12">
463
+ <div class="lg:w-1/2 mb-12 lg:mb-0">
464
+ <h2 class="text-3xl md:text-4xl font-bold mb-6">
465
+ Segurança em <span class="text-purple-400">primeiro lugar</span>
466
+ </h2>
467
+ <p class="text-xl text-gray-400 mb-8">
468
+ Seus dados estão seguros com a Flowinx. Usamos padrões de segurança de nível empresarial.
469
+ </p>
470
+
471
+ <div class="grid grid-cols-2 gap-6 mb-8">
472
+ <div class="flex items-center">
473
+ <div class="w-12 h-12 rounded-full bg-purple-900 flex items-center justify-center mr-4">
474
+ <i class="fas fa-lock text-purple-400"></i>
475
+ </div>
476
+ <span class="font-medium">Criptografia SSL</span>
477
+ </div>
478
+ <div class="flex items-center">
479
+ <div class="w-12 h-12 rounded-full bg-purple-900 flex items-center justify-center mr-4">
480
+ <i class="fas fa-database text-purple-400"></i>
481
+ </div>
482
+ <span class="font-medium">Backup Automático</span>
483
+ </div>
484
+ </div>
485
+ </div>
486
+
487
+ <div class="lg:w-1/2">
488
+ <div class="relative">
489
+ <div class="absolute -inset-4 rounded-2xl bg-purple-500 opacity-20 blur-lg"></div>
490
+ <div class="relative bg-gray-800 rounded-xl overflow-hidden purple-glow-lg p-8">
491
+ <h3 class="text-xl font-bold mb-4">Nossa política de segurança</h3>
492
+ <ul class="space-y-4">
493
+ <li class="flex items-start">
494
+ <div class="flex-shrink-0 mt-1">
495
+ <div class="w-6 h-6 rounded-full bg-purple-600 flex items-center justify-center">
496
+ <i class="fas fa-check text-white text-xs"></i>
497
+ </div>
498
+ </div>
499
+ <p class="ml-3 text-gray-300">
500
+ Dados criptografados em trânsito e em repouso
501
+ </p>
502
+ </li>
503
+ <li class="flex items-start">
504
+ <div class="flex-shrink-0 mt-1">
505
+ <div class="w-6 h-6 rounded-full bg-purple-600 flex items-center justify-center">
506
+ <i class="fas fa-check text-white text-xs"></i>
507
+ </div>
508
+ </div>
509
+ <p class="ml-3 text-gray-300">
510
+ Backups diários em múltiplas localizações
511
+ </p>
512
+ </li>
513
+ <li class="flex items-start">
514
+ <div class="flex-shrink-0 mt-1">
515
+ <div class="w-6 h-6 rounded-full bg-purple-600 flex items-center justify-center">
516
+ <i class="fas fa-check text-white text-xs"></i>
517
+ </div>
518
+ </div>
519
+ <p class="ml-3 text-gray-300">
520
+ Controles rigorosos de acesso e autenticação
521
+ </p>
522
+ </li>
523
+ </ul>
524
+ </div>
525
+ </div>
526
+ </div>
527
+ </div>
528
+ </div>
529
+ </section>
530
+
531
+ <!-- FAQ -->
532
+ <section class="py-20 bg-black">
533
+ <div class="container mx-auto px-6">
534
+ <div class="text-center mb-16">
535
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">
536
+ Perguntas <span class="text-purple-400">frequentes</span>
537
+ </h2>
538
+ <p class="text-xl text-gray-400 max-w-3xl mx-auto">
539
+ Tire suas dúvidas sobre a Flowinx e automação inteligente
540
+ </p>
541
+ </div>
542
+
543
+ <div class="max-w-3xl mx-auto">
544
+ <!-- FAQ Item 1 -->
545
+ <div class="mb-4 border-b border-gray-800 accordion">
546
+ <button class="flex justify-between items-center w-full py-4 text-left font-medium text-lg focus:outline-none accordion-button">
547
+ <span>O que é automação inteligente?</span>
548
+ <i class="fas fa-chevron-down transition-transform duration-300"></i>
549
+ </button>
550
+ <div class="accordion-content">
551
+ <div class="pb-6 text-gray-400">
552
+ <p>A automação inteligente combina tecnologias como Inteligência Artificial, Machine Learning e RPA (Robotic Process Automation) para não apenas automatizar tarefas repetitivas, mas também aprender com os dados, tomar decisões e melhorar continuamente os processos. Diferente da automação tradicional, nossa solução adapta-se às mudanças e identifica oportunidades de otimização.</p>
553
+ </div>
554
+ </div>
555
+ </div>
556
+
557
+ <!-- FAQ Item 2 -->
558
+ <div class="mb-4 border-b border-gray-800 accordion">
559
+ <button class="flex justify-between items-center w-full py-4 text-left font-medium text-lg focus:outline-none accordion-button">
560
+ <span>É necessário conhecimento técnico para usar nossas soluções?</span>
561
+ <i class="fas fa-chevron-down transition-transform duration-300"></i>
562
+ </button>
563
+ <div class="accordion-content">
564
+ <div class="pb-6 text-gray-400">
565
+ <p>Não. Nossas soluções foram projetadas para serem intuitivas e acessíveis mesmo para usuários sem formação técnica. Oferecemos treinamentos e suporte especializado para garantir que sua equipe possa aproveitar ao máximo todas as funcionalidades. Além disso, nossa equipe de especialistas cuida de toda a implementação inicial e configuração dos processos.</p>
566
+ </div>
567
+ </div>
568
+ </div>
569
+
570
+ <!-- FAQ Item 3 -->
571
+ <div class="mb-4 border-b border-gray-800 accordion">
572
+ <button class="flex justify-between items-center w-full py-4 text-left font-medium text-lg focus:outline-none accordion-button">
573
+ <span>As implementações se adaptam ao meu sistema atual?</span>
574
+ <i class="fas fa-chevron-down transition-transform duration-300"></i>
575
+ </button>
576
+ <div class="accordion-content">
577
+ <div class="pb-6 text-gray-400">
578
+ <p>Sim. Nossa solução foi desenvolvida para se integrar facilmente com os sistemas mais comuns do mercado (ERPs, CRMs, bancos de dados, etc.) através de APIs e conectores pré-configurados. Se você utiliza sistemas proprietários ou menos comuns, nossa equipe técnica pode desenvolver integrações personalizadas para atender suas necessidades específicas.</p>
579
+ </div>
580
+ </div>
581
+ </div>
582
+
583
+ <!-- FAQ Item 4 -->
584
+ <div class="mb-4 border-b border-gray-800 accordion">
585
+ <button class="flex justify-between items-center w-full py-4 text-left font-medium text-lg focus:outline-none accordion-button">
586
+ <span>Como funciona o suporte da Flowinx?</span>
587
+ <i class="fas fa-chevron-down transition-transform duration-300"></i>
588
+ </button>
589
+ <div class="accordion-content">
590
+ <div class="pb-6 text-gray-400">
591
+ <p>Oferecemos diferentes níveis de suporte de acordo com o plano contratado. Todos os clientes têm acesso a nossa base de conhecimento, tutoriais e suporte por e-mail ou whatsapp. Disponibilizamos suporte prioritário por whatsapp e nossa equipe está sempre disponível para ajudar com qualquer dúvida ou necessidade que possa surgir.</p>
592
+ </div>
593
+ </div>
594
+ </div>
595
+
596
+ <!-- FAQ Item 5 -->
597
+ <div class="mb-4 border-b border-gray-800 accordion">
598
+ <button class="flex justify-between items-center w-full py-4 text-left font-medium text-lg focus:outline-none accordion-button">
599
+ <span>Quanto tempo leva para implementar a solução?</span>
600
+ <i class="fas fa-chevron-down transition-transform duration-300"></i>
601
+ </button>
602
+ <div class="accordion-content">
603
+ <div class="pb-6 text-gray-400">
604
+ <p>O tempo de implementação varia de acordo com a complexidade dos processos que serão automatizados e a quantidade de integrações necessárias. Em média, nossos clientes começam a ver resultados em 2 a 4 semanas após o início do projeto. Processos mais simples podem ser implementados em poucos dias, enquanto automações mais complexas podem levar algumas semanas para serem totalmente configuradas e otimizadas.</p>
605
+ </div>
606
+ </div>
607
+ </div>
608
+ </div>
609
+
610
+ <div class="mt-12 text-center">
611
+ <p class="text-gray-400 mb-4">Não encontrou sua dúvida?</p>
612
+ <a href="#contato" class="inline-block border border-purple-600 hover:bg-purple-900 text-white px-8 py-3 rounded-full font-medium transition">
613
+ Fale com nosso time
614
+ </a>
615
+ </div>
616
+ </div>
617
+ </section>
618
+
619
+ <!-- CTA Final -->
620
+ <section id="contato" class="py-20 gradient-bg">
621
+ <div class="container mx-auto px-6">
622
+ <div class="max-w-4xl mx-auto text-center">
623
+ <h2 class="text-3xl md:text-4xl font-bold mb-6">
624
+ Pronto para automatizar seu negócio com <span class="text-white">IA</span>?
625
+ </h2>
626
+ <p class="text-xl text-gray-300 mb-8">
627
+ Fale com nossos especialistas e veja como a Flowinx pode transformar seus processos.
628
+ </p>
629
+
630
+ <div class="max-w-xl mx-auto">
631
+ <form class="space-y-4">
632
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
633
+ <input type="text" placeholder="Seu nome" class="bg-white bg-opacity-10 border border-gray-400 rounded-full px-6 py-3 text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-purple-500 focus:border-transparent">
634
+ <input type="email" placeholder="Seu e-mail" class="bg-white bg-opacity-10 border border-gray-400 rounded-full px-6 py-3 text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-purple-500 focus:border-transparent">
635
+ </div>
636
+ <input type="tel" placeholder="Seu telefone" class="w-full bg-white bg-opacity-10 border border-gray-400 rounded-full px-6 py-3 text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-purple-500 focus:border-transparent">
637
+ <textarea placeholder="Conte sobre sua empresa e necessidades" rows="4" class="w-full bg-white bg-opacity-10 border border-gray-400 rounded-2xl px-6 py-3 text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-purple-500 focus:border-transparent"></textarea>
638
+
639
+ <div class="flex items-center justify-center">
640
+ <div class="g-recaptcha" data-sitekey="YOUR_RECAPTCHA_SITE_KEY"></div>
641
+ </div>
642
+
643
+ <button type="submit" class="w-full bg-white hover:bg-gray-100 text-purple-900 font-bold px-8 py-4 rounded-full transition transform hover:scale-105">
644
+ Entrar em contato
645
+ </button>
646
+ </form>
647
+ </div>
648
+
649
+ <div class="mt-8 flex flex-col sm:flex-row justify-center items-center space-y-4 sm:space-y-0 sm:space-x-8">
650
+ <div class="flex items-center">
651
+ <div class="w-10 h-10 rounded-full bg-purple-700 flex items-center justify-center mr-3">
652
+ <i class="fas fa-phone-alt text-white"></i>
653
+ </div>
654
+ <span class="text-white">(19) 96000-0431</span>
655
+ </div>
656
+ <div class="flex items-center">
657
+ <div class="w-10 h-10 rounded-full bg-purple-700 flex items-center justify-center mr-3">
658
+ <i class="fas fa-envelope text-white"></i>
659
+ </div>
660
+ <span class="text-white">contato@flowinx.com</span>
661
+ </div>
662
+ <div class="flex items-center">
663
+ <div class="w-10 h-10 rounded-full bg-purple-700 flex items-center justify-center mr-3">
664
+ <i class="fab fa-whatsapp text-white"></i>
665
+ </div>
666
+ <span class="text-white">(19) 96000-0431</span>
667
+ </div>
668
+ </div>
669
+ </div>
670
+ </div>
671
+ </section>
672
+
673
+ <!-- Footer -->
674
+ <footer class="bg-black py-12">
675
+ <div class="container mx-auto px-6">
676
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12">
677
+ <div>
678
+ <a href="#" class="flex items-center mb-6">
679
+ <div class="w-10 h-10 rounded-full gradient-bg flex items-center justify-center mr-3">
680
+ <i class="fas fa-bolt text-white text-xl"></i>
681
+ </div>
682
+ <span class="text-white text-2xl font-bold">Flow<span class="text-purple-500">inx</span></span>
683
+ </a>
684
+ <p class="text-gray-400 mb-4">
685
+ Automações inteligentes com IA para transformar seus processos e impulsionar seus resultados.
686
+ </p>
687
+ <div class="flex space-x-4">
688
+ <a href="#" class="text-gray-400 hover:text-white transition">
689
+ <i class="fab fa-linkedin-in text-xl"></i>
690
+ </a>
691
+ <a href="#" class="text-gray-400 hover:text-white transition">
692
+ <i class="fab fa-facebook-f text-xl"></i>
693
+ </a>
694
+ <a href="#" class="text-gray-400 hover:text-white transition">
695
+ <i class="fab fa-instagram text-xl"></i>
696
+ </a>
697
+ <a href="#" class="text-gray-400 hover:text-white transition">
698
+ <i class="fab fa-youtube text-xl"></i>
699
+ </a>
700
+ </div>
701
+ </div>
702
+
703
+ <div>
704
+ <h3 class="text-white text-lg font-bold mb-4">Soluções</h3>
705
+ <ul class="space-y-2">
706
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Automação de Processos</a></li>
707
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Otimização com IA</a></li>
708
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Análise de Dados</a></li>
709
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Integração de Sistemas</a></li>
710
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Monitoramento Inteligente</a></li>
711
+ </ul>
712
+ </div>
713
+
714
+ <div>
715
+ <h3 class="text-white text-lg font-bold mb-4">Empresa</h3>
716
+ <ul class="space-y-2">
717
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Sobre Nós</a></li>
718
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Cases de Sucesso</a></li>
719
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Contato</a></li>
720
+ </ul>
721
+ </div>
722
+
723
+ <div>
724
+ <h3 class="text-white text-lg font-bold mb-4">Legal</h3>
725
+ <ul class="space-y-2">
726
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Termos de Uso</a></li>
727
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Política de Privacidade</a></li>
728
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Segurança</a></li>
729
+ <li><a href="#" class="text-gray-400 hover:text-white transition">FAQ</a></li>
730
+ </ul>
731
+ </div>
732
+ </div>
733
+
734
+ <div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
735
+ <p class="text-gray-500 mb-4 md:mb-0">
736
+ © 2025 Flowinx Negócios Inteligentes. Todos os direitos reservados.
737
+ </p>
738
+ <div class="flex space-x-6">
739
+ <a href="#" class="text-gray-500 hover:text-white transition">Termos</a>
740
+ <a href="#" class="text-gray-500 hover:text-white transition">Privacidade</a>
741
+ <a href="#" class="text-gray-500 hover:text-white transition">Cookies</a>
742
+ </div>
743
+ </div>
744
+ </div>
745
+ </footer>
746
+
747
+ <script>
748
+ // Mobile menu toggle
749
+ document.getElementById('mobile-menu-button').addEventListener('click', function() {
750
+ const menu = document.getElementById('mobile-menu');
751
+ menu.classList.toggle('hidden');
752
+ });
753
+
754
+ // FAQ accordion
755
+ const accordions = document.querySelectorAll('.accordion');
756
+ accordions.forEach(accordion => {
757
+ const button = accordion.querySelector('.accordion-button');
758
+ button.addEventListener('click', () => {
759
+ accordion.classList.toggle('active');
760
+ const icon = button.querySelector('i');
761
+ const content = accordion.querySelector('.accordion-content');
762
+
763
+ if (accordion.classList.contains('active')) {
764
+ icon.classList.remove('fa-chevron-down');
765
+ icon.classList.add('fa-chevron-up');
766
+ } else {
767
+ icon.classList.remove('fa-chevron-up');
768
+ icon.classList.add('fa-chevron-down');
769
+ }
770
+ });
771
+ });
772
+
773
+ // Testimonial slider
774
+ let currentSlide = 0;
775
+ const slides = document.querySelectorAll('.testimonial-slide');
776
+ const totalSlides = slides.length;
777
+
778
+ function showSlide(index) {
779
+ const slider = document.getElementById('testimonial-slider');
780
+ slider.style.transform = `translateX(-${index * 100}%)`;
781
+ currentSlide = index;
782
+ }
783
+
784
+ function goToSlide(index) {
785
+ showSlide(index);
786
+ }
787
+
788
+ // Auto slide
789
+ setInterval(() => {
790
+ currentSlide = (currentSlide + 1) % totalSlides;
791
+ showSlide(currentSlide);
792
+ }, 5000);
793
+
794
+ // Particles.js configuration
795
+ document.addEventListener('DOMContentLoaded', function() {
796
+ if (document.getElementById('particles-js')) {
797
+ tsParticles.load("particles-js", {
798
+ particles: {
799
+ number: {
800
+ value: 80,
801
+ density: {
802
+ enable: true,
803
+ value_area: 800
804
+ }
805
+ },
806
+ color: {
807
+ value: "#6b00e6"
808
+ },
809
+ shape: {
810
+ type: "circle",
811
+ stroke: {
812
+ width: 0,
813
+ color: "#000000"
814
+ },
815
+ polygon: {
816
+ nb_sides: 5
817
+ }
818
+ },
819
+ opacity: {
820
+ value: 0.5,
821
+ random: false,
822
+ anim: {
823
+ enable: false,
824
+ speed: 1,
825
+ opacity_min: 0.1,
826
+ sync: false
827
+ }
828
+ },
829
+ size: {
830
+ value: 3,
831
+ random: true,
832
+ anim: {
833
+ enable: false,
834
+ speed: 40,
835
+ size_min: 0.1,
836
+ sync: false
837
+ }
838
+ },
839
+ line_linked: {
840
+ enable: true,
841
+ distance: 150,
842
+ color: "#6b00e6",
843
+ opacity: 0.4,
844
+ width: 1
845
+ },
846
+ move: {
847
+ enable: true,
848
+ speed: 2,
849
+ direction: "none",
850
+ random: false,
851
+ straight: false,
852
+ out_mode: "out",
853
+ bounce: false,
854
+ attract: {
855
+ enable: false,
856
+ rotateX: 600,
857
+ rotateY: 1200
858
+ }
859
+ }
860
+ },
861
+ interactivity: {
862
+ detect_on: "canvas",
863
+ events: {
864
+ onhover: {
865
+ enable: true,
866
+ mode: "grab"
867
+ },
868
+ onclick: {
869
+ enable: true,
870
+ mode: "push"
871
+ },
872
+ resize: true
873
+ },
874
+ modes: {
875
+ grab: {
876
+ distance: 140,
877
+ line_linked: {
878
+ opacity: 1
879
+ }
880
+ },
881
+ bubble: {
882
+ distance: 400,
883
+ size: 40,
884
+ duration: 2,
885
+ opacity: 8,
886
+ speed: 3
887
+ },
888
+ repulse: {
889
+ distance: 200,
890
+ duration: 0.4
891
+ },
892
+ push: {
893
+ particles_nb: 4
894
+ },
895
+ remove: {
896
+ particles_nb: 2
897
+ }
898
+ }
899
+ },
900
+ retina_detect: true
901
+ });
902
+ }
903
+ });
904
+
905
+ // Smooth scrolling for anchor links
906
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
907
+ anchor.addEventListener('click', function (e) {
908
+ e.preventDefault();
909
+
910
+ const targetId = this.getAttribute('href');
911
+ const targetElement = document.querySelector(targetId);
912
+
913
+ if (targetElement) {
914
+ window.scrollTo({
915
+ top: targetElement.offsetTop - 80,
916
+ behavior: 'smooth'
917
+ });
918
+
919
+ // Close mobile menu if open
920
+ const mobileMenu = document.getElementById('mobile-menu');
921
+ if (!mobileMenu.classList.contains('hidden')) {
922
+ mobileMenu.classList.add('hidden');
923
+ }
924
+ }
925
+ });
926
+ });
927
+ </script>
928
+ <script src="https://www.google.com/recaptcha/api.js" async defer></script>
929
+ <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=flowinx/flowinx" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p><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=flowinx/flowinx-ia" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
930
+ </html>
prompts.txt ADDED
File without changes