Hugging Face's logo

Spaces:
VedetteStore
/
versalabs2
Running

App Files Community
VedetteStore commited on
Commit
8329b52
路
verified 路
1 Parent(s): fd7e1ab

cambiar : Estudios de Caso por Casos de Estudio - Follow Up Deployment

Browse files
Files changed (3) hide show
  1. index-es.html +453 -0
  2. index.html +1 -3
  3. prompts.txt +3 -1
index-es.html ADDED
@@ -0,0 +1,453 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>VersaLabs - Agencia de IA</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
9
+ <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
10
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
11
+ <script src="https://unpkg.com/feather-icons"></script>
12
+ <link rel="preconnect" href="https://fonts.googleapis.com">
13
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
14
+ <link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;700&family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
15
+ <style>
16
+ body {
17
+ font-family: 'Outfit', sans-serif;
18
+ background-color: #f8fafc;
19
+ color: #0f172a;
20
+ transition: background-color 0.3s ease, color 0.3s ease;
21
+ }
22
+ body.dark {
23
+ background-color: #0f172a;
24
+ color: #f8fafc;
25
+ }
26
+ .dark .gradient-bg {
27
+ background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 50%, #a855f7 100%);
28
+ }
29
+ .dark .hero-text {
30
+ background-image: linear-gradient(90deg, #818cf8, #a78bfa);
31
+ }
32
+ .dark .bg-white {
33
+ background-color: #1e293b !important;
34
+ }
35
+ .dark .text-gray-900 {
36
+ color: #f8fafc !important;
37
+ }
38
+ .dark .text-gray-500 {
39
+ color: #94a3b8 !important;
40
+ }
41
+ .dark .text-gray-600 {
42
+ color: #cbd5e1 !important;
43
+ }
44
+ .dark .bg-gray-50 {
45
+ background-color: #1e293b !important;
46
+ }
47
+ .dark .border-gray-200 {
48
+ border-color: #334155 !important;
49
+ }
50
+ .gradient-bg {
51
+ background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #d946ef 100%);
52
+ }
53
+ .hero-text {
54
+ background-clip: text;
55
+ -webkit-background-clip: text;
56
+ color: transparent;
57
+ background-image: linear-gradient(90deg, #4f46e5, #9333ea);
58
+ }
59
+ </style>
60
+ </head>
61
+ <body class="min-h-screen">
62
+ <!-- Navigation -->
63
+ <nav class="bg-white/80 dark:bg-gray-900/80 backdrop-blur-md shadow-sm sticky top-0 z-50 transition-all duration-300">
64
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
65
+ <div class="flex justify-between h-16 items-center">
66
+ <div class="flex items-center">
67
+ <div class="flex-shrink-0 flex items-center">
68
+ <img class="h-8 w-auto" src="https://framerusercontent.com/images/t25w12kJO3xpUe3JdSybMTuinn8.png" alt="VersaLabs logo">
69
+ <span class="ml-2 text-xl font-bold text-gray-900">VersaLabs</span>
70
+ </div>
71
+ </div>
72
+ <div class="hidden md:block">
73
+ <div class="ml-10 flex items-center space-x-6">
74
+ <button id="language-toggle" class="text-gray-500 hover:text-gray-900 dark:hover:text-gray-100 transition-colors flex items-center">
75
+ <span class="mr-1">ESP</span>
76
+ <i data-feather="chevron-down" class="w-4 h-4"></i>
77
+ </button>
78
+ <button id="theme-toggle" class="text-gray-500 hover:text-gray-900 dark:hover:text-gray-100 transition-colors">
79
+ <i data-feather="moon" class="hidden dark:block w-5 h-5"></i>
80
+ <i data-feather="sun" class="dark:hidden w-5 h-5"></i>
81
+ </button>
82
+ <a href="#home" class="text-gray-900 px-3 py-2 rounded-md text-sm font-medium">Inicio</a>
83
+ <a href="#services" class="text-gray-500 hover:text-gray-900 px-3 py-2 rounded-md text-sm font-medium">Servicios</a>
84
+ <a href="#testimonials" class="text-gray-500 hover:text-gray-900 px-3 py-2 rounded-md text-sm font-medium">Estudios de Caso</a>
85
+ <a href="#about" class="text-gray-500 hover:text-gray-900 px-3 py-2 rounded-md text-sm font-medium">Acerca de</a>
86
+ <a href="#contact" class="text-gray-500 hover:text-gray-900 px-3 py-2 rounded-md text-sm font-medium">Contacto</a>
87
+ </div>
88
+ </div>
89
+ <div class="md:hidden">
90
+ <button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none">
91
+ <i data-feather="menu"></i>
92
+ </button>
93
+ </div>
94
+ </div>
95
+ </div>
96
+ </nav>
97
+
98
+ <!-- Hero Section -->
99
+ <section id="home" class="relative overflow-hidden">
100
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20 md:py-32">
101
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-12 items-center">
102
+ <div data-aos="fade-right">
103
+ <h1 class="text-4xl md:text-6xl font-bold leading-tight mb-6">
104
+ <span class="hero-text">Transformaci贸n</span><br>
105
+ Digital con IA
106
+ </h1>
107
+ <p class="text-lg text-gray-600 mb-8 max-w-lg">
108
+ VersaLabs es una firma l铆der en consultor铆a de IA que ofrece soluciones automatizadas con inteligencia artificial, desarrollo web y soluciones de comercio electr贸nico. Con 15 a帽os de experiencia, nuestros expertos en Shopify optimizan flujos de trabajo y aumentan ingresos.
109
+ </p>
110
+ <div class="flex flex-wrap gap-4">
111
+ <a href="#" class="px-8 py-3 rounded-lg gradient-bg text-white font-medium shadow-lg hover:shadow-xl transition duration-300">
112
+ Comenzar
113
+ </a>
114
+ <a href="#" class="px-8 py-3 rounded-lg bg-white text-indigo-600 font-medium border border-indigo-200 hover:bg-indigo-50 transition duration-300">
115
+ Saber M谩s
116
+ </a>
117
+ </div>
118
+ </div>
119
+ <div data-aos="fade-left">
120
+ <img src="https://framerusercontent.com/images/wk45EXrwdvDOVPbrteiUP4meKk.png" alt="Tecnolog铆a de IA" class="rounded-xl shadow-2xl">
121
+ </div>
122
+ </div>
123
+ </div>
124
+ <div class="absolute top-0 right-0 -z-10">
125
+ <div class="bg-gradient-to-br from-indigo-100 to-purple-50 rounded-full h-96 w-96 opacity-50 blur-3xl"></div>
126
+ </div>
127
+ </section>
128
+
129
+ <!-- Services Section -->
130
+ <section id="services" class="py-20 bg-white">
131
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
132
+ <div class="text-center mb-16" data-aos="fade-up">
133
+ <h2 class="text-3xl font-bold text-gray-900 mb-4">Nuestros Servicios de IA</h2>
134
+ <p class="text-lg text-gray-500 max-w-2xl mx-auto">Entregamos soluciones de IA de vanguardia adaptadas a las necesidades de su negocio</p>
135
+ </div>
136
+
137
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
138
+ <div class="bg-gray-50 rounded-xl p-8 shadow-sm hover:shadow-md transition duration-300" data-aos="fade-up" data-aos-delay="100">
139
+ <div class="w-14 h-14 gradient-bg rounded-lg flex items-center justify-center mb-6">
140
+ <i data-feather="cpu" class="text-white w-6 h-6"></i>
141
+ </div>
142
+ <h3 class="text-xl font-bold text-gray-900 mb-3">Automatizaci贸n con IA</h3>
143
+ <p class="text-gray-600">Optimice operaciones con automatizaci贸n inteligente que aprende y se adapta a sus flujos de trabajo.</p>
144
+ </div>
145
+
146
+ <div class="bg-gray-50 rounded-xl p-8 shadow-sm hover:shadow-md transition duration-300" data-aos="fade-up" data-aos-delay="200">
147
+ <div class="w-14 h-14 gradient-bg rounded-lg flex items-center justify-center mb-6">
148
+ <i data-feather="shopping-cart" class="text-white w-6 h-6"></i>
149
+ </div>
150
+ <h3 class="text-xl font-bold text-gray-900 mb-3">Soluciones de Comercio Electr贸nico</h3>
151
+ <p class="text-gray-600">Aumente las conversiones con recomendaciones de productos con IA y experiencias de compra personalizadas.</p>
152
+ </div>
153
+
154
+ <div class="bg-gray-50 rounded-xl p-8 shadow-sm hover:shadow-md transition duration-300" data-aos="fade-up" data-aos-delay="300">
155
+ <div class="w-14 h-14 gradient-bg rounded-lg flex items-center justify-center mb-6">
156
+ <i data-feather="code" class="text-white w-6 h-6"></i>
157
+ </div>
158
+ <h3 class="text-xl font-bold text-gray-900 mb-3">Desarrollo Web</h3>
159
+ <p class="text-gray-600">Construya sitios web a prueba de futuro con integraci贸n de IA para mayor participaci贸n y an谩lisis.</p>
160
+ </div>
161
+ </div>
162
+ </div>
163
+ </section>
164
+
165
+ <!-- Stats Section -->
166
+ <section class="py-20 gradient-bg text-white">
167
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
168
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-8 text-center">
169
+ <div data-aos="fade-up" data-aos-delay="100">
170
+ <div class="text-4xl font-bold mb-2">15+</div>
171
+ <div class="text-lg">A帽os de Experiencia</div>
172
+ </div>
173
+ <div data-aos="fade-up" data-aos-delay="200">
174
+ <div class="text-4xl font-bold mb-2">200+</div>
175
+ <div class="text-lg">Clientes en el Mundo</div>
176
+ </div>
177
+ <div data-aos="fade-up" data-aos-delay="300">
178
+ <div class="text-4xl font-bold mb-2">95%</div>
179
+ <div class="text-lg">Retenci贸n de Clientes</div>
180
+ </div>
181
+ <div data-aos="fade-up" data-aos-delay="400">
182
+ <div class="text-4xl font-bold mb-2">3M+</div>
183
+ <div class="text-lg">Ingresos Generados</div>
184
+ </div>
185
+ </div>
186
+ </div>
187
+ </section>
188
+
189
+ <!-- Testimonials -->
190
+ <section id="testimonials" class="py-20 bg-white">
191
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
192
+ <div class="text-center mb-16" data-aos="fade-up">
193
+ <h2 class="text-3xl font-bold text-gray-900 mb-4">Lo que Dicen Nuestros Clientes</h2>
194
+ <p class="text-lg text-gray-500 max-w-2xl mx-auto">Conf铆an en nosotros startups y empresas Fortune 500</p>
195
+ </div>
196
+
197
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
198
+ <div class="bg-gray-50 rounded-xl p-8" data-aos="fade-up" data-aos-delay="100">
199
+ <div class="flex items-center mb-4">
200
+ <div class="flex items-center">
201
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
202
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
203
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
204
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
205
+ <i data-feather="star" class="text-yellow-400 w-4 h-4"></i>
206
+ </div>
207
+ </div>
208
+ <p class="text-gray-600 mb-6">"VersaLabs transform贸 nuestras operaciones de comercio electr贸nico con sus soluciones de IA. Nuestras tasas de conversi贸n aumentaron un 40% en el primer mes."</p>
209
+ <div class="flex items-center">
210
+ <img src="https://static.photos/people/200x200/1" alt="Cliente" class="w-10 h-10 rounded-full mr-3">
211
+ <div>
212
+ <div class="font-medium text-gray-900">Sarah Johnson</div>
213
+ <div class="text-sm text-gray-500">CEO, TechCorp</div>
214
+ </div>
215
+ </div>
216
+ </div>
217
+
218
+ <div class="bg-gray-50 rounded-xl p-8" data-aos="fade-up" data-aos-delay="200">
219
+ <div class="flex items-center mb-4">
220
+ <div class="flex items-center">
221
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
222
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
223
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
224
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
225
+ <i data-feather="star" class="text-yellow-400 w-4 h-4"></i>
226
+ </div>
227
+ </div>
228
+ <p class="text-gray-600 mb-6">"Las soluciones de automatizaci贸n implementadas por VersaLabs nos ahorraron m谩s de 200 horas al mes en procesos manuales. Su experiencia es incomparable."</p>
229
+ <div class="flex items-center">
230
+ <img src="https://static.photos/people/200x200/2" alt="Cliente" class="w-10 h-10 rounded-full mr-3">
231
+ <div>
232
+ <div class="font-medium text-gray-900">Michael Chen</div>
233
+ <div class="text-sm text-gray-500">COO, Global Retail</div>
234
+ </div>
235
+ </div>
236
+ </div>
237
+
238
+ <div class="bg-gray-50 rounded-xl p-8" data-aos="fade-up" data-aos-delay="300">
239
+ <div class="flex items-center mb-4">
240
+ <div class="flex items-center">
241
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
242
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
243
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
244
+ <i data-feather="star" class="text-yellow-400 w-4 h-4 mr-1"></i>
245
+ <i data-feather="star" class="text-yellow-400 w-4 h-4"></i>
246
+ </div>
247
+ </div>
248
+ <p class="text-gray-600 mb-6">"Sus expertos en Shopify nos ayudaron a redise帽ar nuestra tienda con recomendaciones con IA. Nuestro valor promedio de pedido aument贸 un 35%."</p>
249
+ <div class="flex items-center">
250
+ <img src="https://static.photos/people/200x200/3" alt="Cliente" class="w-10 h-10 rounded-full mr-3">
251
+ <div>
252
+ <div class="font-medium text-gray-900">David Wilson</div>
253
+ <div class="text-sm text-gray-500">Fundador, StyleHub</div>
254
+ </div>
255
+ </div>
256
+ </div>
257
+ </div>
258
+ </div>
259
+ </section>
260
+
261
+ <!-- Contact Section -->
262
+ <section id="contact" class="py-20 bg-white dark:bg-gray-900">
263
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
264
+ <div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
265
+ <div data-aos="fade-right">
266
+ <h2 class="text-3xl font-bold text-gray-900 dark:text-white mb-6">Ponte en Contacto</h2>
267
+ <p class="text-lg text-gray-600 dark:text-gray-300 mb-8">
268
+ 驴Tienes un proyecto en mente o quieres saber m谩s sobre nuestros servicios?
269
+ Completa el formulario y nos pondremos en contacto contigo en 24 horas.
270
+ </p>
271
+ <div class="space-y-4">
272
+ <div class="flex items-start">
273
+ <div class="flex-shrink-0 h-6 w-6 text-indigo-500 dark:text-indigo-400">
274
+ <i data-feather="mail"></i>
275
+ </div>
276
+ <div class="ml-3 text-base text-gray-500 dark:text-gray-400">
277
+ <a href="mailto:info@versalabs.io" class="hover:text-indigo-600 dark:hover:text-indigo-400">info@versalabs.io</a>
278
+ </div>
279
+ </div>
280
+ <div class="flex items-start">
281
+ <div class="flex-shrink-0 h-6 w-6 text-indigo-500 dark:text-indigo-400">
282
+ <i data-feather="phone"></i>
283
+ </div>
284
+ <div class="ml-3 text-base text-gray-500 dark:text-gray-400">
285
+ <a href="tel:+11234567890" class="hover:text-indigo-600 dark:hover:text-indigo-400">+1 (123) 456-7890</a>
286
+ </div>
287
+ </div>
288
+ <div class="flex items-start">
289
+ <div class="flex-shrink-0 h-6 w-6 text-indigo-500 dark:text-indigo-400">
290
+ <i data-feather="map-pin"></i>
291
+ </div>
292
+ <div class="ml-3 text-base text-gray-500 dark:text-gray-400">
293
+ 123 Calle de la IA, Valle Tecnol贸gico, CA 94000
294
+ </div>
295
+ </div>
296
+ </div>
297
+ </div>
298
+ <div data-aos="fade-left">
299
+ <form class="space-y-6">
300
+ <div>
301
+ <label for="name" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Nombre</label>
302
+ <input type="text" id="name" name="name" required class="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 dark:bg-gray-800 dark:text-white">
303
+ </div>
304
+ <div>
305
+ <label for="email" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Correo Electr贸nico</label>
306
+ <input type="email" id="email" name="email" required class="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 dark:bg-gray-800 dark:text-white">
307
+ </div>
308
+ <div>
309
+ <label for="message" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Mensaje</label>
310
+ <textarea id="message" name="message" rows="4" required class="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 dark:bg-gray-800 dark:text-white"></textarea>
311
+ </div>
312
+ <div>
313
+ <button type="submit" class="w-full px-6 py-3 gradient-bg text-white font-medium rounded-lg hover:opacity-90 transition duration-300">
314
+ Enviar Mensaje
315
+ </button>
316
+ </div>
317
+ </form>
318
+ </div>
319
+ </div>
320
+ </div>
321
+ </section>
322
+
323
+ <!-- CTA Section -->
324
+ <section class="py-20 bg-gray-900 text-white">
325
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
326
+ <div data-aos="fade-up">
327
+ <h2 class="text-3xl font-bold mb-6">驴Listo para Transformar tu Negocio con IA?</h2>
328
+ <p class="text-lg text-gray-300 mb-8 max-w-2xl mx-auto">Programa una consulta gratuita con nuestros expertos en IA para discutir las necesidades de tu proyecto.</p>
329
+ <a href="#contact" class="inline-block px-8 py-3 rounded-lg bg-white text-gray-900 font-medium hover:bg-gray-100 transition duration-300">
330
+ Reservar una Llamada
331
+ </a>
332
+ </div>
333
+ </div>
334
+ </section>
335
+
336
+ <!-- Footer -->
337
+ <footer class="bg-gray-50 py-12">
338
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
339
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
340
+ <div>
341
+ <div class="flex items-center mb-4">
342
+ <img class="h-8 w-auto" src="https://framerusercontent.com/images/t25w12kJO3xpUe3JdSybMTuinn8.png" alt="VersaLabs logo">
343
+ <span class="ml-2 text-xl font-bold text-gray-900">VersaLabs</span>
344
+ </div>
345
+ <p class="text-gray-500 text-sm">Firma l铆der en consultor铆a de IA que ofrece soluciones de vanguardia para la transformaci贸n digital.</p>
346
+ </div>
347
+ <div>
348
+ <h3 class="text-sm font-semibold text-gray-900 uppercase tracking-wider mb-4">Servicios</h3>
349
+ <ul class="space-y-2">
350
+ <li><a href="#" class="text-gray-500 hover:text-gray-900">Automatizaci贸n con IA</a></li>
351
+ <li><a href="#" class="text-gray-500 hover:text-gray-900">Soluciones de Comercio Electr贸nico</a></li>
352
+ <li><a href="#" class="text-gray-500 hover:text-gray-900">Desarrollo Web</a></li>
353
+ <li><a href="#" class="text-gray-500 hover:text-gray-900">Expertos en Shopify</a></li>
354
+ </ul>
355
+ </div>
356
+ <div>
357
+ <h3 class="text-sm font-semibold text-gray-900 uppercase tracking-wider mb-4">Empresa</h3>
358
+ <ul class="space-y-2">
359
+ <li><a href="#" class="text-gray-500 hover:text-gray-900">Acerca de Nosotros</a></li>
360
+ <li><a href="#" class="text-gray-500 hover:text-gray-900">Estudios de Caso</a></li>
361
+ <li><a href="#" class="text-gray-500 hover:text-gray-900">Carreras</a></li>
362
+ <li><a href="#" class="text-gray-500 hover:text-gray-900">Blog</a></li>
363
+ </ul>
364
+ </div>
365
+ <div>
366
+ <h3 class="text-sm font-semibold text-gray-900 uppercase tracking-wider mb-4">Conecta</h3>
367
+ <div class="flex space-x-4">
368
+ <a href="#" class="text-gray-400 hover:text-gray-500">
369
+ <i data-feather="twitter" class="w-5 h-5"></i>
370
+ </a>
371
+ <a href="#" class="text-gray-400 hover:text-gray-500">
372
+ <i data-feather="linkedin" class="w-5 h-5"></i>
373
+ </a>
374
+ <a href="#" class="text-gray-400 hover:text-gray-500">
375
+ <i data-feather="facebook" class="w-5 h-5"></i>
376
+ </a>
377
+ <a href="#" class="text-gray-400 hover:text-gray-500">
378
+ <i data-feather="instagram" class="w-5 h-5"></i>
379
+ </a>
380
+ </div>
381
+ <div class="mt-4">
382
+ <a href="mailto:info@versalabs.io" class="text-gray-500 hover:text-gray-900">info@versalabs.io</a>
383
+ </div>
384
+ </div>
385
+ </div>
386
+ <div class="mt-12 pt-8 border-t border-gray-200">
387
+ <p class="text-gray-500 text-sm text-center">&copy; 2023 VersaLabs. Todos los derechos reservados.</p>
388
+ </div>
389
+ </div>
390
+ </footer>
391
+
392
+ <script>
393
+ AOS.init({
394
+ duration: 800,
395
+ easing: 'ease-in-out',
396
+ once: true
397
+ });
398
+ feather.replace();
399
+
400
+ // Smooth scrolling for anchor links
401
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
402
+ anchor.addEventListener('click', function (e) {
403
+ e.preventDefault();
404
+ const targetId = this.getAttribute('href');
405
+ if (targetId === '#') return;
406
+
407
+ const targetElement = document.querySelector(targetId);
408
+ if (targetElement) {
409
+ targetElement.scrollIntoView({
410
+ behavior: 'smooth',
411
+ block: 'start'
412
+ });
413
+ }
414
+ });
415
+ });
416
+
417
+ // Dark mode toggle
418
+ const themeToggle = document.getElementById('theme-toggle');
419
+ const prefersDarkScheme = window.matchMedia('(prefers-color-scheme: dark)');
420
+
421
+ // Check for saved theme or use preferred color scheme
422
+ const currentTheme = localStorage.getItem('theme') ||
423
+ (prefersDarkScheme.matches ? 'dark' : 'light');
424
+ if (currentTheme === 'dark') {
425
+ document.body.classList.add('dark');
426
+ }
427
+
428
+ themeToggle.addEventListener('click', () => {
429
+ document.body.classList.toggle('dark');
430
+ const theme = document.body.classList.contains('dark') ? 'dark' : 'light';
431
+ localStorage.setItem('theme', theme);
432
+ });
433
+
434
+ // Language toggle
435
+ const languageToggle = document.getElementById('language-toggle');
436
+ languageToggle.addEventListener('click', () => {
437
+ window.location.href = 'index.html';
438
+ });
439
+
440
+ // Update header transparency on scroll
441
+ const nav = document.querySelector('nav');
442
+ window.addEventListener('scroll', () => {
443
+ if (window.scrollY > 10) {
444
+ nav.classList.remove('bg-white/80', 'dark:bg-gray-900/80');
445
+ nav.classList.add('bg-white', 'dark:bg-gray-900');
446
+ } else {
447
+ nav.classList.add('bg-white/80', 'dark:bg-gray-900/80');
448
+ nav.classList.remove('bg-white', 'dark:bg-gray-900');
449
+ }
450
+ });
451
+ </script>
452
+ </body>
453
+ </html>
index.html CHANGED
@@ -434,9 +434,7 @@
434
  // Language toggle
435
  const languageToggle = document.getElementById('language-toggle');
436
  languageToggle.addEventListener('click', () => {
437
- // This would normally redirect to the Spanish version
438
- // For demo purposes we'll just show an alert
439
- alert('Spanish version coming soon!');
440
  });
441
 
442
  // Update header transparency on scroll
 
434
  // Language toggle
435
  const languageToggle = document.getElementById('language-toggle');
436
  languageToggle.addEventListener('click', () => {
437
+ window.location.href = 'index-es.html';
 
 
438
  });
439
 
440
  // Update header transparency on scroll
prompts.txt CHANGED
@@ -140,4 +140,6 @@ add a contact section from the attached image inspiration
140
  add a toogle to spanish version ENG/ESP
141
  create the spanish version make the toggle fully functional
142
  create the spanish version make the toggle fully functional
143
- create the spanish version make the toggle fully functional
 
 
 
140
  add a toogle to spanish version ENG/ESP
141
  create the spanish version make the toggle fully functional
142
  create the spanish version make the toggle fully functional
143
+ create the spanish version make the toggle fully functional
144
+ CREATE SPANISH VERSION
145
+ cambiar : Estudios de Caso por Casos de Estudio