Hugging Face's logo

Spaces:
LIMATEC
/
nexafiber
Running

App Files Community
LIMATEC commited on
Commit
ef47341
·
verified ·
1 Parent(s): 23dc26b

undefined - Initial Deployment

Browse files
Files changed (3) hide show
  1. README.md +6 -4
  2. index.html +710 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Nexafiber
3
- emoji: 💻
4
- colorFrom: indigo
5
  colorTo: red
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: nexafiber
3
+ emoji: 🐳
4
+ colorFrom: red
5
  colorTo: red
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,710 @@
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>NexaFiber - Internet de alta velocidade</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
+ <style>
11
+ body {
12
+ font-family: 'Poppins', sans-serif;
13
+ scroll-behavior: smooth;
14
+ }
15
+ .carousel-item {
16
+ display: none;
17
+ transition: opacity 1s ease;
18
+ }
19
+ .carousel-item.active {
20
+ display: block;
21
+ opacity: 1;
22
+ }
23
+ .contact-popup {
24
+ display: none;
25
+ animation: fadeIn 0.3s;
26
+ }
27
+ @keyframes fadeIn {
28
+ from {opacity: 0;}
29
+ to {opacity: 1;}
30
+ }
31
+ </style>
32
+ </head>
33
+ <body class="bg-gray-50">
34
+ <!-- Header/Navigation -->
35
+ <header class="bg-blue-900 text-white sticky top-0 z-50 shadow-lg">
36
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
37
+ <!-- Logo -->
38
+ <div class="flex items-center">
39
+ <div class="w-12 h-12 bg-white rounded-full flex items-center justify-center mr-3">
40
+ <span class="text-blue-900 font-bold text-xl">NF</span>
41
+ </div>
42
+ <h1 class="text-xl font-bold">Nexa<span class="text-green-400">Fiber</span></h1>
43
+ </div>
44
+
45
+ <!-- Desktop Navigation -->
46
+ <nav class="hidden md:flex items-center space-x-8">
47
+ <a href="#home" class="hover:text-green-400 transition">Início</a>
48
+ <a href="#plans" class="hover:text-green-400 transition">Planos</a>
49
+ <a href="#" class="hover:text-green-400 transition">2ª via de boleto</a>
50
+ <a href="#" class="hover:text-green-400 transition">Central do Assinante</a>
51
+
52
+ <div class="flex items-center space-x-6">
53
+ <button id="contactBtn" class="flex items-center text-sm hover:text-green-400 transition">
54
+ <i class="fas fa-envelope mr-2"></i> Fale Conosco
55
+ </button>
56
+
57
+ <div class="flex items-center">
58
+ <i class="fas fa-phone-alt mr-2"></i>
59
+ <span>(99) 9999-9999</span>
60
+ </div>
61
+
62
+ <div class="flex items-center space-x-3">
63
+ <span class="text-sm hidden lg:inline">Siga a NexaFiber</span>
64
+ <a href="#" class="hover:text-green-400 transition"><i class="fab fa-facebook-f"></i></a>
65
+ <a href="#" class="hover:text-green-400 transition"><i class="fab fa-instagram"></i></a>
66
+ <a href="#" class="hover:text-green-400 transition"><i class="fab fa-whatsapp"></i></a>
67
+ </div>
68
+ </div>
69
+ </nav>
70
+
71
+ <!-- Mobile Menu Button -->
72
+ <button id="mobileMenuBtn" class="md:hidden focus:outline-none">
73
+ <i class="fas fa-bars text-2xl"></i>
74
+ </button>
75
+ </div>
76
+
77
+ <!-- Mobile Navigation -->
78
+ <div id="mobileMenu" class="md:hidden hidden bg-blue-800 pb-4">
79
+ <div class="container mx-auto px-4 flex flex-col space-y-3">
80
+ <a href="#home" class="py-2 hover:text-green-400 transition">Início</a>
81
+ <a href="#plans" class="py-2 hover:text-green-400 transition">Planos</a>
82
+ <a href="#" class="py-2 hover:text-green-400 transition">2ª via de boleto</a>
83
+ <a href="#" class="py-2 hover:text-green-400 transition">Central do Assinante</a>
84
+ <button id="contactBtnMobile" class="py-2 flex items-center hover:text-green-400 transition">
85
+ <i class="fas fa-envelope mr-2"></i> Fale Conosco
86
+ </button>
87
+ <div class="py-2 flex items-center">
88
+ <i class="fas fa-phone-alt mr-2"></i>
89
+ <span>(99) 9999-9999</span>
90
+ </div>
91
+ <div class="py-2 flex items-center space-x-4">
92
+ <span>Siga a NexaFiber</span>
93
+ <a href="#" class="hover:text-green-400 transition"><i class="fab fa-facebook-f"></i></a>
94
+ <a href="#" class="hover:text-green-400 transition"><i class="fab fa-instagram"></i></a>
95
+ <a href="#" class="hover:text-green-400 transition"><i class="fab fa-whatsapp"></i></a>
96
+ </div>
97
+ </div>
98
+ </div>
99
+ </header>
100
+
101
+ <!-- Hero Carousel -->
102
+ <section id="home" class="relative overflow-hidden">
103
+ <div class="carousel">
104
+ <!-- Slide 1 -->
105
+ <div class="carousel-item active relative">
106
+ <div class="h-96 md:h-screen max-h-[700px] bg-gradient-to-r from-blue-900 to-blue-700 flex items-center justify-center">
107
+ <div class="absolute inset-0 bg-black opacity-30"></div>
108
+ <div class="container mx-auto px-4 relative z-10 text-center text-white">
109
+ <h2 class="text-3xl md:text-5xl font-bold mb-4">Conectando o seu mundo com velocidade e confiança</h2>
110
+ <p class="text-xl mb-8">Internet de altíssima velocidade com a tecnologia mais avançada</p>
111
+ <a href="#plans" class="bg-green-500 hover:bg-green-600 text-white font-bold py-3 px-8 rounded-full transition duration-300 inline-block">
112
+ Assine Agora
113
+ </a>
114
+ </div>
115
+ </div>
116
+ </div>
117
+
118
+ <!-- Slide 2 -->
119
+ <div class="carousel-item relative">
120
+ <div class="h-96 md:h-screen max-h-[700px] bg-gradient-to-r from-blue-800 to-blue-600 flex items-center justify-center">
121
+ <div class="absolute inset-0 bg-black opacity-30"></div>
122
+ <div class="container mx-auto px-4 relative z-10 text-center text-white">
123
+ <h2 class="text-3xl md:text-5xl font-bold mb-4">Combo Internet + TV por assinatura</h2>
124
+ <p class="text-xl mb-8">Todos os canais que sua família adora + Internet ultrarrápida</p>
125
+ <a href="#plans" class="bg-green-500 hover:bg-green-600 text-white font-bold py-3 px-8 rounded-full transition duration-300 inline-block">
126
+ Conheça os planos
127
+ </a>
128
+ </div>
129
+ </div>
130
+ </div>
131
+
132
+ <!-- Slide 3 -->
133
+ <div class="carousel-item relative">
134
+ <div class="h-96 md:h-screen max-h-[700px] bg-gradient-to-r from-blue-900 to-blue-700 flex items-center justify-center">
135
+ <div class="absolute inset-0 bg-black opacity-30"></div>
136
+ <div class="container mx-auto px-4 relative z-10 text-center text-white">
137
+ <h2 class="text-3xl md:text-5xl font-bold mb-4">Instalação grátis e Wi-Fi incluído</h2>
138
+ <p class="text-xl mb-8">Leve a NexaFiber para sua casa sem custo adicional</p>
139
+ <a href="#plans" class="bg-green-500 hover:bg-green-600 text-white font-bold py-3 px-8 rounded-full transition duration-300 inline-block">
140
+ Saiba mais
141
+ </a>
142
+ </div>
143
+ </div>
144
+ </div>
145
+
146
+ <!-- Slide 4 -->
147
+ <div class="carousel-item relative">
148
+ <div class="h-96 md:h-screen max-h-[700px] bg-gradient-to-r from-blue-800 to-blue-600 flex items-center justify-center">
149
+ <div class="absolute inset-0 bg-black opacity-30"></div>
150
+ <div class="container mx-auto px-4 relative z-10 text-center text-white">
151
+ <h2 class="text-3xl md:text-5xl font-bold mb-4">Planos empresariais com suporte dedicado</h2>
152
+ <p class="text-xl mb-8">Garanta a melhor conexão para seu negócio</p>
153
+ <a href="#plans" class="bg-green-500 hover:bg-green-600 text-white font-bold py-3 px-8 rounded-full transition duration-300 inline-block">
154
+ Para empresas
155
+ </a>
156
+ </div>
157
+ </div>
158
+ </div>
159
+ </div>
160
+
161
+ <!-- Carousel Controls -->
162
+ <button id="prevBtn" class="absolute left-4 top-1/2 transform -translate-y-1/2 bg-white bg-opacity-30 text-white rounded-full p-2 z-10 hover:bg-opacity-50 transition">
163
+ <i class="fas fa-chevron-left"></i>
164
+ </button>
165
+ <button id="nextBtn" class="absolute right-4 top-1/2 transform -translate-y-1/2 bg-white bg-opacity-30 text-white rounded-full p-2 z-10 hover:bg-opacity-50 transition">
166
+ <i class="fas fa-chevron-right"></i>
167
+ </button>
168
+
169
+ <!-- Carousel Indicators -->
170
+ <div class="absolute bottom-4 left-0 right-0 flex justify-center space-x-2 z-10">
171
+ <button class="carousel-indicator w-3 h-3 rounded-full bg-white bg-opacity-50 hover:bg-opacity-100 transition" data-index="0"></button>
172
+ <button class="carousel-indicator w-3 h-3 rounded-full bg-white bg-opacity-50 hover:bg-opacity-100 transition" data-index="1"></button>
173
+ <button class="carousel-indicator w-3 h-3 rounded-full bg-white bg-opacity-50 hover:bg-opacity-100 transition" data-index="2"></button>
174
+ <button class="carousel-indicator w-3 h-3 rounded-full bg-white bg-opacity-50 hover:bg-opacity-100 transition" data-index="3"></button>
175
+ </div>
176
+ </section>
177
+
178
+ <!-- Features Section -->
179
+ <section class="py-16 bg-white">
180
+ <div class="container mx-auto px-4">
181
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
182
+ <!-- Feature 1 -->
183
+ <div class="text-center px-4">
184
+ <div class="bg-blue-100 w-20 h-20 rounded-full flex items-center justify-center mx-auto mb-4">
185
+ <i class="fas fa-bolt text-blue-700 text-2xl"></i>
186
+ </div>
187
+ <h3 class="text-xl font-bold mb-2">Velocidade garantida</h3>
188
+ <p class="text-gray-600">Internet de alta velocidade sem lentidão mesmo nos horários de pico.</p>
189
+ </div>
190
+
191
+ <!-- Feature 2 -->
192
+ <div class="text-center px-4">
193
+ <div class="bg-blue-100 w-20 h-20 rounded-full flex items-center justify-center mx-auto mb-4">
194
+ <i class="fas fa-headset text-blue-700 text-2xl"></i>
195
+ </div>
196
+ <h3 class="text-xl font-bold mb-2">Suporte 24/7</h3>
197
+ <p class="text-gray-600">Atendimento especializado a qualquer hora do dia ou noite.</p>
198
+ </div>
199
+
200
+ <!-- Feature 3 -->
201
+ <div class="text-center px-4">
202
+ <div class="bg-blue-100 w-20 h-20 rounded-full flex items-center justify-center mx-auto mb-4">
203
+ <i class="fas fa-wifi text-blue-700 text-2xl"></i>
204
+ </div>
205
+ <h3 class="text-xl font-bold mb-2">Wi-Fi grátis</h3>
206
+ <p class="text-gray-600">Roteador de alta qualidade incluso para melhor cobertura em sua casa.</p>
207
+ </div>
208
+
209
+ <!-- Feature 4 -->
210
+ <div class="text-center px-4">
211
+ <div class="bg-blue-100 w-20 h-20 rounded-full flex items-center justify-center mx-auto mb-4">
212
+ <i class="fas fa-tools text-blue-700 text-2xl"></i>
213
+ </div>
214
+ <h3 class="text-xl font-bold mb-2">Instalação rápida</h3>
215
+ <p class="text-gray-600">Agende sua instalação e nossa equipe estará no local no horário marcado.</p>
216
+ </div>
217
+ </div>
218
+ </div>
219
+ </section>
220
+
221
+ <!-- Plans Section -->
222
+ <section id="plans" class="py-16 bg-gray-50">
223
+ <div class="container mx-auto px-4">
224
+ <div class="text-center mb-12">
225
+ <h2 class="text-3xl font-bold text-blue-900 mb-4">Nossos Planos</h2>
226
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Escolha o plano perfeito para sua casa ou empresa com a melhor relação custo-benefício do mercado</p>
227
+ </div>
228
+
229
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 max-w-5xl mx-auto">
230
+ <!-- Plan 1 -->
231
+ <div class="bg-white rounded-lg shadow-lg overflow-hidden transition-transform hover:scale-105">
232
+ <div class="bg-blue-900 text-white py-4 px-6">
233
+ <h3 class="text-xl font-bold">Fibra 200MB</h3>
234
+ <p class="text-blue-200">Ideal para famílias</p>
235
+ </div>
236
+ <div class="p-6">
237
+ <div class="text-4xl font-bold text-blue-900 mb-4">R$ 99<span class="text-lg">,90/mês</span></div>
238
+ <ul class="space-y-3 mb-6">
239
+ <li class="flex items-start">
240
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
241
+ <span>200 Megabits de velocidade</span>
242
+ </li>
243
+ <li class="flex items-start">
244
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
245
+ <span>Wi-Fi grátis</span>
246
+ </li>
247
+ <li class="flex items-start">
248
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
249
+ <span>Instalação sem custo</span>
250
+ </li>
251
+ <li class="flex items-start">
252
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
253
+ <span>Suporte 24 horas</span>
254
+ </li>
255
+ </ul>
256
+ <button class="w-full bg-green-500 hover:bg-green-600 text-white font-bold py-3 px-4 rounded transition duration-300">
257
+ Assinar agora
258
+ </button>
259
+ </div>
260
+ </div>
261
+
262
+ <!-- Plan 2 (Featured) -->
263
+ <div class="bg-white rounded-lg shadow-xl overflow-hidden transform scale-105 relative">
264
+ <div class="absolute top-0 right-0 bg-green-500 text-white px-3 py-1 transform rotate-45 translate-x-6 -translate-y-2 text-xs font-bold">
265
+ MAIS POPULAR
266
+ </div>
267
+ <div class="bg-blue-700 text-white py-4 px-6">
268
+ <h3 class="text-xl font-bold">Combo Família</h3>
269
+ <p class="text-blue-200">Internet + TV + Telefone</p>
270
+ </div>
271
+ <div class="p-6">
272
+ <div class="text-4xl font-bold text-blue-900 mb-4">R$ 149<span class="text-lg">,90/mês</span></div>
273
+ <ul class="space-y-3 mb-6">
274
+ <li class="flex items-start">
275
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
276
+ <span>300 Megabits de velocidade</span>
277
+ </li>
278
+ <li class="flex items-start">
279
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
280
+ <span>120 canais HD</span>
281
+ </li>
282
+ <li class="flex items-start">
283
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
284
+ <span>Wi-Fi grátis + roteador premium</span>
285
+ </li>
286
+ <li class="flex items-start">
287
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
288
+ <span>Ligações ilimitadas</span>
289
+ </li>
290
+ </ul>
291
+ <button class="w-full bg-green-500 hover:bg-green-600 text-white font-bold py-3 px-4 rounded transition duration-300">
292
+ Assinar agora
293
+ </button>
294
+ </div>
295
+ </div>
296
+
297
+ <!-- Plan 3 -->
298
+ <div class="bg-white rounded-lg shadow-lg overflow-hidden transition-transform hover:scale-105">
299
+ <div class="bg-blue-900 text-white py-4 px-6">
300
+ <h3 class="text-xl font-bold">Fibra 1GB</h3>
301
+ <p class="text-blue-200">Para gamers e power users</p>
302
+ </div>
303
+ <div class="p-6">
304
+ <div class="text-4xl font-bold text-blue-900 mb-4">R$ 299<span class="text-lg">,90/mês</span></div>
305
+ <ul class="space-y-3 mb-6">
306
+ <li class="flex items-start">
307
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
308
+ <span>1 Gigabit de velocidade</span>
309
+ </li>
310
+ <li class="flex items-start">
311
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
312
+ <span>Wi-Fi 6 grátis</span>
313
+ </li>
314
+ <li class="flex items-start">
315
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
316
+ <span>Prioridade no suporte</span>
317
+ </li>
318
+ <li class="flex items-start">
319
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
320
+ <span>Equipamento premium</span>
321
+ </li>
322
+ </ul>
323
+ <button class="w-full bg-green-500 hover:bg-green-600 text-white font-bold py-3 px-4 rounded transition duration-300">
324
+ Assinar agora
325
+ </button>
326
+ </div>
327
+ </div>
328
+ </div>
329
+
330
+ <!-- Business Plan -->
331
+ <div class="mt-16 max-w-4xl mx-auto bg-white rounded-xl shadow-lg overflow-hidden">
332
+ <div class="md:flex">
333
+ <div class="md:w-2/3 p—6 md:p-8">
334
+ <h3 class="text-2xl font-bold text-blue-900 mb-2">Planos Empresariais</h3>
335
+ <p class="text-gray-600 mb-4">Soluções personalizadas para empresas de todos os tamanhos com conexão dedicada e SLA garantido.</p>
336
+ <ul class="space-y-2 mb-6">
337
+ <li class="flex items-start">
338
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
339
+ <span>Link dedicado de 100Mbps a 10Gbps</span>
340
+ </li>
341
+ <li class="flex items-start">
342
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
343
+ <span>Suporte técnico prioritário</span>
344
+ </li>
345
+ <li class="flex items-start">
346
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
347
+ <span>IP Fixo incluso</span>
348
+ </li>
349
+ <li class="flex items-start">
350
+ <i class="fas fa-check text-green-500 mr-2 mt-1"></i>
351
+ <span>99.9% de disponibilidade garantida</span>
352
+ </li>
353
+ </ul>
354
+ <button class="bg-blue-700 hover:bg-blue-800 text-white font-bold py-3 px-8 rounded-full transition duration-300 inline-flex items-center">
355
+ Falar com consultor <i class="fas fa-arrow-right ml-2"></i>
356
+ </button>
357
+ </div>
358
+ <div class="hidden md:block md:w-1/3 bg-gradient-to-b from-blue-800 to-blue-600"></div>
359
+ </div>
360
+ </div>
361
+ </div>
362
+ </section>
363
+
364
+ <!-- Testimonials Section -->
365
+ <section class="py-16 bg-blue-900 text-white">
366
+ <div class="container mx-auto px-4">
367
+ <div class="text-center mb-12">
368
+ <h2 class="text-3xl font-bold mb-4">O que dizem nossos clientes</h2>
369
+ <p class="text-xl text-blue-200 max-w-3xl mx-auto">Milhares de clientes satisfeitos em todo o país</p>
370
+ </div>
371
+
372
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
373
+ <!-- Testimonial 1 -->
374
+ <div class="bg-blue-800 rounded-lg p-6 shadow-lg">
375
+ <div class="flex items-center mb-4">
376
+ <div class="w-12 h-12 rounded-full bg-blue-700 flex items-center justify-center text-xl font-bold mr-4">AJ</div>
377
+ <div>
378
+ <h4 class="font-bold">Ana Júlia</h4>
379
+ <div class="flex text-yellow-400">
380
+ <i class="fas fa-star"></i>
381
+ <i class="fas fa-star"></i>
382
+ <i class="fas fa-star"></i>
383
+ <i class="fas fa-star"></i>
384
+ <i class="fas fa-star"></i>
385
+ </div>
386
+ </div>
387
+ </div>
388
+ <p class="text-blue-100">"Depois de anos com Internet lenta, finalmente resolvi contratar a NexaFiber. A diferença é absurda! Consigo trabalhar em casa sem preocupações e meus filhos podem assistir streaming sem travar."</p>
389
+ </div>
390
+
391
+ <!-- Testimonial 2 -->
392
+ <div class="bg-blue-800 rounded-lg p-6 shadow-lg">
393
+ <div class="flex items-center mb-4">
394
+ <div class="w-12 h-12 rounded-full bg-blue-700 flex items-center justify-center text-xl font-bold mr-4">CM</div>
395
+ <div>
396
+ <h4 class="font-bold">Carlos Martins</h4>
397
+ <div class="flex text-yellow-400">
398
+ <i class="fas fa-star"></i>
399
+ <i class="fas fa-star"></i>
400
+ <i class="fas fa-star"></i>
401
+ <i class="fas fa-star"></i>
402
+ <i class="fas fa-star"></i>
403
+ </div>
404
+ </div>
405
+ </div>
406
+ <p class="text-blue-100">"O suporte da NexaFiber é incrível! Quando tive um problema, eles resolveram rapidamente e ainda me explicaram como evitar no futuro. A velocidade é consistente e nunca tenho quedas."</p>
407
+ </div>
408
+
409
+ <!-- Testimonial 3 -->
410
+ <div class="bg-blue-800 rounded-lg p-6 shadow-lg">
411
+ <div class="flex items-center mb-4">
412
+ <div class="w-12 h-12 rounded-full bg-blue-700 flex items-center justify-center text-xl font-bold mr-4">LS</div>
413
+ <div>
414
+ <h4 class="font-bold">Lívia Souza</h4>
415
+ <div class="flex text-yellow-400">
416
+ <i class="fas fa-star"></i>
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-half-alt"></i>
421
+ </div>
422
+ </div>
423
+ </div>
424
+ <p class="text-blue-100">"Contratei o combo família e estou adorando. Tenho internet rápida, TV com ótima programação e ainda economizei pelo pacote. A instalação foi super profissional e rápida."</p>
425
+ </div>
426
+ </div>
427
+ </div>
428
+ </section>
429
+
430
+ <!-- Coverage Section -->
431
+ <section class="py-16 bg-white">
432
+ <div class="container mx-auto px-4">
433
+ <div class="text-center mb-12">
434
+ <h2 class="text-3xl font-bold text-blue-900 mb-4">Nossa Cobertura</h2>
435
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Verifique se atendemos na sua região</p>
436
+ </div>
437
+
438
+ <div class="max-w-4xl mx-auto bg-gray-100 rounded-xl p-8">
439
+ <div class="md:flex items-center">
440
+ <div class="md:w-1/2 mb-6 md:mb-0">
441
+ <h3 class="text-xl font-bold text-blue-900 mb-2">Quer NexaFiber na sua casa?</h3>
442
+ <p class="text-gray-600 mb-4">Nosso serviço está disponível em diversas cidades e bairros. Consulte a disponibilidade na sua região:</p>
443
+
444
+ <form class="space-y-4">
445
+ <div>
446
+ <select class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500">
447
+ <option>Selecione sua cidade</option>
448
+ <option>São Paulo - SP</option>
449
+ <option>Rio de Janeiro - RJ</option>
450
+ <option>Belo Horizonte - MG</option>
451
+ <option>Curitiba - PR</option>
452
+ </select>
453
+ </div>
454
+ <div>
455
+ <input type="text" placeholder="Digite seu endereço" class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500">
456
+ </div>
457
+ <button class="w-full bg-green-500 hover:bg-green-600 text-white font-bold py-3 px-4 rounded transition duration-300">
458
+ Verificar disponibilidade
459
+ </button>
460
+ </form>
461
+ </div>
462
+ <div class="md:w-1/2 md:pl-8">
463
+ <div class="bg-gray-200 h-64 rounded-lg flex items-center justify-center text-gray-400">
464
+ [Mapa de Cobertura]
465
+ </div>
466
+ </div>
467
+ </div>
468
+ </div>
469
+ </div>
470
+ </section>
471
+
472
+ <!-- Contact Popup -->
473
+ <div id="contactPopup" class="contact-popup fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
474
+ <div class="bg-white rounded-lg shadow-xl max-w-md w-full p-6 relative">
475
+ <button id="closePopup" class="absolute top-4 right-4 text-gray-500 hover:text-gray-700">
476
+ <i class="fas fa-times"></i>
477
+ </button>
478
+
479
+ <h3 class="text-2xl font-bold text-blue-900 mb-4">Fale Conosco</h3>
480
+ <p class="text-gray-600 mb-6">Preencha o formulário abaixo e nossa equipe entrará em contato em breve.</p>
481
+
482
+ <form id="contactForm" class="space-y-4">
483
+ <div>
484
+ <label for="name" class="block text-gray-700 mb-2">Seu nome</label>
485
+ <input type="text" id="name" class="w-full px-4 py-2 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500" required>
486
+ </div>
487
+ <div>
488
+ <label for="email" class="block text-gray-700 mb-2">E-mail</label>
489
+ <input type="email" id="email" class="w-full px-4 py-2 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500" required>
490
+ </div>
491
+ <div>
492
+ <label for="phone" class="block text-gray-700 mb-2">Telefone</label>
493
+ <input type="tel" id="phone" class="w-full px-4 py-2 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500" required>
494
+ </div>
495
+ <div>
496
+ <label for="message" class="block text-gray-700 mb-2">Mensagem</label>
497
+ <textarea id="message" rows="4" class="w-full px-4 py-2 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500" required></textarea>
498
+ </div>
499
+ <button type="submit" class="w-full bg-green-500 hover:bg-green-600 text-white font-bold py-3 px-4 rounded transition duration-300">
500
+ Enviar mensagem
501
+ </button>
502
+ </form>
503
+ </div>
504
+ </div>
505
+
506
+ <!-- Footer -->
507
+ <footer class="bg-blue-900 text-white pt-16 pb-8">
508
+ <div class="container mx-auto px-4">
509
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
510
+ <!-- Logo & About -->
511
+ <div>
512
+ <div class="flex items-center mb-4">
513
+ <div class="w-10 h-10 bg-white rounded-full flex items-center justify-center mr-3">
514
+ <span class="text-blue-900 font-bold">NF</span>
515
+ </div>
516
+ <h3 class="text-xl font-bold">Nexa<span class="text-green-400">Fiber</span></h3>
517
+ </div>
518
+ <p class="text-blue-200 mb-4">A melhor internet em fibra óptica do Brasil, levando conexão de alta qualidade para sua casa e empresa.</p>
519
+ <div class="flex space-x-4">
520
+ <a href="#" class="hover:text-green-400 transition"><i class="fab fa-facebook-f"></i></a>
521
+ <a href="#" class="hover:text-green-400 transition"><i class="fab fa-instagram"></i></a>
522
+ <a href="#" class="hover:text-green-400 transition"><i class="fab fa-whatsapp"></i></a>
523
+ </div>
524
+ </div>
525
+
526
+ <!-- Links -->
527
+ <div>
528
+ <h4 class="text-lg font-bold mb-4">Links Úteis</h4>
529
+ <ul class="space-y-2">
530
+ <li><a href="#home" class="hover:text-green-400 transition">Início</a></li>
531
+ <li><a href="#plans" class="hover:text-green-400 transition">Planos</a></li>
532
+ <li><a href="#" class="hover:text-green-400 transition">2ª Via de Boleto</a></li>
533
+ <li><a href="#" class="hover:text-green-400 transition">Central do Assinante</a></li>
534
+ <li><a href="#" class="hover:text-green-400 transition">Área de Cobertura</a></li>
535
+ </ul>
536
+ </div>
537
+
538
+ <!-- Support -->
539
+ <div>
540
+ <h4 class="text-lg font-bold mb-4">Suporte</h4>
541
+ <ul class="space-y-2">
542
+ <li><a href="#" class="hover:text-green-400 transition">Perguntas Frequentes</a></li>
543
+ <li><a href="#" class="hover:text-green-400 transition">Tutoriais</a></li>
544
+ <li><a href="#" class="hover:text-green-400 transition">Status da Rede</a></li>
545
+ <li><a href="#" class="hover:text-green-400 transition">Abertura de Chamado</a></li>
546
+ </ul>
547
+ </div>
548
+
549
+ <!-- Contact -->
550
+ <div>
551
+ <h4 class="text-lg font-bold mb-4">Contato</h4>
552
+ <ul class="space-y-3">
553
+ <li class="flex items-start">
554
+ <i class="fas fa-phone-alt text-green-400 mr-2 mt-1"></i>
555
+ <span>(99) 9999-9999</span>
556
+ </li>
557
+ <li class="flex items-start">
558
+ <i class="fas fa-envelope text-green-400 mr-2 mt-1"></i>
559
+ <span>contato@nexafiber.com.br</span>
560
+ </li>
561
+ <li class="flex items-start">
562
+ <i class="fas fa-map-marker-alt text-green-400 mr-2 mt-1"></i>
563
+ <span>Av. Paulista, 1000<br>São Paulo - SP</span>
564
+ </li>
565
+ </ul>
566
+ </div>
567
+ </div>
568
+
569
+ <!-- Copyright -->
570
+ <div class="border-t border-blue-800 mt-12 pt-6 text-center text-blue-200">
571
+ <p>Todos os direitos reservados © NexaFiber <span id="year"></span>. Proibida reprodução total ou parcial sem autorização.</p>
572
+ </div>
573
+ </div>
574
+ </footer>
575
+
576
+ <script>
577
+ // Mobile Menu Toggle
578
+ const mobileMenuBtn = document.getElementById('mobileMenuBtn');
579
+ const mobileMenu = document.getElementById('mobileMenu');
580
+
581
+ mobileMenuBtn.addEventListener('click', () => {
582
+ mobileMenu.classList.toggle('hidden');
583
+ });
584
+
585
+ // Contact Popup
586
+ const contactBtn = document.getElementById('contactBtn');
587
+ const contactBtnMobile = document.getElementById('contactBtnMobile');
588
+ const contactPopup = document.getElementById('contactPopup');
589
+ const closePopup = document.getElementById('closePopup');
590
+
591
+ function togglePopup() {
592
+ contactPopup.classList.toggle('hidden');
593
+ document.body.style.overflow = contactPopup.classList.contains('hidden') ? 'auto' : 'hidden';
594
+ }
595
+
596
+ contactBtn.addEventListener('click', togglePopup);
597
+ contactBtnMobile.addEventListener('click', togglePopup);
598
+ closePopup.addEventListener('click', togglePopup);
599
+ contactPopup.addEventListener('click', (e) => {
600
+ if (e.target === contactPopup) {
601
+ togglePopup();
602
+ }
603
+ });
604
+
605
+ // Contact Form Submission
606
+ const contactForm = document.getElementById('contactForm');
607
+ contactForm.addEventListener('submit', (e) => {
608
+ e.preventDefault();
609
+ alert('Mensagem enviada com sucesso! Em breve nossa equipe entrará em contato.');
610
+ contactForm.reset();
611
+ togglePopup();
612
+ });
613
+
614
+ // Carousel functionality
615
+ const carouselItems = document.querySelectorAll('.carousel-item');
616
+ const indicators = document.querySelectorAll('.carousel-indicator');
617
+ const prevBtn = document.getElementById('prevBtn');
618
+ const nextBtn = document.getElementById('nextBtn');
619
+ let currentIndex = 0;
620
+ let intervalId;
621
+
622
+ function showSlide(index) {
623
+ // Hide all slides
624
+ carouselItems.forEach(item => item.classList.remove('active'));
625
+ indicators.forEach(indicator => indicator.classList.remove('bg-opacity-100'));
626
+
627
+ // Show current slide
628
+ carouselItems[index].classList.add('active');
629
+ indicators[index].classList.add('bg-opacity-100');
630
+
631
+ currentIndex = index;
632
+ }
633
+
634
+ function nextSlide() {
635
+ let nextIndex = (currentIndex + 1) % carouselItems.length;
636
+ showSlide(nextIndex);
637
+ }
638
+
639
+ function prevSlide() {
640
+ let prevIndex = (currentIndex - 1 + carouselItems.length) % carouselItems.length;
641
+ showSlide(prevIndex);
642
+ }
643
+
644
+ // Initialize carousel
645
+ showSlide(0);
646
+
647
+ // Auto-rotate slides every 5 seconds
648
+ function startCarousel() {
649
+ intervalId = setInterval(nextSlide, 5000);
650
+ }
651
+
652
+ startCarousel();
653
+
654
+ // Pause carousel when hovered
655
+ const carousel = document.querySelector('.carousel');
656
+ carousel.addEventListener('mouseenter', () => {
657
+ clearInterval(intervalId);
658
+ });
659
+
660
+ carousel.addEventListener('mouseleave', startCarousel);
661
+
662
+ // Navigation controls
663
+ nextBtn.addEventListener('click', () => {
664
+ nextSlide();
665
+ clearInterval(intervalId);
666
+ startCarousel();
667
+ });
668
+
669
+ prevBtn.addEventListener('click', () => {
670
+ prevSlide();
671
+ clearInterval(intervalId);
672
+ startCarousel();
673
+ });
674
+
675
+ // Indicator controls
676
+ indicators.forEach((indicator, index) => {
677
+ indicator.addEventListener('click', () => {
678
+ showSlide(index);
679
+ clearInterval(intervalId);
680
+ startCarousel();
681
+ });
682
+ });
683
+
684
+ // Set current year in footer
685
+ document.getElementById('year').textContent = new Date().getFullYear();
686
+
687
+ // Smooth scrolling for anchor links
688
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
689
+ anchor.addEventListener('click', function (e) {
690
+ e.preventDefault();
691
+
692
+ const targetId = this.getAttribute('href');
693
+ if (targetId === '#') return;
694
+
695
+ const targetElement = document.querySelector(targetId);
696
+ if (targetElement) {
697
+ targetElement.scrollIntoView({
698
+ behavior: 'smooth'
699
+ });
700
+
701
+ // Close mobile menu if open
702
+ if (!mobileMenu.classList.contains('hidden')) {
703
+ mobileMenu.classList.add('hidden');
704
+ }
705
+ }
706
+ });
707
+ });
708
+ </script>
709
+ <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=LIMATEC/nexafiber" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
710
+ </html>
prompts.txt ADDED
File without changes