Spaces:
Running
Running
add my logo https://photos.google.com/search/CgAiCgoAEgYKBHICCgAo1Mrq4vky/photo/AF1QipPC9eh9mjHkm4snonUY6dUNUqrYya2IQGMMF0-r - Follow Up Deployment
Browse files- index.html +206 -126
index.html
CHANGED
@@ -61,11 +61,7 @@
|
|
61 |
max-height: 500px;
|
62 |
}
|
63 |
|
64 |
-
.
|
65 |
-
transition: transform 0.3s;
|
66 |
-
}
|
67 |
-
|
68 |
-
.faq-arrow.active {
|
69 |
transform: rotate(180deg);
|
70 |
}
|
71 |
|
@@ -272,10 +268,10 @@
|
|
272 |
<section id="services" class="py-16 bg-gray-800 text-gray-100 px-6">
|
273 |
<div class="max-w-7xl mx-auto">
|
274 |
<div class="text-center mb-12">
|
275 |
-
<span class="text-purple-400 font-semibold">
|
276 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Detailing Packages</h2>
|
277 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
278 |
-
Professional
|
279 |
</p>
|
280 |
</div>
|
281 |
|
@@ -290,31 +286,64 @@
|
|
290 |
<ul class="space-y-3 mb-6">
|
291 |
<li class="flex items-start">
|
292 |
<span class="text-green-400 mr-2">✓</span>
|
293 |
-
|
294 |
</li>
|
295 |
<li class="flex items-start">
|
296 |
<span class="text-green-400 mr-2">✓</span>
|
297 |
-
|
298 |
</li>
|
299 |
<li class="flex items-start">
|
300 |
<span class="text-green-400 mr-2">✓</span>
|
301 |
-
Interior
|
302 |
</li>
|
303 |
<li class="flex items-start">
|
304 |
<span class="text-green-400 mr-2">✓</span>
|
305 |
-
|
306 |
</li>
|
307 |
<li class="flex items-start">
|
308 |
<span class="text-green-400 mr-2">✓</span>
|
309 |
-
|
310 |
</li>
|
311 |
</ul>
|
312 |
<a href="https://book.squareup.com/appointments/pzfva2vycwfzv7/location/LC0M9APDNYE44/services?show_locations=true" target="_blank" class="w-full bg-purple-600 hover:bg-purple-700 text-white font-bold py-3 px-6 rounded-full transition duration-300 flex items-center justify-center">
|
313 |
Book Now <i class="fas fa-arrow-right ml-2"></i>
|
314 |
</a>
|
315 |
-
<
|
316 |
-
|
317 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
318 |
</div>
|
319 |
</div>
|
320 |
|
@@ -343,19 +372,46 @@
|
|
343 |
</li>
|
344 |
<li class="flex items-start">
|
345 |
<span class="text-green-400 mr-2">✓</span>
|
346 |
-
|
347 |
</li>
|
348 |
<li class="flex items-start">
|
349 |
<span class="text-green-400 mr-2">✓</span>
|
350 |
-
|
351 |
</li>
|
352 |
</ul>
|
353 |
<a href="https://book.squareup.com/appointments/pzfva2vycwfzv7/location/LC0M9APDNYE44/services?show_locations=true" target="_blank" class="w-full bg-purple-600 hover:bg-purple-700 text-white font-bold py-3 px-6 rounded-full transition duration-300 flex items-center justify-center">
|
354 |
Book Now <i class="fas fa-arrow-right ml-2"></i>
|
355 |
</a>
|
356 |
-
<
|
357 |
-
|
358 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
359 |
</div>
|
360 |
</div>
|
361 |
|
@@ -383,6 +439,10 @@
|
|
383 |
<span class="text-green-400 mr-2">✓</span>
|
384 |
Clay bar treatment
|
385 |
</li>
|
|
|
|
|
|
|
|
|
386 |
<li class="flex items-start">
|
387 |
<span class="text-green-400 mr-2">✓</span>
|
388 |
Hydrophobic SiO₂ infused graphene sealant (6-month protection)
|
@@ -391,9 +451,40 @@
|
|
391 |
<a href="https://book.squareup.com/appointments/pzfva2vycwfzv7/location/LC0M9APDNYE44/services?show_locations=true" target="_blank" class="w-full bg-purple-600 hover:bg-purple-700 text-white font-bold py-3 px-6 rounded-full transition duration-300 flex items-center justify-center">
|
392 |
Book Now <i class="fas fa-arrow-right ml-2"></i>
|
393 |
</a>
|
394 |
-
<
|
395 |
-
|
396 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
397 |
</div>
|
398 |
</div>
|
399 |
</div>
|
@@ -404,10 +495,10 @@
|
|
404 |
<section id="products" class="py-16 bg-gray-900 text-white px-6">
|
405 |
<div class="max-w-7xl mx-auto">
|
406 |
<div class="text-center mb-12">
|
407 |
-
<span class="text-purple-400 font-semibold">
|
408 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Professional Products</h2>
|
409 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
410 |
-
Only
|
411 |
</p>
|
412 |
</div>
|
413 |
|
@@ -519,10 +610,10 @@
|
|
519 |
<section id="process" class="py-16 bg-gray-800 text-white px-6">
|
520 |
<div class="max-w-7xl mx-auto">
|
521 |
<div class="text-center mb-12">
|
522 |
-
<span class="text-purple-400 font-semibold">
|
523 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Detail Process</h2>
|
524 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
525 |
-
Professional
|
526 |
</p>
|
527 |
</div>
|
528 |
|
@@ -605,10 +696,10 @@
|
|
605 |
<section id="stats" class="py-16 bg-gradient-to-br from-purple-900/80 to-pink-900/80 text-white px-6">
|
606 |
<div class="max-w-7xl mx-auto">
|
607 |
<div class="text-center mb-12">
|
608 |
-
<span class="text-purple-300 font-semibold">
|
609 |
-
<h2 class="text-4xl font-bold mt-2 text-white">Experience
|
610 |
<p class="text-xl mt-4 text-gray-300 max-w-3xl mx-auto">
|
611 |
-
Premium
|
612 |
</p>
|
613 |
</div>
|
614 |
|
@@ -652,10 +743,10 @@
|
|
652 |
<section class="py-16 bg-gray-900 text-white px-6">
|
653 |
<div class="max-w-7xl mx-auto">
|
654 |
<div class="text-center mb-12">
|
655 |
-
<span class="text-purple-400 font-semibold">
|
656 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Premium Add-Ons</h2>
|
657 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
658 |
-
Enhance
|
659 |
</p>
|
660 |
</div>
|
661 |
|
@@ -742,10 +833,10 @@
|
|
742 |
<section class="py-16 bg-gray-800 text-white px-6">
|
743 |
<div class="max-w-7xl mx-auto">
|
744 |
<div class="text-center mb-12">
|
745 |
-
<span class="text-purple-400 font-semibold">
|
746 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Customer Reviews</h2>
|
747 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
748 |
-
What
|
749 |
</p>
|
750 |
</div>
|
751 |
|
@@ -793,10 +884,10 @@
|
|
793 |
<section id="gallery" class="py-16 bg-gray-900 text-white px-6">
|
794 |
<div class="max-w-7xl mx-auto">
|
795 |
<div class="text-center mb-12">
|
796 |
-
<span class="text-purple-400 font-semibold">
|
797 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Transformation Gallery</h2>
|
798 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
799 |
-
See
|
800 |
</p>
|
801 |
</div>
|
802 |
|
@@ -892,10 +983,10 @@
|
|
892 |
<section id="faq" class="py-16 bg-gray-800 text-white px-6">
|
893 |
<div class="max-w-7xl mx-auto">
|
894 |
<div class="text-center mb-12">
|
895 |
-
<span class="text-purple-400 font-semibold">
|
896 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Frequently Asked</h2>
|
897 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
898 |
-
Everything
|
899 |
</p>
|
900 |
</div>
|
901 |
|
@@ -977,10 +1068,10 @@
|
|
977 |
<section id="contact" class="py-16 bg-gray-900 text-white px-6">
|
978 |
<div class="max-w-7xl mx-auto">
|
979 |
<div class="text-center mb-12">
|
980 |
-
<span class="text-purple-400 font-semibold">
|
981 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Book Your Detail Today!</h2>
|
982 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
983 |
-
Ready
|
984 |
</p>
|
985 |
</div>
|
986 |
|
@@ -1120,6 +1211,62 @@
|
|
1120 |
</div>
|
1121 |
|
1122 |
<script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1123 |
// Service details data
|
1124 |
const serviceDetails = {
|
1125 |
basic: {
|
@@ -1158,7 +1305,8 @@
|
|
1158 |
{
|
1159 |
title: "Exterior Features",
|
1160 |
items: [
|
1161 |
-
"
|
|
|
1162 |
"Wheel cleaning with ceramic SiO₂",
|
1163 |
"Tire dressing application",
|
1164 |
"Door jambs cleaned",
|
@@ -1185,28 +1333,28 @@
|
|
1185 |
steps: [
|
1186 |
{
|
1187 |
title: "Basic Package Plus",
|
1188 |
-
description: "Includes all Basic package services",
|
1189 |
-
benefit: "
|
1190 |
},
|
1191 |
{
|
1192 |
title: "Ceramic Spray Wax",
|
1193 |
-
description: "Application of premium ceramic spray wax",
|
1194 |
-
benefit: "3 months of
|
1195 |
},
|
1196 |
{
|
1197 |
title: "Interior Protection",
|
1198 |
-
description: "SiO₂ interior treatment
|
1199 |
-
benefit: "
|
1200 |
},
|
1201 |
{
|
1202 |
title: "Trim Restoration",
|
1203 |
-
description: "
|
1204 |
-
benefit: "Revives faded
|
1205 |
},
|
1206 |
{
|
1207 |
title: "Enhanced Protection",
|
1208 |
-
description: "Door jambs and
|
1209 |
-
benefit: "Complete protection
|
1210 |
}
|
1211 |
],
|
1212 |
features: [
|
@@ -1243,6 +1391,11 @@
|
|
1243 |
description: "Includes all Luxury package services",
|
1244 |
benefit: "Premium cleaning and protection base"
|
1245 |
},
|
|
|
|
|
|
|
|
|
|
|
1246 |
{
|
1247 |
title: "Hyper Wax Application",
|
1248 |
description: "Advanced ceramic hyper wax with graphene",
|
@@ -1270,6 +1423,7 @@
|
|
1270 |
items: [
|
1271 |
"All Luxury exterior services",
|
1272 |
"Clay bar decontamination",
|
|
|
1273 |
"Hyper ceramic wax with graphene",
|
1274 |
"Enhanced wheel well cleaning",
|
1275 |
"6-month paint protection"
|
@@ -1296,80 +1450,6 @@
|
|
1296 |
mobileMenuButton.addEventListener('click', () => {
|
1297 |
mobileMenu.classList.toggle('hidden');
|
1298 |
});
|
1299 |
-
|
1300 |
-
// Show service details modal
|
1301 |
-
function showDetails(service) {
|
1302 |
-
const details = serviceDetails[service];
|
1303 |
-
const modal = document.getElementById('modal');
|
1304 |
-
const modalContent = document.getElementById('modalContent');
|
1305 |
-
|
1306 |
-
let html = `
|
1307 |
-
<div class="service-details">
|
1308 |
-
<h2 class="text-3xl font-bold mb-4 gradient-text">${details.title}</h2>
|
1309 |
-
<p class="text-xl font-bold mb-6">${details.price}</p>
|
1310 |
-
<p class="mb-8 text-lg text-gray-300">${details.description}</p>
|
1311 |
-
|
1312 |
-
<div class="grid md:grid-cols-2 gap-8 mb-8">
|
1313 |
-
<div class="bg-gray-700 p-6 rounded-xl border border-gray-600">
|
1314 |
-
<h3 class="text-xl font-bold mb-4 gradient-text">Step-by-Step Breakdown</h3>
|
1315 |
-
<ol class="space-y-4">
|
1316 |
-
${details.steps.map((step, index) => `
|
1317 |
-
<li class="bg-gray-800 p-4 rounded-lg border border-gray-700">
|
1318 |
-
<div class="flex items-start">
|
1319 |
-
<span class="bg-purple-600 text-white rounded-full w-6 h-6 flex items-center justify-center mr-3 flex-shrink-0">${index + 1}</span>
|
1320 |
-
<div>
|
1321 |
-
<h4 class="font-bold text-white">${step.title}</h4>
|
1322 |
-
<p class="text-gray-400 mt-1">${step.description}</p>
|
1323 |
-
<div class="mt-2 bg-purple-900/30 p-2 rounded">
|
1324 |
-
<p class="text-sm font-medium text-purple-400 flex items-start">
|
1325 |
-
<span class="mr-1">✓</span>
|
1326 |
-
<span>${step.benefit}</span>
|
1327 |
-
</p>
|
1328 |
-
</div>
|
1329 |
-
</div>
|
1330 |
-
</div>
|
1331 |
-
</li>
|
1332 |
-
`).join('')}
|
1333 |
-
</ol>
|
1334 |
-
</div>
|
1335 |
-
|
1336 |
-
<div class="bg-gray-700 p-6 rounded-xl border border-gray-600">
|
1337 |
-
<h3 class="text-xl font-bold mb-4 gradient-text">Ideal For</h3>
|
1338 |
-
<p class="text-gray-300 mb-4">${details.ideal}</p>
|
1339 |
-
<h3 class="text-xl font-bold mt-6 mb-4 gradient-text">Key Benefits</h3>
|
1340 |
-
<ul class="space-y-2">
|
1341 |
-
${details.features.flatMap(section => section.items).slice(0, 5).map(item => `
|
1342 |
-
<li class="flex items-start text-gray-300">
|
1343 |
-
<span class="text-purple-400 mr-2">✓</span>
|
1344 |
-
<span>${item}</span>
|
1345 |
-
</li>
|
1346 |
-
`).join('')}
|
1347 |
-
</ul>
|
1348 |
-
</div>
|
1349 |
-
</div>
|
1350 |
-
|
1351 |
-
<div class="bg-purple-900/20 p-6 rounded-xl border border-purple-800/30">
|
1352 |
-
<h3 class="text-xl font-bold mb-4 gradient-text">Detailed Features</h3>
|
1353 |
-
${details.features.map(section => `
|
1354 |
-
<div class="mb-6">
|
1355 |
-
<h4 class="text-lg font-bold mb-2 text-white">${section.title}</h4>
|
1356 |
-
<ul class="space-y-2">
|
1357 |
-
${section.items.map(item => `
|
1358 |
-
<li class="flex items-start text-gray-300">
|
1359 |
-
<span class="text-purple-400 mr-2">•</span>
|
1360 |
-
<span>${item}</span>
|
1361 |
-
</li>
|
1362 |
-
`).join('')}
|
1363 |
-
</ul>
|
1364 |
-
</div>
|
1365 |
-
`).join('')}
|
1366 |
-
</div>
|
1367 |
-
</div>
|
1368 |
-
`;
|
1369 |
-
|
1370 |
-
modalContent.innerHTML = html;
|
1371 |
-
modal.classList.remove('hidden');
|
1372 |
-
document.body.style.overflow = 'hidden';
|
1373 |
-
}
|
1374 |
<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=jjmandog/jaysmobilewash" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
|
1375 |
</html>
|
|
|
61 |
max-height: 500px;
|
62 |
}
|
63 |
|
64 |
+
.rotate-180 {
|
|
|
|
|
|
|
|
|
65 |
transform: rotate(180deg);
|
66 |
}
|
67 |
|
|
|
268 |
<section id="services" class="py-16 bg-gray-800 text-gray-100 px-6">
|
269 |
<div class="max-w-7xl mx-auto">
|
270 |
<div class="text-center mb-12">
|
271 |
+
<span class="text-purple-400 font-semibold">Our Services</span>
|
272 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Detailing Packages</h2>
|
273 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
274 |
+
Professional Care For Your Vehicle, Delivered To Your Location
|
275 |
</p>
|
276 |
</div>
|
277 |
|
|
|
286 |
<ul class="space-y-3 mb-6">
|
287 |
<li class="flex items-start">
|
288 |
<span class="text-green-400 mr-2">✓</span>
|
289 |
+
Two-step wash: Alkaline pre-wash (super foam) + ceramic shampoo wash
|
290 |
</li>
|
291 |
<li class="flex items-start">
|
292 |
<span class="text-green-400 mr-2">✓</span>
|
293 |
+
SiO₂ ceramic wheel decontamination
|
294 |
</li>
|
295 |
<li class="flex items-start">
|
296 |
<span class="text-green-400 mr-2">✓</span>
|
297 |
+
Interior surface sanitization
|
298 |
</li>
|
299 |
<li class="flex items-start">
|
300 |
<span class="text-green-400 mr-2">✓</span>
|
301 |
+
HEPA vacuum extraction
|
302 |
</li>
|
303 |
<li class="flex items-start">
|
304 |
<span class="text-green-400 mr-2">✓</span>
|
305 |
+
Hydrophobic glass treatment
|
306 |
</li>
|
307 |
</ul>
|
308 |
<a href="https://book.squareup.com/appointments/pzfva2vycwfzv7/location/LC0M9APDNYE44/services?show_locations=true" target="_blank" class="w-full bg-purple-600 hover:bg-purple-700 text-white font-bold py-3 px-6 rounded-full transition duration-300 flex items-center justify-center">
|
309 |
Book Now <i class="fas fa-arrow-right ml-2"></i>
|
310 |
</a>
|
311 |
+
<div class="mt-4">
|
312 |
+
<div class="border-t border-gray-600 pt-4">
|
313 |
+
<button onclick="toggleDetails('basic')" class="w-full flex justify-between items-center text-white font-medium py-2">
|
314 |
+
<span>Show Details</span>
|
315 |
+
<i class="fas fa-chevron-down transition-transform duration-300" id="basic-arrow"></i>
|
316 |
+
</button>
|
317 |
+
<div id="basic-details" class="hidden mt-2 text-gray-300 text-sm space-y-2">
|
318 |
+
<div class="flex items-start">
|
319 |
+
<span class="text-green-400 mr-2">✓</span>
|
320 |
+
<div>
|
321 |
+
Alkaline snow foam pre-wash (pH 10.5) + SiO₂-infused ceramic shampoo wash
|
322 |
+
<div class="text-xs text-gray-400 mt-1">
|
323 |
+
<span class="font-semibold">Snow foam</span> utilizes surfactant technology to encapsulate and lift particulate matter.
|
324 |
+
<span class="font-semibold">Alkaline formulation</span> effectively emulsifies hydrocarbon-based contaminants while maintaining paint-safe pH levels.
|
325 |
+
</div>
|
326 |
+
</div>
|
327 |
+
</div>
|
328 |
+
<div class="flex items-start">
|
329 |
+
<span class="text-green-400 mr-2">✓</span>
|
330 |
+
Wheel decontamination using SiO₂-based nanotechnology cleaner
|
331 |
+
</div>
|
332 |
+
<div class="flex items-start">
|
333 |
+
<span class="text-green-400 mr-2">✓</span>
|
334 |
+
Interior surface sanitization with antimicrobial agents
|
335 |
+
</div>
|
336 |
+
<div class="flex items-start">
|
337 |
+
<span class="text-green-400 mr-2">✓</span>
|
338 |
+
HEPA vacuum extraction for particulate removal
|
339 |
+
</div>
|
340 |
+
<div class="flex items-start">
|
341 |
+
<span class="text-green-400 mr-2">✓</span>
|
342 |
+
Hydrophobic glass treatment with siloxane polymers
|
343 |
+
</div>
|
344 |
+
</div>
|
345 |
+
</div>
|
346 |
+
</div>
|
347 |
</div>
|
348 |
</div>
|
349 |
|
|
|
372 |
</li>
|
373 |
<li class="flex items-start">
|
374 |
<span class="text-green-400 mr-2">✓</span>
|
375 |
+
Professional exterior trim restoration with UV-resistant polymer protectants (matte or semi-gloss finish options)
|
376 |
</li>
|
377 |
<li class="flex items-start">
|
378 |
<span class="text-green-400 mr-2">✓</span>
|
379 |
+
Advanced polymer-based UV protection system for interior vinyl components
|
380 |
</li>
|
381 |
</ul>
|
382 |
<a href="https://book.squareup.com/appointments/pzfva2vycwfzv7/location/LC0M9APDNYE44/services?show_locations=true" target="_blank" class="w-full bg-purple-600 hover:bg-purple-700 text-white font-bold py-3 px-6 rounded-full transition duration-300 flex items-center justify-center">
|
383 |
Book Now <i class="fas fa-arrow-right ml-2"></i>
|
384 |
</a>
|
385 |
+
<div class="mt-4">
|
386 |
+
<div class="border-t border-gray-600 pt-4">
|
387 |
+
<button onclick="toggleDetails('luxury')" class="w-full flex justify-between items-center text-white font-medium py-2">
|
388 |
+
<span>Show Details</span>
|
389 |
+
<i class="fas fa-chevron-down transition-transform duration-300" id="luxury-arrow"></i>
|
390 |
+
</button>
|
391 |
+
<div id="luxury-details" class="hidden mt-2 text-gray-300 text-sm space-y-2">
|
392 |
+
<div class="flex items-start">
|
393 |
+
<span class="text-green-400 mr-2">✓</span>
|
394 |
+
Everything included in Basic package, plus more
|
395 |
+
</div>
|
396 |
+
<div class="flex items-start">
|
397 |
+
<span class="text-green-400 mr-2">✓</span>
|
398 |
+
Deep wheel/rim cleaning with alkaline (non-acid) SiO₂-infused super cleaner
|
399 |
+
</div>
|
400 |
+
<div class="flex items-start">
|
401 |
+
<span class="text-green-400 mr-2">✓</span>
|
402 |
+
Interior SiO₂ nanocoating for hydrophobic surface modification
|
403 |
+
</div>
|
404 |
+
<div class="flex items-start">
|
405 |
+
<span class="text-green-400 mr-2">✓</span>
|
406 |
+
Premium trim restoration utilizing advanced UV-stable polymer rejuvenation technology
|
407 |
+
</div>
|
408 |
+
<div class="flex items-start">
|
409 |
+
<span class="text-green-400 mr-2">✓</span>
|
410 |
+
Long-lasting protective coating that bonds to your paint (lasts up to 90 days)
|
411 |
+
</div>
|
412 |
+
</div>
|
413 |
+
</div>
|
414 |
+
</div>
|
415 |
</div>
|
416 |
</div>
|
417 |
|
|
|
439 |
<span class="text-green-400 mr-2">✓</span>
|
440 |
Clay bar treatment
|
441 |
</li>
|
442 |
+
<li class="flex items-start">
|
443 |
+
<span class="text-green-400 mr-2">✓</span>
|
444 |
+
Full paint iron decontamination (removes embedded brake dust and rail dust)
|
445 |
+
</li>
|
446 |
<li class="flex items-start">
|
447 |
<span class="text-green-400 mr-2">✓</span>
|
448 |
Hydrophobic SiO₂ infused graphene sealant (6-month protection)
|
|
|
451 |
<a href="https://book.squareup.com/appointments/pzfva2vycwfzv7/location/LC0M9APDNYE44/services?show_locations=true" target="_blank" class="w-full bg-purple-600 hover:bg-purple-700 text-white font-bold py-3 px-6 rounded-full transition duration-300 flex items-center justify-center">
|
452 |
Book Now <i class="fas fa-arrow-right ml-2"></i>
|
453 |
</a>
|
454 |
+
<div class="mt-4">
|
455 |
+
<div class="border-t border-gray-600 pt-4">
|
456 |
+
<button onclick="toggleDetails('max')" class="w-full flex justify-between items-center text-white font-medium py-2">
|
457 |
+
<span>Show Details</span>
|
458 |
+
<i class="fas fa-chevron-down transition-transform duration-300" id="max-arrow"></i>
|
459 |
+
</button>
|
460 |
+
<div id="max-details" class="hidden mt-2 text-gray-300 text-sm space-y-2">
|
461 |
+
<div class="flex items-start">
|
462 |
+
<span class="text-green-400 mr-2">✓</span>
|
463 |
+
Complete Luxury package implementation
|
464 |
+
</div>
|
465 |
+
<div class="flex items-start">
|
466 |
+
<span class="text-green-400 mr-2">✓</span>
|
467 |
+
Graphene-enhanced ceramic hyper wax application
|
468 |
+
</div>
|
469 |
+
<div class="flex items-start">
|
470 |
+
<span class="text-green-400 mr-2">✓</span>
|
471 |
+
SiO₂ nanocoating for interior surface modification
|
472 |
+
</div>
|
473 |
+
<div class="flex items-start">
|
474 |
+
<span class="text-green-400 mr-2">✓</span>
|
475 |
+
Mechanical decontamination via clay bar methodology
|
476 |
+
</div>
|
477 |
+
<div class="flex items-start">
|
478 |
+
<span class="text-green-400 mr-2">✓</span>
|
479 |
+
Full iron decontamination using specialized iron remover that dissolves embedded metallic particles (turns purple as it works)
|
480 |
+
</div>
|
481 |
+
<div class="flex items-start">
|
482 |
+
<span class="text-green-400 mr-2">✓</span>
|
483 |
+
Hydrophobic SiO₂-infused graphene matrix (180-day protective barrier)
|
484 |
+
</div>
|
485 |
+
</div>
|
486 |
+
</div>
|
487 |
+
</div>
|
488 |
</div>
|
489 |
</div>
|
490 |
</div>
|
|
|
495 |
<section id="products" class="py-16 bg-gray-900 text-white px-6">
|
496 |
<div class="max-w-7xl mx-auto">
|
497 |
<div class="text-center mb-12">
|
498 |
+
<span class="text-purple-400 font-semibold">Our Tools</span>
|
499 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Professional Products</h2>
|
500 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
501 |
+
Only The Best For Your Vehicle
|
502 |
</p>
|
503 |
</div>
|
504 |
|
|
|
610 |
<section id="process" class="py-16 bg-gray-800 text-white px-6">
|
611 |
<div class="max-w-7xl mx-auto">
|
612 |
<div class="text-center mb-12">
|
613 |
+
<span class="text-purple-400 font-semibold">Our Method</span>
|
614 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Detail Process</h2>
|
615 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
616 |
+
Professional Results In 5 Simple Steps
|
617 |
</p>
|
618 |
</div>
|
619 |
|
|
|
696 |
<section id="stats" class="py-16 bg-gradient-to-br from-purple-900/80 to-pink-900/80 text-white px-6">
|
697 |
<div class="max-w-7xl mx-auto">
|
698 |
<div class="text-center mb-12">
|
699 |
+
<span class="text-purple-300 font-semibold">Why Choose Us</span>
|
700 |
+
<h2 class="text-4xl font-bold mt-2 text-white">Experience The Difference</h2>
|
701 |
<p class="text-xl mt-4 text-gray-300 max-w-3xl mx-auto">
|
702 |
+
Premium Service With Mobile Convenience
|
703 |
</p>
|
704 |
</div>
|
705 |
|
|
|
743 |
<section class="py-16 bg-gray-900 text-white px-6">
|
744 |
<div class="max-w-7xl mx-auto">
|
745 |
<div class="text-center mb-12">
|
746 |
+
<span class="text-purple-400 font-semibold">Upgrades</span>
|
747 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Premium Add-Ons</h2>
|
748 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
749 |
+
Enhance Your Detail With Professional Upgrades
|
750 |
</p>
|
751 |
</div>
|
752 |
|
|
|
833 |
<section class="py-16 bg-gray-800 text-white px-6">
|
834 |
<div class="max-w-7xl mx-auto">
|
835 |
<div class="text-center mb-12">
|
836 |
+
<span class="text-purple-400 font-semibold">Testimonials</span>
|
837 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Customer Reviews</h2>
|
838 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
839 |
+
What Our Clients Say About Us
|
840 |
</p>
|
841 |
</div>
|
842 |
|
|
|
884 |
<section id="gallery" class="py-16 bg-gray-900 text-white px-6">
|
885 |
<div class="max-w-7xl mx-auto">
|
886 |
<div class="text-center mb-12">
|
887 |
+
<span class="text-purple-400 font-semibold">Our Work</span>
|
888 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Transformation Gallery</h2>
|
889 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
890 |
+
See The Difference We Make
|
891 |
</p>
|
892 |
</div>
|
893 |
|
|
|
983 |
<section id="faq" class="py-16 bg-gray-800 text-white px-6">
|
984 |
<div class="max-w-7xl mx-auto">
|
985 |
<div class="text-center mb-12">
|
986 |
+
<span class="text-purple-400 font-semibold">Questions</span>
|
987 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Frequently Asked</h2>
|
988 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
989 |
+
Everything You Need To Know
|
990 |
</p>
|
991 |
</div>
|
992 |
|
|
|
1068 |
<section id="contact" class="py-16 bg-gray-900 text-white px-6">
|
1069 |
<div class="max-w-7xl mx-auto">
|
1070 |
<div class="text-center mb-12">
|
1071 |
+
<span class="text-purple-400 font-semibold">Get In Touch</span>
|
1072 |
<h2 class="text-4xl font-bold mt-2 gradient-text">Book Your Detail Today!</h2>
|
1073 |
<p class="text-xl mt-4 text-gray-400 max-w-3xl mx-auto">
|
1074 |
+
Ready To Transform Your Vehicle? Contact Us Now.
|
1075 |
</p>
|
1076 |
</div>
|
1077 |
|
|
|
1211 |
</div>
|
1212 |
|
1213 |
<script>
|
1214 |
+
// Toggle service details
|
1215 |
+
function toggleDetails(service) {
|
1216 |
+
const details = document.getElementById(`${service}-details`);
|
1217 |
+
const arrow = document.getElementById(`${service}-arrow`);
|
1218 |
+
|
1219 |
+
if (details) {
|
1220 |
+
details.classList.toggle('hidden');
|
1221 |
+
arrow.classList.toggle('rotate-180');
|
1222 |
+
|
1223 |
+
const button = document.querySelector(`button[onclick="toggleDetails('${service}')"] span`);
|
1224 |
+
if (details.classList.contains('hidden')) {
|
1225 |
+
button.textContent = 'Show Details';
|
1226 |
+
} else {
|
1227 |
+
button.textContent = 'Hide Details';
|
1228 |
+
}
|
1229 |
+
}
|
1230 |
+
}
|
1231 |
+
|
1232 |
+
// Close mobile menu when clicking a link
|
1233 |
+
document.querySelectorAll('#mobile-menu a').forEach(link => {
|
1234 |
+
link.addEventListener('click', () => {
|
1235 |
+
mobileMenu.classList.add('hidden');
|
1236 |
+
});
|
1237 |
+
});
|
1238 |
+
|
1239 |
+
// Scroll to top button
|
1240 |
+
const scrollTop = document.getElementById('scroll-top');
|
1241 |
+
window.addEventListener('scroll', () => {
|
1242 |
+
if (window.pageYOffset > 300) {
|
1243 |
+
scrollTop.classList.add('show');
|
1244 |
+
} else {
|
1245 |
+
scrollTop.classList.remove('show');
|
1246 |
+
}
|
1247 |
+
});
|
1248 |
+
|
1249 |
+
scrollTop.addEventListener('click', () => {
|
1250 |
+
window.scrollTo({
|
1251 |
+
top: 0,
|
1252 |
+
behavior: 'smooth'
|
1253 |
+
});
|
1254 |
+
});
|
1255 |
+
|
1256 |
+
// Smooth scrolling for anchor links
|
1257 |
+
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
1258 |
+
anchor.addEventListener('click', function(e) {
|
1259 |
+
e.preventDefault();
|
1260 |
+
const target = document.querySelector(this.getAttribute('href'));
|
1261 |
+
if (target) {
|
1262 |
+
window.scrollTo({
|
1263 |
+
top: target.offsetTop - 100,
|
1264 |
+
behavior: 'smooth'
|
1265 |
+
});
|
1266 |
+
}
|
1267 |
+
});
|
1268 |
+
});
|
1269 |
+
|
1270 |
// Service details data
|
1271 |
const serviceDetails = {
|
1272 |
basic: {
|
|
|
1305 |
{
|
1306 |
title: "Exterior Features",
|
1307 |
items: [
|
1308 |
+
"Snow foam alkaline pre-wash (pH 10-11) to loosen contaminants",
|
1309 |
+
"Ceramic-infused shampoo (pH 7) for gentle cleaning and protection",
|
1310 |
"Wheel cleaning with ceramic SiO₂",
|
1311 |
"Tire dressing application",
|
1312 |
"Door jambs cleaned",
|
|
|
1333 |
steps: [
|
1334 |
{
|
1335 |
title: "Basic Package Plus",
|
1336 |
+
description: "Includes all Basic package services: 2-step hand wash, wheel cleaning, interior wipe-down, thorough vacuuming, and window cleaning",
|
1337 |
+
benefit: "Ensures complete surface preparation by removing all dirt, grime and contaminants before applying protective treatments"
|
1338 |
},
|
1339 |
{
|
1340 |
title: "Ceramic Spray Wax",
|
1341 |
+
description: "Application of premium SiO₂-infused ceramic spray wax using cross-hatch application technique",
|
1342 |
+
benefit: "Creates molecular bond with paint for 3+ months of protection. Repels water, dirt and UV rays while enhancing gloss and depth"
|
1343 |
},
|
1344 |
{
|
1345 |
title: "Interior Protection",
|
1346 |
+
description: "SiO₂ interior treatment applied to all surfaces including dash, console, door panels and seats",
|
1347 |
+
benefit: "Forms protective barrier that repels dust, prevents staining and makes future cleaning 70% easier. Safe for all interior materials"
|
1348 |
},
|
1349 |
{
|
1350 |
title: "Trim Restoration",
|
1351 |
+
description: "Specialized trim restorer applied to all exterior plastic and rubber using foam applicators",
|
1352 |
+
benefit: "Revives faded trim to like-new condition while providing UV protection to prevent future fading and cracking"
|
1353 |
},
|
1354 |
{
|
1355 |
title: "Enhanced Protection",
|
1356 |
+
description: "Door jambs, hinges and hidden areas treated with protective coating",
|
1357 |
+
benefit: "Complete 360° protection prevents corrosion in hard-to-reach areas and maintains showroom-fresh appearance"
|
1358 |
}
|
1359 |
],
|
1360 |
features: [
|
|
|
1391 |
description: "Includes all Luxury package services",
|
1392 |
benefit: "Premium cleaning and protection base"
|
1393 |
},
|
1394 |
+
{
|
1395 |
+
title: "Iron Decontamination",
|
1396 |
+
description: "Chemical treatment that dissolves embedded iron particles from paint, wheels and glass",
|
1397 |
+
benefit: "Removes microscopic metal particles that cause rust spots and paint degradation"
|
1398 |
+
},
|
1399 |
{
|
1400 |
title: "Hyper Wax Application",
|
1401 |
description: "Advanced ceramic hyper wax with graphene",
|
|
|
1423 |
items: [
|
1424 |
"All Luxury exterior services",
|
1425 |
"Clay bar decontamination",
|
1426 |
+
"Iron particle removal treatment",
|
1427 |
"Hyper ceramic wax with graphene",
|
1428 |
"Enhanced wheel well cleaning",
|
1429 |
"6-month paint protection"
|
|
|
1450 |
mobileMenuButton.addEventListener('click', () => {
|
1451 |
mobileMenu.classList.toggle('hidden');
|
1452 |
});
|
1453 |
+
</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1454 |
<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=jjmandog/jaysmobilewash" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
|
1455 |
</html>
|