Hugging Face's logo

Spaces:
pedrofarini
/
thinkflowbr
Running

App Files Community
pedrofarini commited on
Commit
a640c8e
·
verified ·
1 Parent(s): fac7c11

undefined - Initial Deployment

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +605 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Thinkflowbr
3
- emoji: 😻
4
- colorFrom: purple
5
- colorTo: purple
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: thinkflowbr
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,605 @@
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>ThinkFlowBR - Soluções em Automação Industrial</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
+ theme: {
12
+ extend: {
13
+ colors: {
14
+ primary: '#1a365d',
15
+ secondary: '#2c5282',
16
+ accent: '#4299e1',
17
+ darkblue: '#1e3a8a',
18
+ lightblue: '#ebf8ff',
19
+ }
20
+ }
21
+ }
22
+ }
23
+ </script>
24
+ <style>
25
+ /* Custom CSS for animations and additional styling */
26
+ .hero-gradient {
27
+ background: linear-gradient(135deg, #1a365d 0%, #2c5282 50%, #4299e1 100%);
28
+ }
29
+
30
+ .card-hover {
31
+ transition: all 0.3s ease;
32
+ }
33
+
34
+ .card-hover:hover {
35
+ transform: translateY(-10px);
36
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
37
+ }
38
+
39
+ @keyframes float {
40
+ 0% { transform: translateY(0px); }
41
+ 50% { transform: translateY(-10px); }
42
+ 100% { transform: translateY(0px); }
43
+ }
44
+
45
+ .floating {
46
+ animation: float 6s ease-in-out infinite;
47
+ }
48
+
49
+ .nav-link {
50
+ position: relative;
51
+ }
52
+
53
+ .nav-link::after {
54
+ content: '';
55
+ position: absolute;
56
+ width: 0;
57
+ height: 2px;
58
+ bottom: 0;
59
+ left: 0;
60
+ background-color: #4299e1;
61
+ transition: width 0.3s ease;
62
+ }
63
+
64
+ .nav-link:hover::after {
65
+ width: 100%;
66
+ }
67
+ </style>
68
+ </head>
69
+ <body class="font-sans bg-gray-50">
70
+ <!-- Header/Navigation -->
71
+ <header class="bg-white shadow-sm sticky top-0 z-50">
72
+ <div class="container mx-auto px-4 py-4 flex justify-between items-center">
73
+ <div class="flex items-center">
74
+ <img src="https://via.placeholder.com/50" alt="ThinkFlowBR Logo" class="h-10 w-10 mr-3">
75
+ <span class="text-2xl font-bold text-primary">Think<span class="text-accent">Flow</span>BR</span>
76
+ </div>
77
+
78
+ <!-- Mobile menu button -->
79
+ <button id="mobile-menu-button" class="md:hidden text-primary">
80
+ <i class="fas fa-bars text-2xl"></i>
81
+ </button>
82
+
83
+ <!-- Desktop Navigation -->
84
+ <nav class="hidden md:flex space-x-8">
85
+ <a href="#home" class="nav-link text-primary font-medium">Início</a>
86
+ <a href="#services" class="nav-link text-primary font-medium">Serviços</a>
87
+ <a href="#about" class="nav-link text-primary font-medium">Sobre Nós</a>
88
+ <a href="#portfolio" class="nav-link text-primary font-medium">Portfólio</a>
89
+ <a href="#contact" class="nav-link text-primary font-medium">Contato</a>
90
+ </nav>
91
+ </div>
92
+
93
+ <!-- Mobile Navigation -->
94
+ <div id="mobile-menu" class="hidden md:hidden bg-white py-4 px-4 border-t">
95
+ <div class="flex flex-col space-y-4">
96
+ <a href="#home" class="text-primary font-medium">Início</a>
97
+ <a href="#services" class="text-primary font-medium">Serviços</a>
98
+ <a href="#about" class="text-primary font-medium">Sobre Nós</a>
99
+ <a href="#portfolio" class="text-primary font-medium">Portfólio</a>
100
+ <a href="#contact" class="text-primary font-medium">Contato</a>
101
+ </div>
102
+ </div>
103
+ </header>
104
+
105
+ <!-- Hero Section -->
106
+ <section id="home" class="hero-gradient text-white py-20 md:py-32">
107
+ <div class="container mx-auto px-4 flex flex-col md:flex-row items-center">
108
+ <div class="md:w-1/2 mb-10 md:mb-0">
109
+ <h1 class="text-4xl md:text-5xl font-bold mb-6">Soluções Inteligentes em <span class="text-accent">Automação Industrial</span></h1>
110
+ <p class="text-xl mb-8">Tecnologia de ponta para otimizar seus processos industriais e aumentar sua produtividade.</p>
111
+ <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
112
+ <a href="#contact" class="bg-accent hover:bg-blue-600 text-white font-bold py-3 px-6 rounded-lg text-center transition duration-300">Solicitar Orçamento</a>
113
+ <a href="#services" class="bg-transparent hover:bg-white hover:text-primary border-2 border-white text-white font-bold py-3 px-6 rounded-lg text-center transition duration-300">Nossos Serviços</a>
114
+ </div>
115
+ </div>
116
+ <div class="md:w-1/2 flex justify-center">
117
+ <img src="https://via.placeholder.com/600x400" alt="Automação Industrial" class="rounded-lg shadow-xl floating" style="max-width: 100%; height: auto;">
118
+ </div>
119
+ </div>
120
+ </section>
121
+
122
+ <!-- Features Section -->
123
+ <section class="bg-lightblue py-16">
124
+ <div class="container mx-auto px-4">
125
+ <div class="text-center mb-16">
126
+ <h2 class="text-3xl font-bold text-primary mb-4">Por que escolher a ThinkFlowBR?</h2>
127
+ <p class="text-gray-600 max-w-2xl mx-auto">Nós combinamos tecnologia de ponta com expertise industrial para entregar soluções sob medida para sua empresa.</p>
128
+ </div>
129
+
130
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
131
+ <div class="bg-white p-8 rounded-lg shadow-md text-center card-hover">
132
+ <div class="bg-accent text-white rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-6">
133
+ <i class="fas fa-cogs text-2xl"></i>
134
+ </div>
135
+ <h3 class="text-xl font-bold text-primary mb-4">Tecnologia Avançada</h3>
136
+ <p class="text-gray-600">Utilizamos as mais modernas plataformas de automação para garantir a máxima eficiência e confiabilidade.</p>
137
+ </div>
138
+
139
+ <div class="bg-white p-8 rounded-lg shadow-md text-center card-hover">
140
+ <div class="bg-accent text-white rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-6">
141
+ <i class="fas fa-user-tie text-2xl"></i>
142
+ </div>
143
+ <h3 class="text-xl font-bold text-primary mb-4">Equipe Especializada</h3>
144
+ <p class="text-gray-600">Nossos engenheiros possuem vasta experiência em implementação de sistemas automatizados.</p>
145
+ </div>
146
+
147
+ <div class="bg-white p-8 rounded-lg shadow-md text-center card-hover">
148
+ <div class="bg-accent text-white rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-6">
149
+ <i class="fas fa-headset text-2xl"></i>
150
+ </div>
151
+ <h3 class="text-xl font-bold text-primary mb-4">Suporte 24/7</h3>
152
+ <p class="text-gray-600">Oferecemos suporte técnico especializado a qualquer momento, garantindo a continuidade dos seus processos.</p>
153
+ </div>
154
+ </div>
155
+ </div>
156
+ </section>
157
+
158
+ <!-- Services Section -->
159
+ <section id="services" class="py-16 bg-white">
160
+ <div class="container mx-auto px-4">
161
+ <div class="text-center mb-16">
162
+ <h2 class="text-3xl font-bold text-primary mb-4">Nossos Serviços</h2>
163
+ <p class="text-gray-600 max-w-2xl mx-auto">Soluções completas em automação industrial para diversos segmentos</p>
164
+ </div>
165
+
166
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
167
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md card-hover">
168
+ <div class="h-48 bg-primary flex items-center justify-center">
169
+ <i class="fas fa-project-diagram text-white text-6xl"></i>
170
+ </div>
171
+ <div class="p-6">
172
+ <h3 class="text-xl font-bold text-primary mb-3">Sistemas de Controle</h3>
173
+ <p class="text-gray-600 mb-4">Implementação de CLPs, sistemas SCADA e painéis de supervisão para controle de processos industriais.</p>
174
+ <a href="#" class="text-accent font-medium flex items-center">Saiba mais <i class="fas fa-arrow-right ml-2"></i></a>
175
+ </div>
176
+ </div>
177
+
178
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md card-hover">
179
+ <div class="h-48 bg-primary flex items-center justify-center">
180
+ <i class="fas fa-robot text-white text-6xl"></i>
181
+ </div>
182
+ <div class="p-6">
183
+ <h3 class="text-xl font-bold text-primary mb-3">Robótica Industrial</h3>
184
+ <p class="text-gray-600 mb-4">Automatização de processos com robôs industriais para aumentar precisão e produtividade.</p>
185
+ <a href="#" class="text-accent font-medium flex items-center">Saiba mais <i class="fas fa-arrow-right ml-2"></i></a>
186
+ </div>
187
+ </div>
188
+
189
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md card-hover">
190
+ <div class="h-48 bg-primary flex items-center justify-center">
191
+ <i class="fas fa-network-wired text-white text-6xl"></i>
192
+ </div>
193
+ <div class="p-6">
194
+ <h3 class="text-xl font-bold text-primary mb-3">Redes Industriais</h3>
195
+ <p class="text-gray-600 mb-4">Projeto e implementação de redes de comunicação industrial para integração de sistemas.</p>
196
+ <a href="#" class="text-accent font-medium flex items-center">Saiba mais <i class="fas fa-arrow-right ml-2"></i></a>
197
+ </div>
198
+ </div>
199
+
200
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md card-hover">
201
+ <div class="h-48 bg-primary flex items-center justify-center">
202
+ <i class="fas fa-chart-line text-white text-6xl"></i>
203
+ </div>
204
+ <div class="p-6">
205
+ <h3 class="text-xl font-bold text-primary mb-3">IIoT (Indústria 4.0)</h3>
206
+ <p class="text-gray-600 mb-4">Implementação de soluções de Internet das Coisas Industrial para coleta e análise de dados.</p>
207
+ <a href="#" class="text-accent font-medium flex items-center">Saiba mais <i class="fas fa-arrow-right ml-2"></i></a>
208
+ </div>
209
+ </div>
210
+
211
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md card-hover">
212
+ <div class="h-48 bg-primary flex items-center justify-center">
213
+ <i class="fas fa-wrench text-white text-6xl"></i>
214
+ </div>
215
+ <div class="p-6">
216
+ <h3 class="text-xl font-bold text-primary mb-3">Manutenção Preditiva</h3>
217
+ <p class="text-gray-600 mb-4">Sistemas de monitoramento para antecipar falhas e reduzir paradas não programadas.</p>
218
+ <a href="#" class="text-accent font-medium flex items-center">Saiba mais <i class="fas fa-arrow-right ml-2"></i></a>
219
+ </div>
220
+ </div>
221
+
222
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md card-hover">
223
+ <div class="h-48 bg-primary flex items-center justify-center">
224
+ <i class="fas fa-laptop-code text-white text-6xl"></i>
225
+ </div>
226
+ <div class="p-6">
227
+ <h3 class="text-xl font-bold text-primary mb-3">Desenvolvimento de Software</h3>
228
+ <p class="text-gray-600 mb-4">Soluções personalizadas para integração de sistemas e aplicações industriais.</p>
229
+ <a href="#" class="text-accent font-medium flex items-center">Saiba mais <i class="fas fa-arrow-right ml-2"></i></a>
230
+ </div>
231
+ </div>
232
+ </div>
233
+ </div>
234
+ </section>
235
+
236
+ <!-- About Section -->
237
+ <section id="about" class="py-16 bg-lightblue">
238
+ <div class="container mx-auto px-4">
239
+ <div class="flex flex-col md:flex-row items-center">
240
+ <div class="md:w-1/2 mb-10 md:mb-0 md:pr-10">
241
+ <h2 class="text-3xl font-bold text-primary mb-6">Sobre a ThinkFlowBR</h2>
242
+ <p class="text-gray-600 mb-4">Fundada em 2015, a ThinkFlowBR surgiu com o propósito de revolucionar a automação industrial no Brasil, trazendo soluções inteligentes e inovadoras para nossos clientes.</p>
243
+ <p class="text-gray-600 mb-4">Com uma equipe altamente qualificada e comprometida, já implementamos mais de 200 projetos de automação em diversos segmentos industriais.</p>
244
+ <p class="text-gray-600 mb-6">Nossa missão é transformar processos industriais através da tecnologia, aumentando eficiência, segurança e lucratividade para nossos clientes.</p>
245
+ <div class="flex flex-wrap gap-4">
246
+ <div class="bg-primary text-white py-2 px-4 rounded-full text-sm font-medium">+200 Projetos</div>
247
+ <div class="bg-accent text-white py-2 px-4 rounded-full text-sm font-medium">15+ Indústrias</div>
248
+ <div class="bg-darkblue text-white py-2 px-4 rounded-full text-sm font-medium">100% Satisfação</div>
249
+ </div>
250
+ </div>
251
+ <div class="md:w-1/2 flex justify-center">
252
+ <div class="relative">
253
+ <img src="https://via.placeholder.com/500x350" alt="Equipe ThinkFlowBR" class="rounded-lg shadow-xl z-10 relative">
254
+ <div class="absolute -bottom-5 -right-5 bg-primary w-64 h-64 rounded-lg z-0"></div>
255
+ </div>
256
+ </div>
257
+ </div>
258
+ </div>
259
+ </section>
260
+
261
+ <!-- Portfolio Section -->
262
+ <section id="portfolio" class="py-16 bg-white">
263
+ <div class="container mx-auto px-4">
264
+ <div class="text-center mb-16">
265
+ <h2 class="text-3xl font-bold text-primary mb-4">Nossos Trabalhos</h2>
266
+ <p class="text-gray-600 max-w-2xl mx-auto">Alguns dos projetos recentes que realizamos para nossos clientes</p>
267
+ </div>
268
+
269
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
270
+ <div class="portfolio-item relative overflow-hidden rounded-lg shadow-md group">
271
+ <img src="https://via.placeholder.com/600x400" alt="Projeto 1" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
272
+ <div class="absolute inset-0 bg-gradient-to-t from-primary to-transparent opacity-0 group-hover:opacity-90 transition duration-500 flex items-end p-6">
273
+ <div>
274
+ <h3 class="text-white text-xl font-bold mb-2">Automação de Linha de Produção</h3>
275
+ <p class="text-white">Setor: Alimentício</p>
276
+ </div>
277
+ </div>
278
+ </div>
279
+
280
+ <div class="portfolio-item relative overflow-hidden rounded-lg shadow-md group">
281
+ <img src="https://via.placeholder.com/600x400" alt="Projeto 2" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
282
+ <div class="absolute inset-0 bg-gradient-to-t from-primary to-transparent opacity-0 group-hover:opacity-90 transition duration-500 flex items-end p-6">
283
+ <div>
284
+ <h3 class="text-white text-xl font-bold mb-2">Sistema SCADA Industrial</h3>
285
+ <p class="text-white">Setor: Químico</p>
286
+ </div>
287
+ </div>
288
+ </div>
289
+
290
+ <div class="portfolio-item relative overflow-hidden rounded-lg shadow-md group">
291
+ <img src="https://via.placeholder.com/600x400" alt="Projeto 3" class="w-full h-64 object-cover transition duration-500 group-hover:scale-110">
292
+ <div class="absolute inset-0 bg-gradient-to-t from-primary to-transparent opacity-0 group-hover:opacity-90 transition duration-500 flex items-end p-6">
293
+ <div>
294
+ <h3 class="text-white text-xl font-bold mb-2">Robótica para Montagem</h3>
295
+ <p class="text-white">Setor: Automotivo</p>
296
+ </div>
297
+ </div>
298
+ </div>
299
+ </div>
300
+
301
+ <div class="text-center mt-12">
302
+ <a href="#" class="inline-flex items-center text-accent font-medium">
303
+ Ver todos os projetos
304
+ <i class="fas fa-arrow-right ml-2"></i>
305
+ </a>
306
+ </div>
307
+ </div>
308
+ </section>
309
+
310
+ <!-- Testimonials Section -->
311
+ <section class="py-16 bg-primary text-white">
312
+ <div class="container mx-auto px-4">
313
+ <div class="text-center mb-16">
314
+ <h2 class="text-3xl font-bold mb-4">O que dizem nossos clientes</h2>
315
+ <p class="max-w-2xl mx-auto">Depoimentos de empresas que confiaram em nossas soluções</p>
316
+ </div>
317
+
318
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
319
+ <div class="bg-secondary p-8 rounded-lg">
320
+ <div class="flex items-center mb-4">
321
+ <img src="https://via.placeholder.com/50" alt="Cliente 1" class="rounded-full h-12 w-12 mr-4">
322
+ <div>
323
+ <h4 class="font-bold">Carlos Silva</h4>
324
+ <p class="text-accent text-sm">Eng. de Produção - Indústria ABC</p>
325
+ </div>
326
+ </div>
327
+ <p>"A ThinkFlowBR transformou nossa linha de produção com seu sistema de automação, aumentando nossa produtividade em 40%."</p>
328
+ <div class="flex mt-4 text-yellow-400">
329
+ <i class="fas fa-star"></i>
330
+ <i class="fas fa-star"></i>
331
+ <i class="fas fa-star"></i>
332
+ <i class="fas fa-star"></i>
333
+ <i class="fas fa-star"></i>
334
+ </div>
335
+ </div>
336
+
337
+ <div class="bg-secondary p-8 rounded-lg">
338
+ <div class="flex items-center mb-4">
339
+ <img src="https://via.placeholder.com/50" alt="Cliente 2" class="rounded-full h-12 w-12 mr-4">
340
+ <div>
341
+ <h4 class="font-bold">Ana Oliveira</h4>
342
+ <p class="text-accent text-sm">Diretora Industrial - Empresa XYZ</p>
343
+ </div>
344
+ </div>
345
+ <p>"O suporte técnico da ThinkFlowBR é excepcional. Resolvem qualquer problema rapidamente, garantindo a continuidade da nossa produção."</p>
346
+ <div class="flex mt-4 text-yellow-400">
347
+ <i class="fas fa-star"></i>
348
+ <i class="fas fa-star"></i>
349
+ <i class="fas fa-star"></i>
350
+ <i class="fas fa-star"></i>
351
+ <i class="fas fa-star"></i>
352
+ </div>
353
+ </div>
354
+
355
+ <div class="bg-secondary p-8 rounded-lg">
356
+ <div class="flex items-center mb-4">
357
+ <img src="https://via.placeholder.com/50" alt="Cliente 3" class="rounded-full h-12 w-12 mr-4">
358
+ <div>
359
+ <h4 class="font-bold">Roberto Santos</h4>
360
+ <p class="text-accent text-sm">Gerente Industrial - Grupo EFG</p>
361
+ </div>
362
+ </div>
363
+ <p>"Implementamos a solução de IoT industrial da ThinkFlowBR e agora temos controle total sobre nossos ativos, com dados em tempo real."</p>
364
+ <div class="flex mt-4 text-yellow-400">
365
+ <i class="fas fa-star"></i>
366
+ <i class="fas fa-star"></i>
367
+ <i class="fas fa-star"></i>
368
+ <i class="fas fa-star"></i>
369
+ <i class="fas fa-star"></i>
370
+ </div>
371
+ </div>
372
+ </div>
373
+ </div>
374
+ </section>
375
+
376
+ <!-- Contact Section -->
377
+ <section id="contact" class="py-16 bg-white">
378
+ <div class="container mx-auto px-4">
379
+ <div class="text-center mb-16">
380
+ <h2 class="text-3xl font-bold text-primary mb-4">Entre em Contato</h2>
381
+ <p class="text-gray-600 max-w-2xl mx-auto">Solicite um orçamento ou tire suas dúvidas sobre nossos serviços</p>
382
+ </div>
383
+
384
+ <div class="flex flex-col md:flex-row">
385
+ <div class="md:w-1/2 mb-10 md:mb-0 md:pr-10">
386
+ <h3 class="text-xl font-bold text-primary mb-6">Informações de Contato</h3>
387
+
388
+ <div class="flex items-start mb-6">
389
+ <div class="bg-accent text-white p-3 rounded-full mr-4">
390
+ <i class="fas fa-map-marker-alt"></i>
391
+ </div>
392
+ <div>
393
+ <h4 class="font-bold text-primary">Endereço</h4>
394
+ <p class="text-gray-600">Av. Industrial, 1234 - Sala 501<br>São Paulo/SP - CEP 00000-000</p>
395
+ </div>
396
+ </div>
397
+
398
+ <div class="flex items-start mb-6">
399
+ <div class="bg-accent text-white p-3 rounded-full mr-4">
400
+ <i class="fas fa-phone-alt"></i>
401
+ </div>
402
+ <div>
403
+ <h4 class="font-bold text-primary">Telefone</h4>
404
+ <p class="text-gray-600">(11) 9999-9999</p>
405
+ <p class="text-gray-600">(11) 8888-8888</p>
406
+ </div>
407
+ </div>
408
+
409
+ <div class="flex items-start mb-6">
410
+ <div class="bg-accent text-white p-3 rounded-full mr-4">
411
+ <i class="fas fa-envelope"></i>
412
+ </div>
413
+ <div>
414
+ <h4 class="font-bold text-primary">E-mail</h4>
415
+ <p class="text-gray-600">contato@thinkflowbr.com.br</p>
416
+ <p class="text-gray-600">comercial@thinkflowbr.com.br</p>
417
+ </div>
418
+ </div>
419
+
420
+ <h3 class="text-xl font-bold text-primary mb-4 mt-8">Siga-nos</h3>
421
+ <div class="flex space-x-4">
422
+ <a href="#" class="bg-primary hover:bg-darkblue text-white p-3 rounded-full transition duration-300">
423
+ <i class="fab fa-facebook-f"></i>
424
+ </a>
425
+ <a href="#" class="bg-primary hover:bg-darkblue text-white p-3 rounded-full transition duration-300">
426
+ <i class="fab fa-instagram"></i>
427
+ </a>
428
+ <a href="#" class="bg-primary hover:bg-darkblue text-white p-3 rounded-full transition duration-300">
429
+ <i class="fab fa-linkedin-in"></i>
430
+ </a>
431
+ <a href="#" class="bg-primary hover:bg-darkblue text-white p-3 rounded-full transition duration-300">
432
+ <i class="fab fa-youtube"></i>
433
+ </a>
434
+ </div>
435
+ </div>
436
+
437
+ <div class="md:w-1/2">
438
+ <form class="bg-gray-50 p-8 rounded-lg shadow-md">
439
+ <div class="mb-6">
440
+ <label for="name" class="block text-gray-700 font-medium mb-2">Seu Nome</label>
441
+ <input type="text" id="name" class="w-full px-4 py-3 rounded-lg border focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent" placeholder="Digite seu nome completo">
442
+ </div>
443
+
444
+ <div class="mb-6">
445
+ <label for="email" class="block text-gray-700 font-medium mb-2">Seu E-mail</label>
446
+ <input type="email" id="email" class="w-full px-4 py-3 rounded-lg border focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent" placeholder="Digite seu melhor e-mail">
447
+ </div>
448
+
449
+ <div class="mb-6">
450
+ <label for="phone" class="block text-gray-700 font-medium mb-2">Telefone</label>
451
+ <input type="tel" id="phone" class="w-full px-4 py-3 rounded-lg border focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent" placeholder="(00) 00000-0000">
452
+ </div>
453
+
454
+ <div class="mb-6">
455
+ <label for="service" class="block text-gray-700 font-medium mb-2">Serviço de Interesse</label>
456
+ <select id="service" class="w-full px-4 py-3 rounded-lg border focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent">
457
+ <option value="">Selecione um serviço</option>
458
+ <option value="controle">Sistemas de Controle</option>
459
+ <option value="robotica">Robótica Industrial</option>
460
+ <option value="redes">Redes Industriais</option>
461
+ <option value="iiot">IIoT (Indústria 4.0)</option>
462
+ <option value="manutencao">Manutenção Preditiva</option>
463
+ <option value="software">Desenvolvimento de Software</option>
464
+ </select>
465
+ </div>
466
+
467
+ <div class="mb-6">
468
+ <label for="message" class="block text-gray-700 font-medium mb-2">Mensagem</label>
469
+ <textarea id="message" rows="5" class="w-full px-4 py-3 rounded-lg border focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent" placeholder="Descreva brevemente sua necessidade"></textarea>
470
+ </div>
471
+
472
+ <button type="submit" class="w-full bg-accent hover:bg-blue-600 text-white font-bold py-3 px-4 rounded-lg transition duration-300">Enviar Mensagem</button>
473
+ </form>
474
+ </div>
475
+ </div>
476
+ </div>
477
+ </section>
478
+
479
+ <!-- Partners Section -->
480
+ <section class="py-12 bg-gray-50">
481
+ <div class="container mx-auto px-4">
482
+ <h3 class="text-center text-primary font-bold mb-8">Parceiros e Clientes</h3>
483
+ <div class="flex flex-wrap justify-center items-center gap-8 md:gap-16">
484
+ <img src="https://via.placeholder.com/150x80" alt="Parceiro 1" class="h-16 opacity-60 hover:opacity-100 transition duration-300">
485
+ <img src="https://via.placeholder.com/150x80" alt="Parceiro 2" class="h-16 opacity-60 hover:opacity-100 transition duration-300">
486
+ <img src="https://via.placeholder.com/150x80" alt="Parceiro 3" class="h-16 opacity-60 hover:opacity-100 transition duration-300">
487
+ <img src="https://via.placeholder.com/150x80" alt="Parceiro 4" class="h-16 opacity-60 hover:opacity-100 transition duration-300">
488
+ <img src="https://via.placeholder.com/150x80" alt="Parceiro 5" class="h-16 opacity-60 hover:opacity-100 transition duration-300">
489
+ </div>
490
+ </div>
491
+ </section>
492
+
493
+ <!-- Footer -->
494
+ <footer class="bg-primary text-white py-12">
495
+ <div class="container mx-auto px-4">
496
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
497
+ <div>
498
+ <div class="flex items-center mb-4">
499
+ <img src="https://via.placeholder.com/40" alt="ThinkFlowBR Logo" class="h-8 w-8 mr-2">
500
+ <span class="text-xl font-bold">Think<span class="text-accent">Flow</span>BR</span>
501
+ </div>
502
+ <p class="text-gray-300">Soluções em automação industrial para otimizar seus processos e aumentar sua produtividade.</p>
503
+ </div>
504
+
505
+ <div>
506
+ <h4 class="text-lg font-bold mb-4">Links Rápidos</h4>
507
+ <ul class="space-y-2">
508
+ <li><a href="#home" class="text-gray-300 hover:text-accent transition duration-300">Início</a></li>
509
+ <li><a href="#services" class="text-gray-300 hover:text-accent transition duration-300">Serviços</a></li>
510
+ <li><a href="#about" class="text-gray-300 hover:text-accent transition duration-300">Sobre Nós</a></li>
511
+ <li><a href="#portfolio" class="text-gray-300 hover:text-accent transition duration-300">Portfólio</a></li>
512
+ <li><a href="#contact" class="text-gray-300 hover:text-accent transition duration-300">Contato</a></li>
513
+ </ul>
514
+ </div>
515
+
516
+ <div>
517
+ <h4 class="text-lg font-bold mb-4">Serviços</h4>
518
+ <ul class="space-y-2">
519
+ <li><a href="#" class="text-gray-300 hover:text-accent transition duration-300">Sistemas de Controle</a></li>
520
+ <li><a href="#" class="text-gray-300 hover:text-accent transition duration-300">Robótica Industrial</a></li>
521
+ <li><a href="#" class="text-gray-300 hover:text-accent transition duration-300">Redes Industriais</a></li>
522
+ <li><a href="#" class="text-gray-300 hover:text-accent transition duration-300">IIoT (Indústria 4.0)</a></li>
523
+ <li><a href="#" class="text-gray-300 hover:text-accent transition duration-300">Manutenção Preditiva</a></li>
524
+ </ul>
525
+ </div>
526
+
527
+ <div>
528
+ <h4 class="text-lg font-bold mb-4">Newsletter</h4>
529
+ <p class="text-gray-300 mb-4">Assine nossa newsletter para receber novidades e conteúdos exclusivos.</p>
530
+ <form class="flex">
531
+ <input type="email" placeholder="Seu e-mail" class="px-4 py-2 rounded-l-lg focus:outline-none text-gray-800 w-full">
532
+ <button type="submit" class="bg-accent hover:bg-blue-600 px-4 py-2 rounded-r-lg transition duration-300">
533
+ <i class="fas fa-paper-plane"></i>
534
+ </button>
535
+ </form>
536
+ </div>
537
+ </div>
538
+
539
+ <div class="border-t border-gray-700 mt-8 pt-8 text-center md:text-left md:flex md:justify-between">
540
+ <p class="text-gray-300 mb-2 md:mb-0">© 2023 ThinkFlowBR. Todos os direitos reservados.</p>
541
+ <div class="flex justify-center md:justify-start space-x-6">
542
+ <a href="#" class="text-gray-300 hover:text-accent transition duration-300">Termos de Serviço</a>
543
+ <a href="#" class="text-gray-300 hover:text-accent transition duration-300">Política de Privacidade</a>
544
+ </div>
545
+ </div>
546
+ </div>
547
+ </footer>
548
+
549
+ <!-- Back to Top Button -->
550
+ <button id="back-to-top" class="fixed bottom-6 right-6 bg-accent text-white p-3 rounded-full shadow-lg opacity-0 invisible transition-all duration-300">
551
+ <i class="fas fa-arrow-up"></i>
552
+ </button>
553
+
554
+ <script>
555
+ // Mobile Menu Toggle
556
+ const mobileMenuButton = document.getElementById('mobile-menu-button');
557
+ const mobileMenu = document.getElementById('mobile-menu');
558
+
559
+ mobileMenuButton.addEventListener('click', () => {
560
+ mobileMenu.classList.toggle('hidden');
561
+ });
562
+
563
+ // Smooth Scrolling for Navigation Links
564
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
565
+ anchor.addEventListener('click', function (e) {
566
+ e.preventDefault();
567
+
568
+ if(this.getAttribute('href') === '#') return;
569
+
570
+ const target = document.querySelector(this.getAttribute('href'));
571
+ if(target) {
572
+ target.scrollIntoView({
573
+ behavior: 'smooth'
574
+ });
575
+
576
+ // Close mobile menu if open
577
+ if(!mobileMenu.classList.contains('hidden')) {
578
+ mobileMenu.classList.add('hidden');
579
+ }
580
+ }
581
+ });
582
+ });
583
+
584
+ // Back to Top Button
585
+ const backToTopButton = document.getElementById('back-to-top');
586
+
587
+ window.addEventListener('scroll', () => {
588
+ if (window.pageYOffset > 300) {
589
+ backToTopButton.classList.remove('opacity-0', 'invisible');
590
+ backToTopButton.classList.add('opacity-100', 'visible');
591
+ } else {
592
+ backToTopButton.classList.remove('opacity-100', 'visible');
593
+ backToTopButton.classList.add('opacity-0', 'invisible');
594
+ }
595
+ });
596
+
597
+ backToTopButton.addEventListener('click', () => {
598
+ window.scrollTo({
599
+ top: 0,
600
+ behavior: 'smooth'
601
+ });
602
+ });
603
+ </script>
604
+ <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=pedrofarini/thinkflowbr" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
605
+ </html>
prompts.txt ADDED
File without changes