Spaces:
Running
Running
EN LA SECCION SOBRE NOSOTROS CAMBIA LA ESTADISTICA 499+ CLIENTES SATISFECHOS, ELIMINA 15 PAISES, 98% TASA DE SATISFACCION Y ELIMINA EL BOTON CONOCE NUESTRO EQUIPO - Follow Up Deployment
Browse files- index.html +16 -74
index.html
CHANGED
|
@@ -8,7 +8,7 @@
|
|
| 8 |
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
| 9 |
<style>
|
| 10 |
.hero-gradient {
|
| 11 |
-
background: linear-gradient(135deg, #
|
| 12 |
}
|
| 13 |
.feature-card:hover {
|
| 14 |
transform: translateY(-5px);
|
|
@@ -34,7 +34,7 @@
|
|
| 34 |
<div class="flex justify-between h-16">
|
| 35 |
<div class="flex items-center">
|
| 36 |
<div class="flex-shrink-0 flex items-center">
|
| 37 |
-
<i class="fas fa-car text-
|
| 38 |
<span class="text-xl font-bold text-gray-900">LOS PITS</span>
|
| 39 |
</div>
|
| 40 |
</div>
|
|
@@ -43,9 +43,6 @@
|
|
| 43 |
<a href="#servicios" class="text-gray-900 hover:text-indigo-600 px-3 py-2 font-medium">Servicios</a>
|
| 44 |
<a href="#nosotros" class="text-gray-900 hover:text-indigo-600 px-3 py-2 font-medium">Nosotros</a>
|
| 45 |
<a href="#contacto" class="text-gray-900 hover:text-indigo-600 px-3 py-2 font-medium">Contacto</a>
|
| 46 |
-
<button class="bg-indigo-600 text-white px-6 py-2 rounded-md font-medium hover:bg-indigo-700 transition duration-300">
|
| 47 |
-
Prueba Gratis
|
| 48 |
-
</button>
|
| 49 |
</div>
|
| 50 |
<div class="md:hidden flex items-center">
|
| 51 |
<button id="menu-btn" class="text-gray-900">
|
|
@@ -61,9 +58,6 @@
|
|
| 61 |
<a href="#servicios" class="block px-3 py-2 text-gray-900 hover:text-indigo-600">Servicios</a>
|
| 62 |
<a href="#nosotros" class="block px-3 py-2 text-gray-900 hover:text-indigo-600">Nosotros</a>
|
| 63 |
<a href="#contacto" class="block px-3 py-2 text-gray-900 hover:text-indigo-600">Contacto</a>
|
| 64 |
-
<button class="mt-2 w-full bg-indigo-600 text-white px-6 py-2 rounded-md font-medium hover:bg-indigo-700 transition duration-300">
|
| 65 |
-
Prueba Gratis
|
| 66 |
-
</button>
|
| 67 |
</div>
|
| 68 |
</nav>
|
| 69 |
|
|
@@ -90,27 +84,6 @@
|
|
| 90 |
</div>
|
| 91 |
</section>
|
| 92 |
|
| 93 |
-
<!-- Clients Section -->
|
| 94 |
-
<section class="py-12 bg-gray-50">
|
| 95 |
-
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 96 |
-
<p class="text-center text-gray-500 mb-8">Conf铆an en nosotros</p>
|
| 97 |
-
<div class="grid grid-cols-2 md:grid-cols-4 gap-8 items-center">
|
| 98 |
-
<div class="flex justify-center">
|
| 99 |
-
<i class="fab fa-google text-4xl text-gray-600"></i>
|
| 100 |
-
</div>
|
| 101 |
-
<div class="flex justify-center">
|
| 102 |
-
<i class="fab fa-microsoft text-4xl text-gray-600"></i>
|
| 103 |
-
</div>
|
| 104 |
-
<div class="flex justify-center">
|
| 105 |
-
<i class="fab fa-amazon text-4xl text-gray-600"></i>
|
| 106 |
-
</div>
|
| 107 |
-
<div class="flex justify-center">
|
| 108 |
-
<i class="fab fa-apple text-4xl text-gray-600"></i>
|
| 109 |
-
</div>
|
| 110 |
-
</div>
|
| 111 |
-
</div>
|
| 112 |
-
</section>
|
| 113 |
-
|
| 114 |
<!-- Services Section -->
|
| 115 |
<section id="servicios" class="py-20">
|
| 116 |
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
@@ -122,8 +95,8 @@
|
|
| 122 |
<div class="grid md:grid-cols-3 gap-8">
|
| 123 |
<!-- Service 1 -->
|
| 124 |
<div class="feature-card bg-white p-8 rounded-xl shadow-md transition duration-300">
|
| 125 |
-
<div class="w-16 h-16 bg-
|
| 126 |
-
<i class="fas fa-tools text-
|
| 127 |
</div>
|
| 128 |
<h3 class="text-xl font-bold mb-3">Mantenimiento</h3>
|
| 129 |
<p class="text-gray-600 mb-4">Servicios de mantenimiento preventivo y correctivo con repuestos de calidad.</p>
|
|
@@ -134,8 +107,8 @@
|
|
| 134 |
|
| 135 |
<!-- Service 2 -->
|
| 136 |
<div class="feature-card bg-white p-8 rounded-xl shadow-md transition duration-300">
|
| 137 |
-
<div class="w-16 h-16 bg-
|
| 138 |
-
<i class="fas fa-car-crash text-
|
| 139 |
</div>
|
| 140 |
<h3 class="text-xl font-bold mb-3">Reparaci贸n</h3>
|
| 141 |
<p class="text-gray-600 mb-4">Diagn贸stico y reparaci贸n de fallas mec谩nicas, el茅ctricas y electr贸nicas.</p>
|
|
@@ -146,8 +119,8 @@
|
|
| 146 |
|
| 147 |
<!-- Service 3 -->
|
| 148 |
<div class="feature-card bg-white p-8 rounded-xl shadow-md transition duration-300">
|
| 149 |
-
<div class="w-16 h-16 bg-
|
| 150 |
-
<i class="fas fa-oil-can text-
|
| 151 |
</div>
|
| 152 |
<h3 class="text-xl font-bold mb-3">Cambio de Aceite</h3>
|
| 153 |
<p class="text-gray-600 mb-4">Cambio de aceite y filtros con productos premium para proteger tu motor.</p>
|
|
@@ -171,28 +144,16 @@
|
|
| 171 |
<p class="text-gray-600 mb-6">Somos un taller mec谩nico especializado con m谩s de 15 a帽os de experiencia en el servicio automotriz.</p>
|
| 172 |
<p class="text-gray-600 mb-8">Nuestro equipo de t茅cnicos certificados est谩 comprometido con brindar el mejor servicio para mantener tu veh铆culo en 贸ptimas condiciones.</p>
|
| 173 |
|
| 174 |
-
<div class="grid grid-cols-
|
| 175 |
<div>
|
| 176 |
-
<h3 class="text-2xl font-bold text-indigo-600">
|
| 177 |
<p class="text-gray-600">Clientes satisfechos</p>
|
| 178 |
</div>
|
| 179 |
-
<div>
|
| 180 |
-
<h3 class="text-2xl font-bold text-indigo-600">15</h3>
|
| 181 |
-
<p class="text-gray-600">Pa铆ses</p>
|
| 182 |
-
</div>
|
| 183 |
-
<div>
|
| 184 |
-
<h3 class="text-2xl font-bold text-indigo-600">98%</h3>
|
| 185 |
-
<p class="text-gray-600">Tasa de satisfacci贸n</p>
|
| 186 |
-
</div>
|
| 187 |
<div>
|
| 188 |
<h3 class="text-2xl font-bold text-indigo-600">24/7</h3>
|
| 189 |
<p class="text-gray-600">Soporte disponible</p>
|
| 190 |
</div>
|
| 191 |
</div>
|
| 192 |
-
|
| 193 |
-
<button class="bg-indigo-600 text-white px-8 py-3 rounded-md font-bold hover:bg-indigo-700 transition duration-300">
|
| 194 |
-
Conoce nuestro equipo
|
| 195 |
-
</button>
|
| 196 |
</div>
|
| 197 |
</div>
|
| 198 |
</div>
|
|
@@ -215,10 +176,9 @@
|
|
| 215 |
</div>
|
| 216 |
<div>
|
| 217 |
<h4 class="font-bold">Mar铆a Gonz谩lez</h4>
|
| 218 |
-
<p class="text-gray-600 text-sm">CEO, TiendaOnline</p>
|
| 219 |
</div>
|
| 220 |
</div>
|
| 221 |
-
<p class="text-gray-600 mb-4">"
|
| 222 |
<div class="flex text-yellow-400">
|
| 223 |
<i class="fas fa-star"></i>
|
| 224 |
<i class="fas fa-star"></i>
|
|
@@ -236,10 +196,9 @@
|
|
| 236 |
</div>
|
| 237 |
<div>
|
| 238 |
<h4 class="font-bold">Carlos Mart铆nez</h4>
|
| 239 |
-
<p class="text-gray-600 text-sm">Director, AppTech</p>
|
| 240 |
</div>
|
| 241 |
</div>
|
| 242 |
-
<p class="text-gray-600 mb-4">"
|
| 243 |
<div class="flex text-yellow-400">
|
| 244 |
<i class="fas fa-star"></i>
|
| 245 |
<i class="fas fa-star"></i>
|
|
@@ -257,10 +216,9 @@
|
|
| 257 |
</div>
|
| 258 |
<div>
|
| 259 |
<h4 class="font-bold">Ana L贸pez</h4>
|
| 260 |
-
<p class="text-gray-600 text-sm">Marketing, Consultora</p>
|
| 261 |
</div>
|
| 262 |
</div>
|
| 263 |
-
<p class="text-gray-600 mb-4">"
|
| 264 |
<div class="flex text-yellow-400">
|
| 265 |
<i class="fas fa-star"></i>
|
| 266 |
<i class="fas fa-star"></i>
|
|
@@ -273,22 +231,6 @@
|
|
| 273 |
</div>
|
| 274 |
</section>
|
| 275 |
|
| 276 |
-
<!-- CTA Section -->
|
| 277 |
-
<section class="py-20 bg-red-600 text-white">
|
| 278 |
-
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
| 279 |
-
<h2 class="text-3xl font-bold mb-6">驴Listo para transformar tu negocio?</h2>
|
| 280 |
-
<p class="text-xl mb-8 max-w-2xl mx-auto opacity-90">Comienza hoy mismo con nuestra prueba gratuita de 14 d铆as. Sin tarjeta de cr茅dito requerida.</p>
|
| 281 |
-
<div class="flex flex-col sm:flex-row justify-center space-y-4 sm:space-y-0 sm:space-x-4">
|
| 282 |
-
<button class="bg-white text-indigo-600 px-8 py-3 rounded-md font-bold hover:bg-gray-100 transition duration-300">
|
| 283 |
-
Comenzar Prueba Gratis
|
| 284 |
-
</button>
|
| 285 |
-
<button class="border-2 border-white px-8 py-3 rounded-md font-bold hover:bg-white hover:text-indigo-600 transition duration-300">
|
| 286 |
-
Hablar con un experto
|
| 287 |
-
</button>
|
| 288 |
-
</div>
|
| 289 |
-
</div>
|
| 290 |
-
</section>
|
| 291 |
-
|
| 292 |
<!-- Contact Section -->
|
| 293 |
<section id="contacto" class="py-20">
|
| 294 |
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
@@ -304,7 +246,7 @@
|
|
| 304 |
</div>
|
| 305 |
<div>
|
| 306 |
<h4 class="font-bold mb-1">Oficina Principal</h4>
|
| 307 |
-
<p class="text-gray-600">
|
| 308 |
</div>
|
| 309 |
</div>
|
| 310 |
|
|
@@ -314,7 +256,7 @@
|
|
| 314 |
</div>
|
| 315 |
<div>
|
| 316 |
<h4 class="font-bold mb-1">Tel茅fono</h4>
|
| 317 |
-
<p class="text-gray-600">+52
|
| 318 |
</div>
|
| 319 |
</div>
|
| 320 |
|
|
@@ -385,7 +327,7 @@
|
|
| 385 |
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
| 386 |
<div>
|
| 387 |
<div class="flex items-center mb-4">
|
| 388 |
-
<i class="fas fa-bolt text-
|
| 389 |
<span class="text-xl font-bold">NEXUS</span>
|
| 390 |
</div>
|
| 391 |
<p class="text-gray-400">Soluciones digitales innovadoras para impulsar tu negocio en la era digital.</p>
|
|
|
|
| 8 |
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
| 9 |
<style>
|
| 10 |
.hero-gradient {
|
| 11 |
+
background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
|
| 12 |
}
|
| 13 |
.feature-card:hover {
|
| 14 |
transform: translateY(-5px);
|
|
|
|
| 34 |
<div class="flex justify-between h-16">
|
| 35 |
<div class="flex items-center">
|
| 36 |
<div class="flex-shrink-0 flex items-center">
|
| 37 |
+
<i class="fas fa-car text-blue-600 text-2xl mr-2"></i>
|
| 38 |
<span class="text-xl font-bold text-gray-900">LOS PITS</span>
|
| 39 |
</div>
|
| 40 |
</div>
|
|
|
|
| 43 |
<a href="#servicios" class="text-gray-900 hover:text-indigo-600 px-3 py-2 font-medium">Servicios</a>
|
| 44 |
<a href="#nosotros" class="text-gray-900 hover:text-indigo-600 px-3 py-2 font-medium">Nosotros</a>
|
| 45 |
<a href="#contacto" class="text-gray-900 hover:text-indigo-600 px-3 py-2 font-medium">Contacto</a>
|
|
|
|
|
|
|
|
|
|
| 46 |
</div>
|
| 47 |
<div class="md:hidden flex items-center">
|
| 48 |
<button id="menu-btn" class="text-gray-900">
|
|
|
|
| 58 |
<a href="#servicios" class="block px-3 py-2 text-gray-900 hover:text-indigo-600">Servicios</a>
|
| 59 |
<a href="#nosotros" class="block px-3 py-2 text-gray-900 hover:text-indigo-600">Nosotros</a>
|
| 60 |
<a href="#contacto" class="block px-3 py-2 text-gray-900 hover:text-indigo-600">Contacto</a>
|
|
|
|
|
|
|
|
|
|
| 61 |
</div>
|
| 62 |
</nav>
|
| 63 |
|
|
|
|
| 84 |
</div>
|
| 85 |
</section>
|
| 86 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 87 |
<!-- Services Section -->
|
| 88 |
<section id="servicios" class="py-20">
|
| 89 |
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
|
|
| 95 |
<div class="grid md:grid-cols-3 gap-8">
|
| 96 |
<!-- Service 1 -->
|
| 97 |
<div class="feature-card bg-white p-8 rounded-xl shadow-md transition duration-300">
|
| 98 |
+
<div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6">
|
| 99 |
+
<i class="fas fa-tools text-blue-600 text-2xl"></i>
|
| 100 |
</div>
|
| 101 |
<h3 class="text-xl font-bold mb-3">Mantenimiento</h3>
|
| 102 |
<p class="text-gray-600 mb-4">Servicios de mantenimiento preventivo y correctivo con repuestos de calidad.</p>
|
|
|
|
| 107 |
|
| 108 |
<!-- Service 2 -->
|
| 109 |
<div class="feature-card bg-white p-8 rounded-xl shadow-md transition duration-300">
|
| 110 |
+
<div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6">
|
| 111 |
+
<i class="fas fa-car-crash text-blue-600 text-2xl"></i>
|
| 112 |
</div>
|
| 113 |
<h3 class="text-xl font-bold mb-3">Reparaci贸n</h3>
|
| 114 |
<p class="text-gray-600 mb-4">Diagn贸stico y reparaci贸n de fallas mec谩nicas, el茅ctricas y electr贸nicas.</p>
|
|
|
|
| 119 |
|
| 120 |
<!-- Service 3 -->
|
| 121 |
<div class="feature-card bg-white p-8 rounded-xl shadow-md transition duration-300">
|
| 122 |
+
<div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6">
|
| 123 |
+
<i class="fas fa-oil-can text-blue-600 text-2xl"></i>
|
| 124 |
</div>
|
| 125 |
<h3 class="text-xl font-bold mb-3">Cambio de Aceite</h3>
|
| 126 |
<p class="text-gray-600 mb-4">Cambio de aceite y filtros con productos premium para proteger tu motor.</p>
|
|
|
|
| 144 |
<p class="text-gray-600 mb-6">Somos un taller mec谩nico especializado con m谩s de 15 a帽os de experiencia en el servicio automotriz.</p>
|
| 145 |
<p class="text-gray-600 mb-8">Nuestro equipo de t茅cnicos certificados est谩 comprometido con brindar el mejor servicio para mantener tu veh铆culo en 贸ptimas condiciones.</p>
|
| 146 |
|
| 147 |
+
<div class="grid grid-cols-1 gap-6 mb-8">
|
| 148 |
<div>
|
| 149 |
+
<h3 class="text-2xl font-bold text-indigo-600">499+</h3>
|
| 150 |
<p class="text-gray-600">Clientes satisfechos</p>
|
| 151 |
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 152 |
<div>
|
| 153 |
<h3 class="text-2xl font-bold text-indigo-600">24/7</h3>
|
| 154 |
<p class="text-gray-600">Soporte disponible</p>
|
| 155 |
</div>
|
| 156 |
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
| 157 |
</div>
|
| 158 |
</div>
|
| 159 |
</div>
|
|
|
|
| 176 |
</div>
|
| 177 |
<div>
|
| 178 |
<h4 class="font-bold">Mar铆a Gonz谩lez</h4>
|
|
|
|
| 179 |
</div>
|
| 180 |
</div>
|
| 181 |
+
<p class="text-gray-600 mb-4">"Llevamos nuestros autom贸viles desde el 2020 ya que nos agrada la confianza que tenemos con el taller automotriz Los Pits."</p>
|
| 182 |
<div class="flex text-yellow-400">
|
| 183 |
<i class="fas fa-star"></i>
|
| 184 |
<i class="fas fa-star"></i>
|
|
|
|
| 196 |
</div>
|
| 197 |
<div>
|
| 198 |
<h4 class="font-bold">Carlos Mart铆nez</h4>
|
|
|
|
| 199 |
</div>
|
| 200 |
</div>
|
| 201 |
+
<p class="text-gray-600 mb-4">"Mi primer autom贸vil ten铆a un problema donde varios talleres me dieron varios diagn贸sticos m谩s sin embargo ninguno pudo encontrar el problema, en Los Pits me ayudaron con el problema que ten铆a mi autom贸vil."</p>
|
| 202 |
<div class="flex text-yellow-400">
|
| 203 |
<i class="fas fa-star"></i>
|
| 204 |
<i class="fas fa-star"></i>
|
|
|
|
| 216 |
</div>
|
| 217 |
<div>
|
| 218 |
<h4 class="font-bold">Ana L贸pez</h4>
|
|
|
|
| 219 |
</div>
|
| 220 |
</div>
|
| 221 |
+
<p class="text-gray-600 mb-4">"Servicio confiable y garantizado, sin duda se ha convertido en mi taller de ahora en adelante."</p>
|
| 222 |
<div class="flex text-yellow-400">
|
| 223 |
<i class="fas fa-star"></i>
|
| 224 |
<i class="fas fa-star"></i>
|
|
|
|
| 231 |
</div>
|
| 232 |
</section>
|
| 233 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 234 |
<!-- Contact Section -->
|
| 235 |
<section id="contacto" class="py-20">
|
| 236 |
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
|
|
| 246 |
</div>
|
| 247 |
<div>
|
| 248 |
<h4 class="font-bold mb-1">Oficina Principal</h4>
|
| 249 |
+
<p class="text-gray-600">Calzada de la Quinta, La Garita, 29230 San Cristobal de Las Casas, Chiapas</p>
|
| 250 |
</div>
|
| 251 |
</div>
|
| 252 |
|
|
|
|
| 256 |
</div>
|
| 257 |
<div>
|
| 258 |
<h4 class="font-bold mb-1">Tel茅fono</h4>
|
| 259 |
+
<p class="text-gray-600">+52 222 136 1944</p>
|
| 260 |
</div>
|
| 261 |
</div>
|
| 262 |
|
|
|
|
| 327 |
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
| 328 |
<div>
|
| 329 |
<div class="flex items-center mb-4">
|
| 330 |
+
<i class="fas fa-bolt text-blue-500 text-2xl mr-2"></i>
|
| 331 |
<span class="text-xl font-bold">NEXUS</span>
|
| 332 |
</div>
|
| 333 |
<p class="text-gray-400">Soluciones digitales innovadoras para impulsar tu negocio en la era digital.</p>
|