jjmandog commited on
Commit
7fe0360
·
verified ·
1 Parent(s): 77b8a94

add my logo https://photos.google.com/search/CgAiCgoAEgYKBHICCgAo1Mrq4vky/photo/AF1QipPC9eh9mjHkm4snonUY6dUNUqrYya2IQGMMF0-r - Follow Up Deployment

Browse files
Files changed (1) hide show
  1. index.html +206 -126
index.html CHANGED
@@ -61,11 +61,7 @@
61
  max-height: 500px;
62
  }
63
 
64
- .faq-arrow {
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">OUR SERVICES</span>
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 care for your vehicle, delivered to your location
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
- Professional 2-step hand wash
294
  </li>
295
  <li class="flex items-start">
296
  <span class="text-green-400 mr-2">✓</span>
297
- Wheel cleaning with ceramic SiO₂
298
  </li>
299
  <li class="flex items-start">
300
  <span class="text-green-400 mr-2">✓</span>
301
- Interior wipe-down and shine
302
  </li>
303
  <li class="flex items-start">
304
  <span class="text-green-400 mr-2">✓</span>
305
- Thorough vacuuming
306
  </li>
307
  <li class="flex items-start">
308
  <span class="text-green-400 mr-2">✓</span>
309
- Window cleaning inside & out
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
- <button onclick="showDetails('basic')" class="w-full mt-2 bg-gray-600 hover:bg-gray-500 text-white font-bold py-2 px-4 rounded-full transition duration-300 text-sm">
316
- Show More Details <i class="fas fa-chevron-down ml-1"></i>
317
- </button>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
- Vinyl & trim restoration
347
  </li>
348
  <li class="flex items-start">
349
  <span class="text-green-400 mr-2">✓</span>
350
- 3-month paint protection
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
- <button onclick="showDetails('luxury')" class="w-full mt-2 bg-gray-600 hover:bg-gray-500 text-white font-bold py-2 px-4 rounded-full transition duration-300 text-sm">
357
- Show More Details <i class="fas fa-chevron-down ml-1"></i>
358
- </button>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
- <button onclick="showDetails('max')" class="w-full mt-2 bg-gray-600 hover:bg-gray-500 text-white font-bold py-2 px-4 rounded-full transition duration-300 text-sm">
395
- Show More Details <i class="fas fa-chevron-down ml-1"></i>
396
- </button>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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">OUR TOOLS</span>
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 the best for your vehicle
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">OUR METHOD</span>
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 results in 5 simple steps
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">WHY CHOOSE US</span>
609
- <h2 class="text-4xl font-bold mt-2 text-white">Experience the Difference</h2>
610
  <p class="text-xl mt-4 text-gray-300 max-w-3xl mx-auto">
611
- Premium service with mobile convenience
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">UPGRADES</span>
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 your detail with professional upgrades
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">TESTIMONIALS</span>
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 our clients say about us
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">OUR WORK</span>
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 the difference we make
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">QUESTIONS</span>
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 you need to know
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">GET IN TOUCH</span>
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 to transform your vehicle? Contact us now.
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
- "Hand wash with pH-neutral shampoo",
 
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: "Complete cleaning foundation"
1190
  },
1191
  {
1192
  title: "Ceramic Spray Wax",
1193
- description: "Application of premium ceramic spray wax",
1194
- benefit: "3 months of paint protection and hydrophobic effect"
1195
  },
1196
  {
1197
  title: "Interior Protection",
1198
- description: "SiO₂ interior treatment on all surfaces",
1199
- benefit: "Repels dust and makes future cleaning easier"
1200
  },
1201
  {
1202
  title: "Trim Restoration",
1203
- description: "Application of trim restorer",
1204
- benefit: "Revives faded plastic and rubber trim"
1205
  },
1206
  {
1207
  title: "Enhanced Protection",
1208
- description: "Door jambs and hinges treated",
1209
- benefit: "Complete protection from top to bottom"
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>