[V0_FILE]typescriptreact:file="app/treatments/ceramic-coating/page.tsx" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle, Shield, Droplets, Sun, ArrowRight, Play, Star, Clock } from "lucide-react" export default function CeramicCoatingPage() { const packages = [ { name: "Entry Level", price: "$899", duration: "1 day", warranty: "2 years", features: [ "Single layer ceramic coating", "Paint decontamination", "Surface preparation", "UV protection", "Hydrophobic properties", "Enhanced gloss", ], popular: false, }, { name: "Professional", price: "$1,499", duration: "2 days", warranty: "5 years", features: [ "Multi-layer ceramic system", "Paint correction included", "Advanced surface prep", "Superior durability", "Self-cleaning properties", "Maintenance kit included", "Annual inspection", ], popular: true, }, { name: "Ultimate", price: "$2,299", duration: "3 days", warranty: "10 years", features: [ "Premium ceramic coating", "Full paint correction", "Wheel ceramic coating", "Glass ceramic treatment", "Trim protection", "Lifetime maintenance program", "White-glove service", ], popular: false, }, ] return (

{/* Header Section */}

Ceramic Coating Services

Ceramic Coating

The ultimate paint protection technology. Our ceramic coatings create an invisible shield that protects your vehicle's paint while enhancing its appearance for years to come.

{/* Video Section */}

Watch Ceramic Coating Process

See how our advanced ceramic coating transforms your vehicle

{/* Benefits Section with Animated Icons */}

{[ { icon: Shield, title: "Ultimate Protection", description: "Guards against scratches, chemicals, and environmental damage", }, { icon: Droplets, title: "Hydrophobic Effect", description: "Water beads and rolls off, making cleaning effortless", }, { icon: Sun, title: "UV Resistance", description: "Prevents paint fading and oxidation from harmful UV rays", }, { icon: Star, title: "Enhanced Gloss", description: "Delivers a deep, mirror-like finish that lasts for years", }, ].map((benefit, index) => (

{benefit.title}

{benefit.description}

))}

{/* Pricing Packages */}

Ceramic Coating Packages

{packages.map((pkg, index) => ( {pkg.popular && (

Most Popular

)} {pkg.name}

{pkg.price}

{pkg.duration}

{pkg.warranty} warranty

{feature}

))}

{/* Process Section */}

Our Ceramic Coating Process

{[ { step: "01", title: "Thorough Inspection", description: "Complete assessment of paint condition and contamination levels", }, { step: "02", title: "Paint Correction", description: "Remove swirl marks, scratches, and imperfections for perfect surface", }, { step: "03", title: "Surface Preparation", description: "Deep cleaning and decontamination to ensure optimal coating adhesion", }, { step: "04", title: "Coating Application", description: "Precise application of ceramic coating in controlled environment", }, { step: "05", title: "Curing Process", description: "Proper curing time ensures maximum durability and performance", }, ].map((process, index) => (

{process.step}

{process.title}

{process.description}

))}

Why Choose Our Ceramic Coating?

Certified installation technicians

Climate-controlled application facility

Premium coating products only

Comprehensive warranty coverage

Ongoing maintenance support

{/* CTA Section */}

Protect Your Investment

Give your vehicle the ultimate protection with our professional ceramic coating services. Book your consultation today and discover the difference.

) } [V0_FILE]typescriptreact:file="app/treatments/paint-protection/page.tsx" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle, Shield, Zap, Layers, ArrowRight, Play, Star } from "lucide-react" export default function PaintProtectionPage() { const packages = [ { name: "Essential PPF", price: "$1,299", coverage: "Front bumper, hood, mirrors", warranty: "5 years", features: [ "High-impact areas protection", "Self-healing technology", "UV resistance", "Professional installation", "Maintenance kit included", ], popular: false, }, { name: "Premium PPF", price: "$2,899", coverage: "Full front end + A-pillars", warranty: "7 years", features: [ "Extended coverage areas", "Advanced self-healing film", "Stain resistance", "Edge sealing technology", "Annual inspection included", "Touch-up service", ], popular: true, }, { name: "Full Vehicle PPF", price: "$5,999", coverage: "Complete vehicle wrap", warranty: "10 years", features: [ "100% paint protection", "Premium film technology", "Invisible protection", "Comprehensive warranty", "Lifetime maintenance", "Concierge service", ], popular: false, }, ] return (

{/* Header Section */}

Paint Protection Film

Advanced paint protection film (PPF) technology that provides invisible armor for your vehicle's paint. Self-healing properties and superior durability keep your car looking pristine.

{/* Video Section */}

PPF Installation Process

Watch our expert installation of paint protection film

{/* Benefits Section with Animated Icons */}

{[ { icon: Shield, title: "Impact Protection", description: "Guards against rock chips, scratches, and road debris", }, { icon: Zap, title: "Self-Healing", description: "Minor scratches disappear with heat application", }, { icon: Layers, title: "Invisible Shield", description: "Crystal clear protection that's virtually undetectable", }, { icon: Star, title: "Resale Value", description: "Maintains paint condition and vehicle value", }, ].map((benefit, index) => (

{benefit.title}

{benefit.description}

))}

{/* Pricing Packages */}

PPF Protection Packages

{packages.map((pkg, index) => ( {pkg.popular && (

Most Popular

)} {pkg.name}

{pkg.price}

{pkg.coverage}

{pkg.warranty} warranty

{feature}

))}

{/* CTA Section */}

Ultimate Paint Protection

Invest in the best protection for your vehicle's paint. Our PPF services provide unmatched durability and peace of mind.

) } [V0_FILE]typescriptreact:file="app/treatments/engine-cleaning/page.tsx" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle, Wrench, Droplets, Sparkles, ArrowRight, Play, Thermometer, Clock } from "lucide-react" export default function EngineCleaningPage() { const packages = [ { name: "Basic Engine Clean", price: "$149", duration: "2 hours", features: [ "Engine bay degreasing", "Component cleaning", "Basic protection spray", "Visual inspection", "Before/after photos", ], popular: false, }, { name: "Premium Engine Detail", price: "$249", duration: "3-4 hours", features: [ "Deep degreasing treatment", "Individual component detailing", "Plastic and rubber restoration", "Metal polishing", "Premium protection coating", "Performance check", ], popular: true, }, { name: "Concours Engine Bay", price: "$399", duration: "5-6 hours", features: [ "Show-quality engine detailing", "Complete disassembly cleaning", "Paint touch-ups", "Chrome polishing", "Ceramic coating application", "Professional photography", ], popular: false, }, ] return (

{/* Header Section */}

Engine Cleaning Services

Engine Bay Cleaning

Professional engine bay cleaning and detailing services that not only improve appearance but also help maintain your vehicle's performance and identify potential issues early.

{/* Video Section */}

Engine Cleaning Process

See our safe and thorough engine bay cleaning method

{/* Benefits Section with Animated Icons */}

{[ { icon: Wrench, title: "Performance Benefits", description: "Clean engine runs cooler and more efficiently", }, { icon: Droplets, title: "Safe Cleaning", description: "Water-safe methods protect sensitive components", }, { icon: Thermometer, title: "Heat Management", description: "Removes buildup that can cause overheating", }, { icon: Sparkles, title: "Show Quality", description: "Pristine engine bay enhances overall vehicle appeal", }, ].map((benefit, index) => (

{benefit.title}

{benefit.description}

))}

{/* Pricing Packages */}

Engine Cleaning Packages

{packages.map((pkg, index) => ( {pkg.popular && (

Most Popular

)} {pkg.name}

{pkg.price}

{pkg.duration}

{feature}

))}

{/* Safety & Process Section */}

Safe & Professional Process

Pre-Cleaning Inspection

Thorough assessment and protection of sensitive components

Safe Degreasing

Specialized degreasers that won't damage electrical components

Detail Cleaning

Individual component cleaning and restoration

Protection Application

Protective coatings to prevent future contamination

Why Engine Cleaning Matters

Easier leak detection and maintenance

Improved cooling system efficiency

Enhanced resale value

Professional appearance

Fire hazard reduction

{/* CTA Section */}

Professional Engine Care

Trust our experts to safely clean and detail your engine bay. Improve performance, appearance, and maintenance accessibility.

) } [V0_FILE]typescriptreact:file="app/education/page.tsx" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { Input } from "@/components/ui/input" import { BookOpen, Play, Search, Clock, User, ArrowRight, Lightbulb, Shield, Droplets, Sparkles, Calendar, } from "lucide-react" export default function EducationPage() { const featuredArticles = [ { title: "Complete Guide to Ceramic Coating", excerpt: "Everything you need to know about ceramic coating benefits, application, and maintenance.", category: "Protection", readTime: "8 min read", author: "Mike Johnson", date: "Dec 15, 2024", image: "/ceramic-coated-car.png", featured: true, }, { title: "DIY Interior Cleaning Tips", excerpt: "Professional techniques you can use at home to keep your interior spotless.", category: "Maintenance", readTime: "5 min read", author: "Sarah Chen", date: "Dec 12, 2024", image: "/car-interior-cleaning.png", featured: true, }, { title: "Paint Protection Film vs Ceramic Coating", excerpt: "Detailed comparison to help you choose the right protection for your vehicle.", category: "Protection", readTime: "6 min read", author: "Alex Rodriguez", date: "Dec 10, 2024", image: "/car-paint-protection.png", featured: true, }, ] const videoTutorials = [ { title: "Proper Car Washing Technique", duration: "12:34", views: "45K", category: "Basics", thumbnail: "/car-washing-tutorial.png", }, { title: "How to Apply Ceramic Coating", duration: "18:45", views: "32K", category: "Advanced", thumbnail: "/ceramic-coating-application.png", }, { title: "Interior Deep Cleaning Process", duration: "15:22", views: "28K", category: "Interior", thumbnail: "/interior-car-cleaning.png", }, { title: "Paint Correction Basics", duration: "22:15", views: "19K", category: "Advanced", thumbnail: "/car-paint-correction.png", }, ] const quickTips = [ { icon: Droplets, title: "Two-Bucket Method", tip: "Always use two buckets when washing - one for soapy water, one for rinsing your mitt.", }, { icon: Shield, title: "Protect Your Paint", tip: "Never wash your car in direct sunlight. Choose shade or early morning/evening hours.", }, { icon: Sparkles, title: "Microfiber Care", tip: "Wash microfiber towels separately without fabric softener to maintain their effectiveness.", }, { icon: Lightbulb, title: "Clay Bar Technique", tip: "Use a clay bar every 6 months to remove embedded contaminants from your paint.", }, ] const categories = [ { name: "All Articles", count: 24, active: true }, { name: "Basics", count: 8, active: false }, { name: "Protection", count: 6, active: false }, { name: "Interior", count: 5, active: false }, { name: "Advanced", count: 5, active: false }, ] const recentArticles = [ { title: "Winter Car Care Essentials", category: "Seasonal", readTime: "4 min read", date: "Dec 8, 2024", }, { title: "Understanding Paint Correction", category: "Advanced", readTime: "7 min read", date: "Dec 5, 2024", }, { title: "Leather Care and Conditioning", category: "Interior", readTime: "5 min read", date: "Dec 3, 2024", }, { title: "Wheel and Tire Maintenance", category: "Basics", readTime: "6 min read", date: "Nov 30, 2024", }, { title: "Engine Bay Cleaning Safety", category: "Advanced", readTime: "8 min read", date: "Nov 28, 2024", }, ] return (

{/* Header Section */}

Education Center

Car Care Education

Master the art of car care with our comprehensive guides, tutorials, and expert tips. Learn from professionals and keep your vehicle in pristine condition.

{/* Search Bar */}

{/* Featured Articles */}

Video Tutorials

{videoTutorials.map((video, index) => (

{video.duration} {video.category}

{video.title}

{video.views} views

))}

{/* Quick Tips */}

Quick Tips

{quickTips.map((tip, index) => (

{tip.title}

{tip.tip}

))}

{/* Articles Grid */}

{/* Categories Sidebar */}

Stay Updated

Get the latest car care tips, tutorials, and industry insights delivered to your inbox weekly.

No spam, unsubscribe anytime. Join 5,000+ car enthusiasts.

) } [V0_FILE]typescriptreact:file="app/education/loading.tsx" isFixed="true" export default function Loading() { return null } [V0_FILE]png:file="public/ceramic-coated-car.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/ceramic-coated-car-IfrfJxCgmOLJzK6AVdo1uYHsXrDfJG.png" [V0_FILE]png:file="public/car-interior-cleaning.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/car-interior-cleaning-Z5GfHPExR87XPkqHPDNzN0KALPGGwT.png" [V0_FILE]png:file="public/car-paint-protection.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/car-paint-protection-DSLbnyhHjeV9whz4dxz80pLfPBc7BZ.png" [V0_FILE]png:file="public/car-washing-tutorial.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/car-washing-tutorial-4n4xoQg1tfFmZiiNZD3MkL5RFLilWe.png" [V0_FILE]png:file="public/ceramic-coating-application.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/ceramic-coating-application-oJYWyxzbznsu1sJmENdGHXm19AtXSs.png" [V0_FILE]png:file="public/interior-car-cleaning.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/interior-car-cleaning-5XA1beotI0yQG88M9FsrFJeGaNR3AZ.png" [V0_FILE]png:file="public/car-paint-correction.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/car-paint-correction-V3yP3KwX54jdt9MEI13i7IlPJwNvT0.png" [V0_FILE]typescriptreact:file="components/car-animations.tsx" "use client" import { useEffect, useRef, useState } from "react" import { useFrame } from "@react-three/fiber" import { Canvas } from "@react-three/fiber" import { Box, Sphere } from "@react-three/drei" import * as THREE from "three" // Individual car component with animation logic function AnimatedCar({ position, speed, lane, carType, color, }: { position: [number, number, number] speed: number lane: number carType: string color: string }) { const meshRef = useRef(null) const [currentX, setCurrentX] = useState(position[0]) useFrame((state, delta) => { if (meshRef.current) { // Move car from right to left setCurrentX((prev) => { const newX = prev - speed * delta * 60 // Reset position when car goes off screen if (newX < -20) { return 25 + Math.random() * 10 } return newX }) meshRef.current.position.x = currentX meshRef.current.position.y = position[1] meshRef.current.position.z = position[2] + lane * 2 } }) return ( {/* Car Body */} {/* Car Roof */} {/* Wheels */} {/* Neon Glow Effect */} ) } // Scene setup component function CarScene() { const [cars, setCars] = useState< Array<{ id: number position: [number, number, number] speed: number lane: number carType: string color: string }> >([]) const carTypes = ["Bugatti", "Challenger", "BMW", "Supra"] const carColors = ["#ff0000", "#0066cc", "#ffffff", "#ffaa00", "#00ff00"] useEffect(() => { // Initialize cars with random properties const initialCars = Array.from({ length: 3 }, (_, i) => ({ id: i, position: [15 + i * 8, -2, -10] as [number, number, number], speed: 0.5 + Math.random() * 0.8, // Random speed between 0.5-1.3 lane: Math.floor(Math.random() * 3), // 0, 1, or 2 (front, middle, back) carType: carTypes[Math.floor(Math.random() * carTypes.length)], color: carColors[Math.floor(Math.random() * carColors.length)], })) setCars(initialCars) }, []) return ( <> {/* Ambient lighting */} {/* Directional light */} {/* Point light for neon effect */} {/* Render cars */} {cars.map((car) => ( ))} ) } // Main component that provides the Canvas export function CarAnimations({ className }: { className?: string }) { const [isMobile, setIsMobile] = useState(false) useEffect(() => { const checkMobile = () => { setIsMobile(window.innerWidth < 768) } checkMobile() window.addEventListener("resize", checkMobile) return () => window.removeEventListener("resize", checkMobile) }, []) return (

) } [V0_FILE]json:file="package.json" { "name": "tidy-team-website", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "@react-three/drei": "^9.88.13", "@react-three/fiber": "^8.15.11", "three": "^0.158.0" }, "devDependencies": { "@types/three": "^0.158.3" } } [V0_FILE]typescriptreact:file="app/home-cleaning/deep-cleaning/page.tsx" import { Button } from "@/components/ui/button" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle, Home, Sparkles, Clock, Shield, Star } from "lucide-react" import Link from "next/link" export default function DeepCleaningPage() { return (

{/* Enhanced background animation */}

{/* Hero Section */}

Home Cleaning Service

Deep Cleaning Service

Transform your home with our comprehensive deep cleaning service. We tackle every corner, surface, and detail to restore your space to pristine condition.

{/* Service Packages */}

Most Popular

Standard Deep Clean Perfect for regular deep cleaning maintenance

$299

All rooms deep cleaned
Kitchen & bathroom sanitization
Floor deep cleaning & mopping
Dusting & surface cleaning

Premium

Premium Deep Clean Comprehensive cleaning with extra attention to detail

$449

Everything in Standard
Inside appliances cleaning
Window cleaning (interior)
Baseboards & light fixtures

Ultimate

Ultimate Deep Clean The most thorough cleaning experience available

$649

Everything in Premium
Carpet deep cleaning
Upholstery cleaning
Garage & basement cleaning

{/* Process Section */}

Our Deep Cleaning Process

Assessment

We evaluate your home and create a customized cleaning plan

Preparation

We prepare the space and protect your belongings

Deep Clean

Thorough cleaning of every surface and corner

Final Inspection

Quality check to ensure perfection

{/* Features Section */}

Time Efficient

Professional team completes deep cleaning in 4-6 hours

Eco-Friendly

Safe, non-toxic cleaning products for your family

Satisfaction Guaranteed

100% satisfaction guarantee or we'll make it right

{/* CTA Section */}

Ready for a Spotless Home?

Experience the difference of professional deep cleaning. Book your service today and enjoy a pristine, healthy living environment.

) } [V0_FILE]typescriptreact:file="app/home-cleaning/move-in-out/page.tsx" import { Button } from "@/components/ui/button" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle, Home, Truck, Clock, Shield, Star, Package } from "lucide-react" import Link from "next/link" export default function MoveInOutPage() { return (

{/* Enhanced background animation */}

{/* Hero Section */}

Move In/Out Service

Move In/Out Cleaning

Make your move stress-free with our comprehensive move-in and move-out cleaning services. Perfect for getting your deposit back or starting fresh in your new home.

{/* Service Types */}

Move Out

Move-Out Cleaning Get your full deposit back with our thorough move-out service

$399

Deep clean all rooms
Inside appliances cleaning
Cabinet interiors & exteriors
Baseboards & window sills
Light fixtures & ceiling fans

Move In

Move-In Cleaning Start fresh in your new home with a pristine clean space

$349

Sanitize all surfaces
Deep clean bathrooms & kitchen
Floor deep cleaning & polish
Window cleaning (interior)
Dust removal & air freshening

{/* Detailed Checklist */}

Complete Cleaning Checklist

Kitchen

Inside & outside of all appliances

Cabinet interiors & exteriors

Countertops & backsplash

Sink & faucet deep clean

Floor scrubbing & mopping

Bathrooms

Toilet deep clean & sanitize

Shower/tub scrubbing

Vanity & mirror cleaning

Tile & grout cleaning

Floor sanitization

All Rooms

Baseboards & trim cleaning

Light switches & outlets

Window sills & frames

Closet cleaning (if empty)

Final vacuum & mop

{/* Why Choose Us */}

Same Day Service

Available for urgent move-out needs

Deposit Guarantee

We help ensure you get your deposit back

Flexible Timing

Work around your moving schedule

Quality Assured

Satisfaction guaranteed or we return

{/* CTA Section */}

Make Your Move Stress-Free

Whether you're moving in or out, let us handle the cleaning so you can focus on what matters. Professional service that landlords and new homeowners love.

) } [V0_FILE]typescriptreact:file="components/theme-provider.tsx" "use client" import type * as React from "react" import { createContext, useContext, useEffect, useState } from "react" type Theme = "dark" | "light" | "system" type ThemeProviderProps = { children: React.ReactNode defaultTheme?: Theme storageKey?: string } type ThemeProviderState = { theme: Theme setTheme: (theme: Theme) => void } const initialState: ThemeProviderState = { theme: "system", setTheme: () => null, } const ThemeProviderContext = createContext(initialState) export function ThemeProvider({ children, defaultTheme = "system", storageKey = "vite-ui-theme", ...props }: ThemeProviderProps) { const [theme, setTheme] = useState(() => (localStorage?.getItem(storageKey) as Theme) || defaultTheme) useEffect(() => { const root = window.document.documentElement root.classList.remove("light", "dark") if (theme === "system") { const systemTheme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light" root.classList.add(systemTheme) return } root.classList.add(theme) }, [theme]) const value = { theme, setTheme: (theme: Theme) => { localStorage?.setItem(storageKey, theme) setTheme(theme) }, } return ( {children} ) } export const useTheme = () => { const context = useContext(ThemeProviderContext) if (context === undefined) throw new Error("useTheme must be used within a ThemeProvider") return context } [V0_FILE]typescriptreact:file="app/gallery/page.tsx" "use client" import { useState } from "react" import { Card, CardContent } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { Button } from "@/components/ui/button" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { Play, Star } from "lucide-react" import Image from "next/image" export default function GalleryPage() { const [selectedImage, setSelectedImage] = useState(null) const beforeAfterImages = [ { id: 1, category: "car", service: "Full Valet", before: "/dirty-car-before.png", after: "/clean-shiny-car.png", description: "BMW M3 - Full exterior and interior detail with ceramic coating", }, { id: 2, category: "car", service: "Paint Correction", before: "/scratched-car-paint-before.png", after: "/perfect-car-paint.png", description: "Mercedes C-Class - Paint correction and protection film", }, { id: 3, category: "home", service: "Deep Clean", before: "/messy-kitchen-before.png", after: "/spotless-kitchen.png", description: "Kitchen deep clean with appliance detailing", }, { id: 4, category: "car", service: "Interior Detail", before: "/dirty-car-interior-before.png", after: "/pristine-car-interior-after.png", description: "Range Rover - Complete interior restoration and protection", }, ] const videoTestimonials = [ { id: 1, customer: "James Wilson", service: "Ceramic Coating", thumbnail: "/customer-testimonial-thumbnail.png", duration: "2:15", }, { id: 2, customer: "Sarah Mitchell", service: "Home Deep Clean", thumbnail: "/home-cleaning-testimonial.png", duration: "1:45", }, ] return (

Our Work Gallery

Before & After Transformations

See the incredible transformations we achieve with our premium cleaning and detailing services

Before & After Video Testimonials

{beforeAfterImages.map((item) => (

Before

After

{item.service} {item.category === "car" ? "Car Detail" : "Home Clean"}

{item.description}

))}

{videoTestimonials.map((video) => (

{video.duration}

{video.customer}

{video.service} Experience

{[...Array(5)].map((_, i) => ( ))} 5.0

))}

) } [V0_FILE]typescriptreact:file="app/faq/page.tsx" import { Badge } from "@/components/ui/badge" import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion" import { Card, CardContent } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { MessageCircle, Phone, Mail } from "lucide-react" export default function FAQPage() { const faqs = [ { category: "Booking & Pricing", questions: [ { question: "How do I book a service?", answer: "You can book online through our website, call us directly, or use our mobile app. We offer same-day booking for most services and provide instant quotes based on your vehicle type and selected services.", }, { question: "What's included in the pricing?", answer: "Our pricing includes all materials, equipment, and labor. For car services, pricing varies by vehicle size (hatchback £40-60, SUV £55-70, etc.). Home cleaning includes all eco-friendly supplies and equipment.", }, { question: "Do you offer package deals?", answer: "Yes! We offer maintenance packages with 20-30% savings, bundle deals for multiple services, and loyalty discounts for regular customers. Check our maintenance page for current offers.", }, ], }, { category: "Car Detailing", questions: [ { question: "What's the difference between Mini Valet and Full Valet?", answer: "Mini Valet (£40-60) includes exterior wash, interior vacuum, and basic cleaning. Full Valet (£80-100) adds paint protection, detailed interior cleaning, tire shine, and window treatment.", }, { question: "How long does ceramic coating last?", answer: "Our ceramic coating lasts 2-5 years depending on the package. We offer Bronze (2 years), Silver (3 years), and Gold (5 years) options with full warranties and maintenance support.", }, { question: "Do you work on all vehicle types?", answer: "Yes, we service all vehicle types from small hatchbacks to large SUVs and commercial vehicles. Pricing is adjusted based on vehicle size and complexity.", }, ], }, { category: "Home Cleaning", questions: [ { question: "What areas do you cover for home cleaning?", answer: "We provide comprehensive home cleaning including kitchens, bathrooms, bedrooms, living areas, and common spaces. Deep cleaning includes appliances, inside cabinets, and detailed sanitization.", }, { question: "Are your cleaning products safe?", answer: "We use only eco-friendly, non-toxic cleaning products that are safe for children, pets, and the environment while delivering professional-grade results.", }, { question: "How often should I book regular cleaning?", answer: "Most customers book weekly or bi-weekly regular cleaning. We offer flexible scheduling and can adjust frequency based on your needs and lifestyle.", }, ], }, ] return (

Frequently Asked Questions

Got Questions? We've Got Answers

Find answers to common questions about our services, pricing, and booking process

{faqs.map((category, categoryIndex) => (

{category.category}

{category.questions.map((faq, index) => ( {faq.question} {faq.answer} ))} ))}

Still Have Questions?

Our customer service team is here to help with any additional questions you might have

) } [V0_FILE]typescriptreact:file="app/add-ons/page.tsx" import { Badge } from "@/components/ui/badge" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { Shield, Sparkles, Zap, Star, CheckCircle, Plus } from "lucide-react" import Link from "next/link" export default function AddOnsPage() { const carAddOns = [ { name: "Ceramic Coating", price: "£150-£400", duration: "2-5 years", icon: Shield, description: "Ultimate paint protection with hydrophobic properties", benefits: ["UV Protection", "Scratch Resistance", "Easy Cleaning", "Enhanced Gloss"], }, { name: "Paint Protection Film", price: "£200-£600", duration: "5-10 years", icon: Star, description: "Invisible film protection for high-impact areas", benefits: ["Stone Chip Protection", "Self-Healing", "Maintains Resale Value", "Invisible Coverage"], }, { name: "Interior Protection", price: "£80-£150", duration: "3-5 years", icon: Sparkles, description: "Fabric and leather protection treatment", benefits: ["Stain Resistance", "UV Protection", "Easy Maintenance", "Odor Prevention"], }, { name: "Engine Bay Detail", price: "£60-£120", duration: "One-time", icon: Zap, description: "Complete engine bay cleaning and protection", benefits: ["Improved Performance", "Easier Maintenance", "Better Resale", "Professional Appearance"], }, ] const homeAddOns = [ { name: "Appliance Deep Clean", price: "£40-£80", duration: "One-time", icon: Sparkles, description: "Inside and outside cleaning of all appliances", benefits: ["Oven Deep Clean", "Fridge Sanitization", "Dishwasher Detail", "Microwave Treatment"], }, { name: "Carpet Protection", price: "£60-£120", duration: "6-12 months", icon: Shield, description: "Professional carpet and upholstery protection", benefits: ["Stain Resistance", "Soil Protection", "Extended Life", "Easy Maintenance"], }, { name: "Window Treatment", price: "£30-£60", duration: "One-time", icon: Star, description: "Interior and exterior window cleaning", benefits: ["Streak-Free Finish", "Frame Cleaning", "Sill Detail", "Screen Cleaning"], }, ] return (

Premium Add-On Services

Enhance Your Service

Take your cleaning experience to the next level with our premium add-on services and protection packages

Car Detailing Add-Ons

{carAddOns.map((addon, index) => { const IconComponent = addon.icon return (

{addon.name}

{addon.price}

{addon.duration}

{addon.description}

{addon.benefits.map((benefit, benefitIndex) => (

{benefit}

))}

) })}

Home Cleaning Add-Ons

{homeAddOns.map((addon, index) => { const IconComponent = addon.icon return (

{addon.name}

{addon.price}

{addon.duration}

{addon.description}

{addon.benefits.map((benefit, benefitIndex) => (

{benefit}

))}

) })}

Ready to Enhance Your Service?

Add these premium services to your booking for the ultimate cleaning and protection experience

) } [V0_FILE]png:file="public/dirty-car-before.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/dirty-car-before-RavNtK2leBHNGMOs0rMBsZjDpOPQrF.png" [V0_FILE]png:file="public/clean-shiny-car.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/clean-shiny-car-xdYg5c69OkypThDZqPX0EcRcjzMbbw.png" [V0_FILE]png:file="public/scratched-car-paint-before.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/scratched-car-paint-before-LIFsm7bfgTIQJli8dPSrTvlVE3sc0j.png" [V0_FILE]png:file="public/perfect-car-paint.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/perfect-car-paint-l79ft2FsGcXkK6iMlWRbET1O5fWYGg.png" [V0_FILE]png:file="public/messy-kitchen-before.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/messy-kitchen-before-40efFOAICN6c27VFMjBbANEZC8wIV0.png" [V0_FILE]png:file="public/spotless-kitchen.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/spotless-kitchen-AYWO2eMRFgBXpz7o0Cgdf7RdSYHUVk.png" [V0_FILE]png:file="public/dirty-car-interior-before.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/dirty-car-interior-before-Gm6GCvwDNM8wUC4C3OFO67nWy54Yc9.png" [V0_FILE]png:file="public/pristine-car-interior-after.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/pristine-car-interior-after-sBpEifpkcGs5aO9q0oHC73EtidJGsV.png" [V0_FILE]png:file="public/customer-testimonial-thumbnail.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/customer-testimonial-thumbnail-Y7NsljTwmopMCA38Qu6ciO39pNGsZX.png" [V0_FILE]png:file="public/home-cleaning-testimonial.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/home-cleaning-testimonial-GnARIH1PFpyp78mqeiJPYlNIw0dqHB.png" [V0_FILE]typescriptreact:file="app/loyalty/page.tsx" import { Badge } from "@/components/ui/badge" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { Crown, Gift, Star, Trophy, Users, Calendar, Percent } from "lucide-react" import Link from "next/link" export default function LoyaltyPage() { const tiers = [ { name: "Silver Member", icon: Star, visits: "5-9 visits", discount: "10%", benefits: ["Priority booking", "10% discount", "Birthday bonus", "Email support"], color: "text-gray-400", }, { name: "Gold Member", icon: Crown, visits: "10-19 visits", discount: "15%", benefits: ["All Silver benefits", "15% discount", "Free add-on monthly", "Phone support", "Flexible scheduling"], color: "text-yellow-500", }, { name: "Platinum Member", icon: Trophy, visits: "20+ visits", discount: "20%", benefits: [ "All Gold benefits", "20% discount", "VIP treatment", "Dedicated account manager", "Free emergency service", ], color: "text-purple-500", }, ] const rewards = [ { name: "Free Mini Valet", points: 500, description: "Redeem for a complimentary mini valet service", }, { name: "£20 Service Credit", points: 800, description: "Apply towards any service booking", }, { name: "Free Add-on Service", points: 1000, description: "Choose any premium add-on service for free", }, { name: "Full Valet Package", points: 1500, description: "Complete interior and exterior detailing service", }, ] return (

Loyalty Program

Tidy Team Rewards

Earn points with every service and unlock exclusive benefits, discounts, and VIP treatment

{/* Membership Tiers */}

Membership Tiers

{tiers.map((tier, index) => { const IconComponent = tier.icon return (

{tier.name}

{tier.discount}

{tier.visits}

{tier.benefits.map((benefit, benefitIndex) => (

{benefit}

))}

) })}

{/* How It Works */}

How It Works

Book Services

Every service booking earns you points and counts towards your tier status

Earn Points

Collect 1 point per £1 spent, plus bonus points for reviews and referrals

Unlock Tiers

Advance through Silver, Gold, and Platinum tiers for better benefits

Redeem Rewards

Use points for free services, discounts, and exclusive perks

{/* Rewards Catalog */}

Rewards Catalog

{rewards.map((reward, index) => (

{reward.name}

{reward.points} pts

{reward.description}

))}

{/* Join CTA */}

Ready to Start Earning Rewards?

Join our loyalty program today and start earning points with your first service booking

Free to join • Instant benefits • No expiration on points

) } [V0_FILE]typescriptreact:file="app/layout.tsx" import type React from "react" import type { Metadata } from "next" import { DM_Sans } from "next/font/google" import "./globals.css" import { Navigation } from "@/components/navigation" import { Footer } from "@/components/footer" import { ThemeProvider } from "@/components/theme-provider" import { LiveChat } from "@/components/live-chat" const dmSans = DM_Sans({ subsets: ["latin"], display: "swap", variable: "--font-dm-sans", }) export const metadata: Metadata = { title: "The Tidy Team Services - Shine Beyond Limits", description: "Premium car detailing and home cleaning services. Professional, reliable, and futuristic approach to keeping your vehicles and spaces pristine.", generator: "v0.app", keywords: ["car detailing", "home cleaning", "ceramic coating", "paint protection", "premium services"], openGraph: { title: "The Tidy Team Services - Shine Beyond Limits", description: "Premium car detailing and home cleaning services with a futuristic approach.", type: "website", }, } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return (

{children}

) } [V0_FILE]typescriptreact:file="app/services/interior/page.tsx" isQuickEdit="true" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle, Clock, Shield, Sparkles, ArrowRight } from "lucide-react" export default function InteriorCleaningPage() { const packages = [ { name: "Essential Interior", smallPrice: "£35", suvPrice: "£45", duration: "2-3 hours", features: [ "Complete vacuum of seats, carpets, and mats", "Dashboard and console cleaning", "Window cleaning (interior)", "Door panel and trim cleaning", "Basic leather/fabric conditioning", ], popular: false, }, { name: "Premium Interior", smallPrice: "£60", suvPrice: "£75", duration: "3-4 hours", features: [ "Everything in Essential Interior", "Deep steam cleaning of upholstery", "Leather treatment and protection", "Air vent deep cleaning", "Stain removal treatment", "UV protection application", ], popular: true, }, { name: "Luxury Interior", smallPrice: "£100", suvPrice: "£130", duration: "4-6 hours", features: [ "Everything in Premium Interior", "Ceramic coating for leather surfaces", "Odor elimination treatment", "Headliner deep cleaning", "Trunk/cargo area detailing", "6-month protection guarantee", ], popular: false, }, ] return (

{/* Header Section */}

Interior Cleaning Services

Interior Detailing

Transform your vehicle's interior with our premium cleaning services. From basic maintenance to luxury treatments, we restore your cabin to pristine condition.

{/* Pricing Cards */}

{packages.map((pkg, index) => ( {pkg.popular && (

Most Popular

)} {pkg.name}

{pkg.smallPrice}

Small Car

{pkg.suvPrice}

SUV

Small Car: Hatchback, Sedan | SUV: 4x4, Large Vehicle

{pkg.duration}

{feature}

))}

{/* Features Section */}

Why Choose Our Interior Services?

Advanced Protection

Our treatments provide long-lasting protection against wear, UV damage, and stains.

Premium Products

We use only the finest cleaning products and conditioners for optimal results.

Satisfaction Guaranteed

100% satisfaction guarantee with free touch-ups within 7 days.

Book Your Service

Ready to transform your vehicle's interior? Get started with a free consultation.

) } [V0_FILE]typescriptreact:file="app/services/exterior/page.tsx" isQuickEdit="true" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle, Clock, Droplets, Sparkles, ArrowRight, Car } from "lucide-react" export default function ExteriorWashPage() { const packages = [ { name: "Express Wash", smallPrice: "£15", suvPrice: "£25", duration: "1-2 hours", features: [ "Hand wash with premium soap", "Wheel and tire cleaning", "Window cleaning (exterior)", "Quick dry and basic wax", "Tire shine application", ], popular: false, }, { name: "Premium Wash", smallPrice: "£35", suvPrice: "£45", duration: "2-3 hours", features: [ "Everything in Express Wash", "Clay bar treatment", "Paint decontamination", "Premium wax application", "Chrome and trim polishing", "Undercarriage cleaning", ], popular: true, }, { name: "Signature Wash", smallPrice: "£60", suvPrice: "£75", duration: "3-4 hours", features: [ "Everything in Premium Wash", "Paint correction (minor scratches)", "Ceramic spray coating", "Headlight restoration", "Engine bay cleaning", "3-month protection guarantee", ], popular: false, }, ] return (

{/* Header Section */}

Exterior Wash Services

Exterior Detailing

Restore your vehicle's exterior shine with our comprehensive wash and protection services. From quick maintenance to premium treatments that make your car gleam.

{/* Pricing Cards */}

{packages.map((pkg, index) => ( {pkg.popular && (

Most Popular

)} {pkg.name}

{pkg.smallPrice}

Small Car

{pkg.suvPrice}

SUV

Small Car: Hatchback, Sedan | SUV: 4x4, Large Vehicle

{pkg.duration}

{feature}

))}

{/* Process Section */}

Our Exterior Wash Process

{[ { step: "01", title: "Pre-Rinse", description: "Thorough rinse to remove loose dirt and debris", icon: Droplets, }, { step: "02", title: "Hand Wash", description: "Gentle hand washing with premium soaps and mitts", icon: Car, }, { step: "03", title: "Detail Clean", description: "Wheels, tires, and trim receive special attention", icon: Sparkles, }, { step: "04", title: "Protect & Shine", description: "Wax application and final inspection for perfection", icon: CheckCircle, }, ].map((process, index) => (

{process.step}

{process.title}

{process.description}

))}

{/* CTA Section */}

Ready for a Showroom Shine?

Book your exterior wash service today and experience the difference professional detailing makes.

) } [V0_FILE]typescriptreact:file="app/services/full-detailing/page.tsx" isQuickEdit="true" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle, Clock, Crown, Sparkles, ArrowRight, Shield, Star } from "lucide-react" export default function FullDetailingPage() { const packages = [ { name: "Complete Detail", smallPrice: "£100", suvPrice: "£130", duration: "6-8 hours", features: [ "Full interior and exterior cleaning", "Paint correction and polishing", "Leather conditioning and protection", "Engine bay detailing", "Wheel and tire deep cleaning", "6-month protection warranty", ], popular: false, }, { name: "Premium Detail", smallPrice: "£160", suvPrice: "£200", duration: "8-10 hours", features: [ "Everything in Complete Detail", "Ceramic coating application", "Paint protection film consultation", "Headlight restoration", "Odor elimination treatment", "12-month protection warranty", "Monthly maintenance included", ], popular: true, }, { name: "Concours Detail", smallPrice: "£250", suvPrice: "£320", duration: "2-3 days", features: [ "Everything in Premium Detail", "Multi-stage paint correction", "Professional ceramic coating", "Interior ceramic protection", "Show-quality finish", "Lifetime maintenance program", "White-glove pickup/delivery", ], popular: false, }, ] return (

{/* Header Section */}

Full Detailing Services

Complete Detailing

The ultimate automotive care experience. Our full detailing services combine interior and exterior treatments to restore your vehicle to better-than-new condition.

{/* Pricing Cards */}

{packages.map((pkg, index) => ( {pkg.popular && (

Most Popular

)} {pkg.name}

{pkg.smallPrice}

Small Car

{pkg.suvPrice}

SUV

Small Car: Hatchback, Sedan | SUV: 4x4, Large Vehicle

{pkg.duration}

{feature}

))}

{/* Benefits Section */}

The Full Detail Difference

Concours-Level Results

Our full detailing achieves show-quality results that exceed even the most demanding standards.

Long-Term Protection

Advanced coatings and treatments provide years of protection against environmental damage.

Value Preservation

Professional detailing maintains and enhances your vehicle's resale value significantly.

What's Included

• Complete interior deep cleaning and protection
• Multi-stage exterior paint correction
• Professional ceramic coating application
• Engine bay detailing and protection
• Wheel and tire ceramic coating
• Glass treatment and rain repellent

Satisfaction Guarantee

We stand behind our work with a 100% satisfaction guarantee. If you're not completely happy, we'll make it right at no additional cost.

{/* CTA Section */}

Transform Your Vehicle Today

Experience the ultimate in automotive care. Book your full detailing service and discover what perfection looks like.

Free consultation • Flexible scheduling • Lifetime support

) } [V0_FILE]png:file="public/tidy-team-logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/1-pcA9hfw0fkOJK3YZ75MntJxrCMYYHb.png" [V0_FILE]typescriptreact:file="app/home-cleaning/regular-maintenance/page.tsx" isQuickEdit="true" import { Button } from "@/components/ui/button" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle, Home, Calendar, Clock, Shield, Repeat } from "lucide-react" import Link from "next/link" export default function RegularMaintenancePage() { return (

{/* Enhanced background animation */}

{/* Hero Section */}

Recurring Service

Regular Maintenance Cleaning

Keep your home consistently clean with our regular maintenance service. Scheduled cleaning that fits your lifestyle and maintains your space perfectly.

{/* Frequency Options */}

Popular

Weekly Cleaning Perfect for busy families and high-traffic homes

$149

per visit

All living areas cleaned
Kitchen & bathroom maintenance
Vacuuming & mopping
Dusting & surface cleaning

Best Value

Bi-Weekly Cleaning Ideal balance of cleanliness and affordability

$179

per visit

Comprehensive home cleaning
Deep kitchen & bathroom clean
Floor care & maintenance
Detailed dusting & organizing

Flexible

Monthly Cleaning Maintenance cleaning for well-kept homes

$229

per visit

Thorough monthly deep clean
All areas detailed cleaning
Appliance exterior cleaning
Baseboards & window sills

{/* Benefits Section */}

Why Choose Regular Maintenance?

Save Time

More time for what matters most to you

Consistent Quality

Same high standards every visit

Flexible Scheduling

Schedule that works with your lifestyle

Healthier Home

Regular cleaning maintains hygiene

{/* What's Included */}

What's Included in Every Visit

Living Areas & Bedrooms

Dusting all surfaces and furniture

Vacuuming carpets and rugs

Mopping hard floors

Making beds and tidying

Emptying trash bins

Kitchen & Bathrooms

Cleaning and sanitizing surfaces

Scrubbing sinks and fixtures

Cleaning appliance exteriors

Toilet cleaning and sanitizing

Mirror and glass cleaning

{/* CTA Section */}

Start Your Maintenance Plan Today

Join hundreds of satisfied customers who trust us with their regular home maintenance. Flexible scheduling, consistent quality, and peace of mind.

) } [V0_FILE]typescriptreact:file="app/book/loading.tsx" isFixed="true" export default function Loading() { return null } [V0_FILE]typescriptreact:file="app/maintenance/page.tsx" isQuickEdit="true" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Badge } from "@/components/ui/badge" import { CheckCircle, Clock, Calendar, Zap, ArrowRight, Star, Shield, Sparkles, Crown, Award, Gem } from "lucide-react" export default function MaintenancePackagesPage() { const packages = [ { name: "Essential Care", frequency: "Monthly", smallPrice: "£35", suvPrice: "£45", originalSmallPrice: "£50", originalSuvPrice: "£60", savings: "Save 30%", duration: "2-3 hours", icon: Shield, color: "emerald", features: [ "Exterior wash and wax", "Interior vacuum and wipe down", "Tire cleaning and shine", "Window cleaning (inside & out)", "Dashboard conditioning", "Priority booking", ], popular: false, glowColor: "from-emerald-500/30 to-emerald-300/10", borderColor: "border-emerald-500/30", bgGradient: "from-emerald-50/5 to-emerald-100/5", }, { name: "Premium Care", frequency: "Quarterly", smallPrice: "£60", suvPrice: "£75", originalSmallPrice: "£90", originalSuvPrice: "£110", savings: "Save 33%", duration: "4-5 hours", icon: Award, color: "blue", features: [ "Everything in Essential Care", "Paint decontamination", "Leather conditioning", "Engine bay cleaning", "Headlight restoration", "Ceramic spray coating", "Free emergency touch-ups", ], popular: true, glowColor: "from-blue-500/50 to-blue-300/20", borderColor: "border-blue-500/50", bgGradient: "from-blue-50/10 to-blue-100/10", }, { name: "Luxury Care", frequency: "Yearly", smallPrice: "£100", suvPrice: "£130", originalSmallPrice: "£160", originalSuvPrice: "£200", savings: "Save 40%", duration: "Full day", icon: Crown, color: "purple", features: [ "Everything in Premium Care", "Professional ceramic coating", "Paint correction service", "Interior protection treatment", "Odor elimination", "Concierge pickup/delivery", "Unlimited touch-ups", "VIP customer support", ], popular: false, glowColor: "from-purple-500/40 to-purple-300/15", borderColor: "border-purple-500/40", bgGradient: "from-purple-50/8 to-purple-100/8", }, ] return (

{/* Header Section */}

Maintenance Packages

Subscription Plans

Keep your vehicle in pristine condition year-round with our convenient maintenance packages. Save money, time, and ensure your car always looks its best with regular professional care.

{/* Pricing Cards with Animated Borders */}

{packages.map((pkg, index) => { const IconComponent = pkg.icon return (

{pkg.popular && (

⭐ Most Popular

)} {/* Animated Glowing Border */}

{/* Icon and Frequency */}

{pkg.frequency}

{pkg.name} {/* Enhanced Pricing Display */}

{pkg.smallPrice}

{pkg.originalSmallPrice}

Small Car

{pkg.suvPrice}

{pkg.originalSuvPrice}

SUV

{pkg.savings}

Small Car: Hatchback, Sedan | SUV: 4x4, Large Vehicle

{/* Duration */}

{pkg.duration}

{/* Features List */}

{feature}

{/* Enhanced Subscribe Button */}

) })}

{/* Benefits Section */}

Why Choose Maintenance Packages?

Significant Savings

Save up to 40% compared to individual services. The more you commit, the more you save.

Convenient Scheduling

Priority booking and automated reminders ensure your car gets the care it needs on schedule.

Consistent Quality

Regular maintenance prevents damage and keeps your vehicle looking and performing its best.

Premium Benefits

Priority booking and flexible scheduling
Dedicated customer support team
Free emergency touch-ups between services
Detailed service reports and photos
Cancel or modify anytime

Smart Scheduling

Our intelligent scheduling system tracks your vehicle's needs and automatically books your next service at the optimal time.

{/* Comparison Table */}

Package Comparison

{[ ["Exterior Wash & Wax", true, true, true], ["Interior Cleaning", true, true, true], ["Paint Decontamination", false, true, true], ["Ceramic Coating", false, true, true], ["Paint Correction", false, false, true], ["Pickup/Delivery", false, false, true], ["Emergency Touch-ups", false, true, true], ["VIP Support", false, false, true], ].map(([service, essential, premium, luxury], index) => ( ))}

Service	Essential	Premium	Luxury
{service}	{essential ? ( ) : ( )}	{premium ? ( ) : ( )}	{luxury ? ( ) : ( )}

{/* CTA Section */}

Start Your Maintenance Journey

Choose the perfect maintenance package for your vehicle and enjoy consistent, professional care that keeps your car looking its absolute best.

No commitment

Cancel anytime

30-day guarantee

) } [V0_FILE]css:file="app/globals.css" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); :root { /* Enhanced color palette with more sophisticated blues and complementary colors */ --background: oklch(0.99 0.005 240); /* Subtle blue-tinted white */ --foreground: oklch(0.15 0.02 240); /* Deep blue-black */ --card: oklch(0.98 0.01 240 / 0.95); /* Subtle blue-tinted cards */ --card-foreground: oklch(0.15 0.02 240); /* Deep blue-black text */ --popover: oklch(0.99 0.005 240 / 0.98); /* Clean popover */ --popover-foreground: oklch(0.15 0.02 240); /* Deep text */ --primary: oklch(0.55 0.25 235); /* Refined electric blue */ --primary-foreground: oklch(0.99 0.005 240); /* Clean white */ --secondary: oklch(0.92 0.02 240); /* Subtle blue-gray */ --secondary-foreground: oklch(0.25 0.03 240); /* Dark blue-gray */ --muted: oklch(0.88 0.015 240 / 0.8); /* Soft blue-gray */ --muted-foreground: oklch(0.45 0.02 240); /* Medium blue-gray */ --accent: oklch(0.65 0.2 45); /* Warm amber accent */ --accent-foreground: oklch(0.99 0.005 240); /* Clean white */ --destructive: oklch(0.58 0.25 15); /* Warm red */ --destructive-foreground: oklch(0.99 0.005 240); /* Clean white */ --border: oklch(0.85 0.01 240 / 0.3); /* Subtle blue borders */ --input: oklch(0.96 0.01 240); /* Light blue input */ --ring: oklch(0.55 0.25 235); /* Primary focus ring */ --chart-1: oklch(0.55 0.25 235); /* Primary blue */ --chart-2: oklch(0.65 0.2 45); /* Amber */ --chart-3: oklch(0.6 0.2 160); /* Teal */ --chart-4: oklch(0.65 0.2 300); /* Purple */ --chart-5: oklch(0.6 0.2 15); /* Coral */ --radius: 0.5rem; --sidebar: oklch(0.96 0.01 240); /* Light sidebar */ --sidebar-foreground: oklch(0.15 0.02 240); /* Dark sidebar text */ --sidebar-primary: oklch(0.55 0.25 235); /* Primary sidebar */ --sidebar-primary-foreground: oklch(0.99 0.005 240); /* White sidebar text */ --sidebar-accent: oklch(0.65 0.2 45); /* Amber sidebar accent */ --sidebar-accent-foreground: oklch(0.99 0.005 240); /* White accent text */ --sidebar-border: oklch(0.85 0.01 240 / 0.3); /* Subtle sidebar border */ --sidebar-ring: oklch(0.55 0.25 235); /* Primary sidebar ring */ /* Added service-specific color variables */ --service-interior: oklch(0.6 0.2 160); /* Teal for interior */ --service-exterior: oklch(0.55 0.25 235); /* Primary blue for exterior */ --service-maintenance: oklch(0.65 0.2 45); /* Amber for maintenance */ --service-premium: oklch(0.65 0.2 300); /* Purple for premium */ } .dark { /* Enhanced dark mode with better contrast and sophisticated colors */ --background: oklch(0.08 0.01 240); /* Deep blue-black */ --foreground: oklch(0.95 0.01 240); /* Clean blue-white */ --card: oklch(0.12 0.015 240 / 0.9); /* Dark blue cards */ --card-foreground: oklch(0.95 0.01 240); /* Clean text */ --popover: oklch(0.08 0.01 240 / 0.98); /* Dark popover */ --popover-foreground: oklch(0.95 0.01 240); /* Clean popover text */ --primary: oklch(0.7 0.3 235); /* Bright electric blue */ --primary-foreground: oklch(0.08 0.01 240); /* Dark text on primary */ --secondary: oklch(0.18 0.02 240); /* Dark blue-gray */ --secondary-foreground: oklch(0.85 0.02 240); /* Light secondary text */ --muted: oklch(0.25 0.02 240 / 0.6); /* Muted dark blue */ --muted-foreground: oklch(0.65 0.02 240); /* Medium light text */ --accent: oklch(0.75 0.25 45); /* Bright amber accent */ --accent-foreground: oklch(0.08 0.01 240); /* Dark accent text */ --destructive: oklch(0.65 0.3 15); /* Bright red */ --destructive-foreground: oklch(0.95 0.01 240); /* Clean white */ --border: oklch(0.25 0.02 240 / 0.4); /* Dark blue borders */ --input: oklch(0.15 0.02 240); /* Dark input */ --ring: oklch(0.7 0.3 235); /* Bright focus ring */ --chart-1: oklch(0.7 0.3 235); /* Bright primary */ --chart-2: oklch(0.75 0.25 45); /* Bright amber */ --chart-3: oklch(0.7 0.25 160); /* Bright teal */ --chart-4: oklch(0.75 0.25 300); /* Bright purple */ --chart-5: oklch(0.7 0.25 15); /* Bright coral */ --sidebar: oklch(0.12 0.015 240); /* Dark sidebar */ --sidebar-foreground: oklch(0.95 0.01 240); /* Light sidebar text */ --sidebar-primary: oklch(0.7 0.3 235); /* Bright sidebar primary */ --sidebar-primary-foreground: oklch(0.08 0.01 240); /* Dark sidebar primary text */ --sidebar-accent: oklch(0.75 0.25 45); /* Bright sidebar accent */ --sidebar-accent-foreground: oklch(0.08 0.01 240); /* Dark sidebar accent text */ --sidebar-border: oklch(0.25 0.02 240 / 0.4); /* Dark sidebar border */ --sidebar-ring: oklch(0.7 0.3 235); /* Bright sidebar ring */ /* Enhanced service colors for dark mode */ --service-interior: oklch(0.7 0.25 160); /* Bright teal */ --service-exterior: oklch(0.7 0.3 235); /* Bright blue */ --service-maintenance: oklch(0.75 0.25 45); /* Bright amber */ --service-premium: oklch(0.75 0.25 300); /* Bright purple */ } @theme inline { --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); /* Added service color tokens */ --color-service-interior: var(--service-interior); --color-service-exterior: var(--service-exterior); --color-service-maintenance: var(--service-maintenance); --color-service-premium: var(--service-premium); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; background: var(--background); scroll-behavior: smooth; } /* Enhanced glow effects with better color harmony */ .neon-glow { box-shadow: 0 0 20px oklch(0.55 0.25 235 / 0.4), 0 0 40px oklch(0.55 0.25 235 / 0.2), inset 0 0 20px oklch(0.55 0.25 235 / 0.1); transition: all 0.3s ease; } .neon-glow:hover { box-shadow: 0 0 30px oklch(0.55 0.25 235 / 0.6), 0 0 60px oklch(0.55 0.25 235 / 0.3), inset 0 0 30px oklch(0.55 0.25 235 / 0.15); } .neon-text { text-shadow: 0 0 10px oklch(0.55 0.25 235 / 0.6), 0 0 20px oklch(0.55 0.25 235 / 0.3), 0 0 30px oklch(0.55 0.25 235 / 0.1); } /* Enhanced glass morphism with better opacity and blur */ .glass { background: oklch(0.99 0.005 240 / 0.8); backdrop-filter: blur(20px); border: 1px solid oklch(0.85 0.01 240 / 0.2); box-shadow: 0 8px 32px oklch(0.15 0.02 240 / 0.1), inset 0 1px 0 oklch(0.99 0.005 240 / 0.8); } .dark .glass { background: oklch(0.12 0.015 240 / 0.8); border: 1px solid oklch(0.25 0.02 240 / 0.3); box-shadow: 0 8px 32px oklch(0.08 0.01 240 / 0.5), inset 0 1px 0 oklch(0.25 0.02 240 / 0.3); } /* Added service-specific glow effects */ .service-interior-glow { box-shadow: 0 0 20px oklch(0.6 0.2 160 / 0.3), 0 0 40px oklch(0.6 0.2 160 / 0.1); } .service-exterior-glow { box-shadow: 0 0 20px oklch(0.55 0.25 235 / 0.3), 0 0 40px oklch(0.55 0.25 235 / 0.1); } .service-maintenance-glow { box-shadow: 0 0 20px oklch(0.65 0.2 45 / 0.3), 0 0 40px oklch(0.65 0.2 45 / 0.1); } .service-premium-glow { box-shadow: 0 0 20px oklch(0.65 0.2 300 / 0.3), 0 0 40px oklch(0.65 0.2 300 / 0.1); } @keyframes pulse-glow { 0%, 100% { box-shadow: 0 0 20px oklch(0.55 0.25 235 / 0.3); } 50% { box-shadow: 0 0 40px oklch(0.55 0.25 235 / 0.6); } } /* Enhanced gradient animations */ @keyframes gradient-shift { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } } .animate-gradient { background-size: 200% 200%; animation: gradient-shift 6s ease infinite; } .animate-pulse-glow { animation: pulse-glow 3s ease-in-out infinite; } .hover-lift { transition: transform 0.3s ease, box-shadow 0.3s ease; } .hover-lift:hover { transform: translateY(-5px); box-shadow: 0 10px 40px oklch(0.55 0.25 235 / 0.2), 0 0 20px oklch(0.55 0.25 235 / 0.3); } @keyframes sparkle { 0%, 100% { opacity: 0.3; transform: scale(0.8); } 50% { opacity: 1; transform: scale(1.2); } } .animate-sparkle { animation: sparkle 2s ease-in-out infinite; } .animate-sparkle-delayed { animation: sparkle 2s ease-in-out infinite; animation-delay: 0.5s; } /* Added premium gradient backgrounds */ .gradient-primary { background: linear-gradient(135deg, oklch(0.55 0.25 235), oklch(0.65 0.2 45)); } .gradient-service { background: linear-gradient(135deg, oklch(0.6 0.2 160), oklch(0.55 0.25 235), oklch(0.65 0.2 300)); } .gradient-premium { background: linear-gradient(135deg, oklch(0.65 0.2 300), oklch(0.55 0.25 235), oklch(0.65 0.2 45)); } } [V0_FILE]typescriptreact:file="components/theme-toggle.tsx" "use client" import { Moon, Sun } from "lucide-react" import { useTheme } from "./theme-provider" import { Button } from "@/components/ui/button" export function ThemeToggle() { const { theme, setTheme } = useTheme() return ( ) } [V0_FILE]typescriptreact:file="app/privacy/page.tsx" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" export default function PrivacyPolicy() { return (

Privacy Policy

How we collect, use, and protect your personal information

Information We Collect

Personal Information

We collect information you provide directly to us, such as when you create an account, book a service, or contact us for support. This may include your name, email address, phone number, and address.

Service Information

We collect information about the services you book, including service type, scheduling preferences, and any special instructions you provide.

How We Use Your Information

We use the information we collect to provide, maintain, and improve our services, process transactions, send you technical notices and support messages, and communicate with you about products, services, and promotional offers.

Information Sharing

We do not sell, trade, or otherwise transfer your personal information to third parties without your consent, except as described in this policy or as required by law.

Contact Us

If you have any questions about this Privacy Policy, please contact us at privacy@tidyteam.com or call (555) 123-4567.

) } [V0_FILE]typescriptreact:file="app/terms/page.tsx" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" export default function TermsOfService() { return (

Terms of Service

Terms and conditions for using our services

Service Agreement

Service Provision

The Tidy Team provides professional car detailing and home cleaning services. All services are subject to availability and scheduling constraints.

Booking and Cancellation

Bookings can be made through our website or by phone. Cancellations must be made at least 24 hours in advance to avoid cancellation fees. Same-day cancellations may be subject to a 50% service fee.

Payment Terms

Payment is due upon completion of services unless otherwise arranged. We accept cash, credit cards, and bank transfers. Subscription packages are billed monthly in advance.

Satisfaction Guarantee

We stand behind our work with a 100% satisfaction guarantee. If you're not completely satisfied with our service, we'll make it right at no additional cost.

Liability

While we take every precaution to protect your property, our liability is limited to the cost of the service provided. We carry comprehensive insurance for your peace of mind.

Contact Information

For questions about these terms, please contact us at info@tidyteam.com or call (555) 123-4567.

) } [V0_FILE]png:file="public/professional-car-detailing-service-demonstration.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-car-detailing-service-demonstration-tiXyzkluDTzrHmX6cjhVSwiOTvndsk.png" [V0_FILE]png:file="public/professional-car-detailing-service-team-working-on.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-car-detailing-service-team-working-on-AO2exX4gn76IErE64sf4B3zKXFnrE2.png" [V0_FILE]typescriptreact:file="components/navigation.tsx" isQuickEdit="true" "use client" import { useState, useEffect, useRef } from "react" import Link from "next/link" import { Button } from "@/components/ui/button" import { ChevronDown, Menu, X } from "lucide-react" import { ThemeToggle } from "@/components/theme-toggle" import Image from "next/image" export function Navigation() { const [isOpen, setIsOpen] = useState(false) const [showDetailServices, setShowDetailServices] = useState(false) const [showHomeCleaning, setShowHomeCleaning] = useState(false) const [detailServicesClicked, setDetailServicesClicked] = useState(false) const [homeCleaningClicked, setHomeCleaningClicked] = useState(false) const detailServicesRef = useRef(null) const homeCleaningRef = useRef(null) useEffect(() => { const handleClickOutside = (event: MouseEvent) => { if (detailServicesRef.current && !detailServicesRef.current.contains(event.target as Node)) { setDetailServicesClicked(false) setShowDetailServices(false) } if (homeCleaningRef.current && !homeCleaningRef.current.contains(event.target as Node)) { setHomeCleaningClicked(false) setShowHomeCleaning(false) } } document.addEventListener("mousedown", handleClickOutside) return () => { document.removeEventListener("mousedown", handleClickOutside) } }, []) useEffect(() => { let timer: NodeJS.Timeout if (detailServicesClicked) { timer = setTimeout(() => { setDetailServicesClicked(false) setShowDetailServices(false) }, 5000) } return () => clearTimeout(timer) }, [detailServicesClicked]) useEffect(() => { let timer: NodeJS.Timeout if (homeCleaningClicked) { timer = setTimeout(() => { setHomeCleaningClicked(false) setShowHomeCleaning(false) }, 5000) } return () => clearTimeout(timer) }, [homeCleaningClicked]) const handleDetailServicesClick = () => { setDetailServicesClicked(true) setShowDetailServices(true) } const handleHomeCleaningClick = () => { setHomeCleaningClicked(true) setShowHomeCleaning(true) } const handleMenuOptionClick = (menuType: "detail" | "home") => { if (menuType === "detail") { setDetailServicesClicked(false) setShowDetailServices(false) } else { setHomeCleaningClicked(false) setShowHomeCleaning(false) } } return (

Tidy Team

Services

Tidy Team Services

{/* Desktop Navigation */}

Home

{(showDetailServices || detailServicesClicked) && (

!detailServicesClicked && setShowDetailServices(true)} onMouseLeave={() => !detailServicesClicked && setShowDetailServices(false)} >

handleMenuOptionClick("detail")} >

Interior Cleaning

Deep clean your vehicle's interior

handleMenuOptionClick("detail")} >

Exterior Wash

Premium exterior cleaning service

handleMenuOptionClick("detail")} >

Full Detailing

Complete interior & exterior service

)}

Maintenance Packages

{(showHomeCleaning || homeCleaningClicked) && (

!homeCleaningClicked && setShowHomeCleaning(true)} onMouseLeave={() => !homeCleaningClicked && setShowHomeCleaning(false)} >

handleMenuOptionClick("home")} >

Deep Cleaning

Thorough home deep cleaning service

handleMenuOptionClick("home")} >

Regular Maintenance

Weekly & monthly cleaning plans

handleMenuOptionClick("home")} >

Move In/Out Cleaning

Complete move-in/out cleaning

)}

Education

{/* Mobile menu button */}

{/* Mobile Navigation */} {isOpen && (

setIsOpen(false)} > Home

Detail Services

setIsOpen(false)} > Interior Cleaning setIsOpen(false)} > Exterior Wash setIsOpen(false)} > Full Detailing

setIsOpen(false)} > Maintenance Packages

Home Cleaning

setIsOpen(false)} > Deep Cleaning setIsOpen(false)} > Regular Maintenance setIsOpen(false)} > Move In/Out Cleaning

setIsOpen(false)} > Education

)}

) } export default Navigation [V0_FILE]typescriptreact:file="components/footer.tsx" isQuickEdit="true" "use client" import Link from "next/link" import Image from "next/image" import { Phone, Mail, MapPin, Facebook, Twitter, Instagram } from "lucide-react" const RedditIcon = ({ className }: { className?: string }) => ( ) export function Footer() { return ( ) } export default Footer [V0_FILE]typescriptreact:file="app/book/page.tsx" isQuickEdit="true" "use client" import { useState } from "react" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Input } from "@/components/ui/input" import { Textarea } from "@/components/ui/textarea" import { Badge } from "@/components/ui/badge" import { Calendar, Clock, Car, User, CheckCircle, CreditCard, Home, Building } from "lucide-react" import Navigation from "@/components/navigation" export default function BookPage() { const [step, setStep] = useState(1) const [serviceType, setServiceType] = useState<"car" | "house">("car") const [bookingData, setBookingData] = useState({ service: "", package: "", date: "", time: "", vehicle: { make: "", model: "", year: "", color: "", }, property: { type: "", size: "", rooms: "", frequency: "", }, customer: { name: "", email: "", phone: "", address: "", }, notes: "", }) const carServices = [ { id: "interior", name: "Interior Detailing", description: "Deep clean and protection for your vehicle's interior", duration: "2-3 hours", packages: [ { name: "Basic Interior", price: 89, duration: "2 hours" }, { name: "Premium Interior", price: 149, duration: "2.5 hours" }, { name: "Luxury Interior", price: 199, duration: "3 hours" }, ], }, { id: "exterior", name: "Exterior Detailing", description: "Complete exterior cleaning and protection", duration: "1.5-2.5 hours", packages: [ { name: "Basic Wash", price: 69, duration: "1.5 hours" }, { name: "Premium Wash", price: 119, duration: "2 hours" }, { name: "Luxury Wash", price: 169, duration: "2.5 hours" }, ], }, { id: "full", name: "Full Detailing", description: "Complete interior and exterior detailing service", duration: "4-6 hours", packages: [ { name: "Complete Detail", price: 199, duration: "4 hours" }, { name: "Premium Detail", price: 299, duration: "5 hours" }, { name: "Luxury Detail", price: 399, duration: "6 hours" }, ], }, { id: "ceramic", name: "Ceramic Coating", description: "Long-lasting paint protection with ceramic technology", duration: "6-8 hours", packages: [ { name: "1-Year Protection", price: 599, duration: "6 hours" }, { name: "3-Year Protection", price: 899, duration: "7 hours" }, { name: "5-Year Protection", price: 1299, duration: "8 hours" }, ], }, ] const houseServices = [ { id: "regular", name: "Regular House Cleaning", description: "Weekly or bi-weekly house cleaning service", duration: "2-4 hours", packages: [ { name: "Basic Clean", price: 89, duration: "2 hours" }, { name: "Deep Clean", price: 149, duration: "3 hours" }, { name: "Premium Clean", price: 199, duration: "4 hours" }, ], }, { id: "deep", name: "Deep House Cleaning", description: "Comprehensive one-time deep cleaning service", duration: "4-8 hours", packages: [ { name: "Standard Deep Clean", price: 199, duration: "4 hours" }, { name: "Premium Deep Clean", price: 299, duration: "6 hours" }, { name: "Ultimate Deep Clean", price: 399, duration: "8 hours" }, ], }, { id: "move", name: "Move In/Out Cleaning", description: "Complete cleaning for moving in or out", duration: "4-6 hours", packages: [ { name: "Move Clean", price: 249, duration: "4 hours" }, { name: "Premium Move Clean", price: 349, duration: "5 hours" }, { name: "Ultimate Move Clean", price: 449, duration: "6 hours" }, ], }, { id: "commercial", name: "Commercial Cleaning", description: "Professional office and commercial space cleaning", duration: "2-6 hours", packages: [ { name: "Basic Office Clean", price: 149, duration: "2 hours" }, { name: "Premium Office Clean", price: 249, duration: "4 hours" }, { name: "Complete Commercial Clean", price: 399, duration: "6 hours" }, ], }, ] const timeSlots = [ "8:00 AM", "9:00 AM", "10:00 AM", "11:00 AM", "12:00 PM", "1:00 PM", "2:00 PM", "3:00 PM", "4:00 PM", ] const handleServiceSelect = (serviceId: string, packageName: string) => { setBookingData((prev) => ({ ...prev, service: serviceId, package: packageName, })) setStep(2) } const handleNext = () => { setStep((prev) => prev + 1) } const handleSubmit = () => { // Simulate booking submission setStep(5) } const services = serviceType === "car" ? carServices : houseServices const selectedService = services.find((s) => s.id === bookingData.service) const selectedPackage = selectedService?.packages.find((p) => p.name === bookingData.package) return (

{/* Hero Section */}

Book Your Service

Schedule Your Appointment

Book your premium car detailing or house cleaning service in just a few simple steps

Important Notes

Before Your Service

Please ensure your vehicle/property is accessible at the scheduled time
Remove all personal items from your car or clear areas to be cleaned
Ensure water and electricity access for mobile services

Service Information

All services include premium eco-friendly products
Free consultation and damage assessment included
Satisfaction guarantee - we'll make it right if you're not happy

{/* Service Type Selection */} {step === 1 && (

Choose Service Type

)} {/* Progress Indicator */}

{[1, 2, 3, 4].map((stepNum) => (

= stepNum ? "bg-gradient-to-r from-primary to-secondary text-primary-foreground shadow-lg shadow-primary/50 neon-glow animate-pulse" : "bg-muted text-muted-foreground" }`} > {stepNum}

{stepNum < 4 && (

stepNum ? "bg-gradient-to-r from-primary to-secondary" : "bg-muted" }`} /> )}

))}

Step {step} of 4:{" "} {step === 1 ? "Select Service" : step === 2 ? "Choose Date & Time" : step === 3 ? "Your Information" : step === 4 ? "Review & Confirm" : "Booking Complete"}

{/* Booking Steps */}

{step === 1 && (

Choose Your {serviceType === "car" ? "Car" : "House"} Service

{services.map((service, index) => ( {serviceType === "car" ? ( ) : ( )} {service.name}

{service.description}

Duration: {service.duration}

{service.packages.map((pkg) => (

handleServiceSelect(service.id, pkg.name)} >

{pkg.name}

{pkg.duration}

£{pkg.price}

))}

)} {step === 2 && (

Select Date & Time

Select Date setBookingData((prev) => ({ ...prev, date: e.target.value }))} className="glass border-primary/20 focus:border-primary text-lg p-4 rounded-lg transition-all duration-300" min={new Date().toISOString().split("T")[0]} />

Select Time

{timeSlots.map((time) => ( ))}

)} {step === 3 && (

Your Information

Contact Information

Full Name * setBookingData((prev) => ({ ...prev, customer: { ...prev.customer, name: e.target.value }, })) } placeholder="Your full name" className="glass border-primary/20 focus:border-primary p-4 rounded-lg transition-all duration-300" />

Email * setBookingData((prev) => ({ ...prev, customer: { ...prev.customer, email: e.target.value }, })) } placeholder="your.email@example.com" className="glass border-primary/20 focus:border-primary p-4 rounded-lg transition-all duration-300" />

Phone * setBookingData((prev) => ({ ...prev, customer: { ...prev.customer, phone: e.target.value }, })) } placeholder="+44 123 456 7890" className="glass border-primary/20 focus:border-primary p-4 rounded-lg transition-all duration-300" />

Address setBookingData((prev) => ({ ...prev, customer: { ...prev.customer, address: e.target.value }, })) } placeholder="Your address (for mobile service)" className="glass border-primary/20 focus:border-primary p-4 rounded-lg transition-all duration-300" />

{serviceType === "car" ? ( ) : ( )} {serviceType === "car" ? "Vehicle Information" : "Property Information"} {serviceType === "car" ? ( <>

Year setBookingData((prev) => ({ ...prev, vehicle: { ...prev.vehicle, year: e.target.value }, })) } placeholder="2020" className="glass border-secondary/20 focus:border-secondary p-4 rounded-lg transition-all duration-300" />

Make setBookingData((prev) => ({ ...prev, vehicle: { ...prev.vehicle, make: e.target.value }, })) } placeholder="BMW" className="glass border-secondary/20 focus:border-secondary p-4 rounded-lg transition-all duration-300" />

Model setBookingData((prev) => ({ ...prev, vehicle: { ...prev.vehicle, model: e.target.value }, })) } placeholder="3 Series" className="glass border-secondary/20 focus:border-secondary p-4 rounded-lg transition-all duration-300" />

Color setBookingData((prev) => ({ ...prev, vehicle: { ...prev.vehicle, color: e.target.value }, })) } placeholder="Midnight Black" className="glass border-secondary/20 focus:border-secondary p-4 rounded-lg transition-all duration-300" />

) : ( <>

Property Type setBookingData((prev) => ({ ...prev, property: { ...prev.property, type: e.target.value }, })) } placeholder="House, Apartment, Office, etc." className="glass border-secondary/20 focus:border-secondary p-4 rounded-lg transition-all duration-300" />

Size (sq ft) setBookingData((prev) => ({ ...prev, property: { ...prev.property, size: e.target.value }, })) } placeholder="1500" className="glass border-secondary/20 focus:border-secondary p-4 rounded-lg transition-all duration-300" />

Rooms setBookingData((prev) => ({ ...prev, property: { ...prev.property, rooms: e.target.value }, })) } placeholder="3 bed, 2 bath" className="glass border-secondary/20 focus:border-secondary p-4 rounded-lg transition-all duration-300" />

Cleaning Frequency setBookingData((prev) => ({ ...prev, property: { ...prev.property, frequency: e.target.value }, })) } placeholder="Weekly, Bi-weekly, Monthly, One-time" className="glass border-secondary/20 focus:border-secondary p-4 rounded-lg transition-all duration-300" />

)}

Special Notes

setBookingData((prev) => ({ ...prev, notes: e.target.value }))}
                        placeholder={`Any special requests or notes about your ${serviceType === "car" ? "vehicle" : "property"}...`}
                        rows={4}
                        className="glass border-secondary/20 focus:border-secondary resize-none p-4 rounded-lg transition-all duration-300"
                      />
                    </div>
                  </CardContent>
                </Card>
              </div>
              <div className="text-center mt-8">
                <Button
                  onClick={handleNext}
                  disabled={!bookingData.customer.name || !bookingData.customer.email || !bookingData.customer.phone}
                  className="bg-gradient-to-r from-primary to-secondary hover:from-primary/90 hover:to-secondary/90 text-primary-foreground px-12 py-4 text-lg rounded-lg transition-all duration-300 neon-glow hover-lift"
                >
                  Review Booking
                </Button>
              </div>
            </div>
          )}

{step === 4 && (
            <div className="animate-fade-in">
              <h2 className="text-3xl font-bold text-center mb-8 neon-text">Review & Confirm</h2>
              <div className="max-w-3xl mx-auto space-y-6">
                <Card className="glass border-primary/20 backdrop-blur-sm shadow-lg shadow-primary/10 hover-lift">
                  <CardHeader>
                    <CardTitle className="text-primary neon-text text-2xl">Booking Summary</CardTitle>
                  </CardHeader>
                  <CardContent className="space-y-4">
                    <div className="flex justify-between items-center py-2">
                      <span className="text-muted-foreground">Service Type:</span>
                      <span className="font-medium">{serviceType === "car" ? "Car Detailing" : "House Cleaning"}</span>
                    </div>
                    <div className="flex justify-between items-center py-2">
                      <span className="text-muted-foreground">Service:</span>
                      <span className="font-medium">{selectedService?.name}</span>
                    </div>
                    <div className="flex justify-between items-center py-2">
                      <span className="text-muted-foreground">Package:</span>
                      <span className="font-medium">{bookingData.package}</span>
                    </div>
                    <div className="flex justify-between items-center py-2">
                      <span className="text-muted-foreground">Date:</span>
                      <span className="font-medium">{bookingData.date}</span>
                    </div>
                    <div className="flex justify-between items-center py-2">
                      <span className="text-muted-foreground">Time:</span>
                      <span className="font-medium">{bookingData.time}</span>
                    </div>
                    <div className="flex justify-between items-center py-2">
                      <span className="text-muted-foreground">Duration:</span>
                      <span className="font-medium">{selectedPackage?.duration}</span>
                    </div>
                    {serviceType === "car" ? (
                      <div className="flex justify-between items-center py-2">
                        <span className="text-muted-foreground">Vehicle:</span>
                        <span className="font-medium">
                          {bookingData.vehicle.year} {bookingData.vehicle.make} {bookingData.vehicle.model}
                        </span>
                      </div>
                    ) : (
                      <div className="flex justify-between items-center py-2">
                        <span className="text-muted-foreground">Property:</span>
                        <span className="font-medium">
                          {bookingData.property.type} - {bookingData.property.size} sq ft
                        </span>
                      </div>
                    )}
                    <div className="border-t border-primary/20 pt-6 mt-6">
                      <div className="flex justify-between items-center text-2xl">
                        <span className="font-semibold neon-text">Total:</span>
                        <span className="font-bold text-primary text-3xl neon-glow">£{selectedPackage?.price}</span>
                      </div>
                    </div>
                  </CardContent>
                </Card>

<Card className="glass border-secondary/20 backdrop-blur-sm shadow-lg shadow-secondary/10 hover-lift">
                  <CardHeader>
                    <CardTitle className="flex items-center gap-2 text-secondary neon-text text-xl">
                      <CreditCard className="h-6 w-6 neon-glow animate-sparkle" />
                      Payment Method
                    </CardTitle>
                  </CardHeader>
                  <CardContent>
                    <p className="text-muted-foreground text-sm mb-6">
                      Payment will be collected at the time of service. We accept cash, credit cards, and digital
                      payments including Apple Pay and Google Pay.
                    </p>
                    <div className="flex gap-6 justify-center">
                      <Button
                        onClick={handleSubmit}
                        className="bg-gradient-to-r from-primary to-secondary hover:from-primary/90 hover:to-secondary/90 text-primary-foreground px-12 py-4 text-lg rounded-lg transition-all duration-300 neon-glow hover-lift"
                      >
                        Confirm Booking
                      </Button>
                      <Button
                        variant="outline"
                        onClick={() => setStep(3)}
                        className="border-primary/30 text-primary hover:bg-gradient-to-r hover:from-primary/10 hover:to-secondary/10 px-8 py-4 text-lg rounded-lg transition-all duration-300 hover-lift"
                      >
                        Back to Edit
                      </Button>
                    </div>
                  </CardContent>
                </Card>
              </div>
            </div>
          )}

{step === 5 && (
            <div className="text-center max-w-3xl mx-auto animate-fade-in">
              <CheckCircle className="h-32 w-32 text-green-500 mx-auto mb-8 neon-glow animate-bounce" />
              <h2 className="text-4xl font-bold mb-6 neon-text">Booking Confirmed!</h2>
              <p className="text-xl text-muted-foreground mb-8">
                Thank you for choosing The Tidy Team! Your appointment has been successfully scheduled.
              </p>
              <Card className="glass border-green-500/20 backdrop-blur-sm text-left shadow-lg shadow-green-500/10 hover-lift">
                <CardContent className="p-8">
                  <h3 className="font-semibold mb-6 neon-text text-xl">What's Next?</h3>
                  <ul className="space-y-3 text-muted-foreground text-lg">
                    <li className="flex items-center">
                      <div className="w-2 h-2 bg-primary rounded-full mr-4 animate-pulse"></div>
                      You'll receive a confirmation email within 5 minutes
                    </li>
                    <li className="flex items-center">
                      <div className="w-2 h-2 bg-secondary rounded-full mr-4 animate-pulse"></div>
                      We'll send a reminder 24 hours before your appointment
                    </li>
                    <li className="flex items-center">
                      <div className="w-2 h-2 bg-primary rounded-full mr-4 animate-pulse"></div>
                      Our team will arrive at your scheduled time
                    </li>
                    <li className="flex items-center">
                      <div className="w-2 h-2 bg-secondary rounded-full mr-4 animate-pulse"></div>
                      Payment is due at completion of service
                    </li>
                  </ul>
                  <div className="mt-8 pt-6 border-t border-green-500/20">
                    <p className="text-sm text-muted-foreground">
                      Need to make changes? Call us at <span className="text-primary neon-text">+44 123 456 7890</span>{" "}
                      or email <span className="text-primary neon-text">info@tidyteam.co.uk</span>
                    </p>
                  </div>
                </CardContent>
              </Card>
            </div>
          )}
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="components/live-chat.tsx" isQuickEdit="true"
"use client"

import { useState, useEffect, useRef } from "react"
import { Button } from "@/components/ui/button"
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
import { Input } from "@/components/ui/input"
import { Badge } from "@/components/ui/badge"
import { MessageCircle, X, Send, User, Bot, Phone, Clock, Star, Mail } from "lucide-react"

interface Message {
  id: number
  type: "user" | "bot" | "agent"
  content: string
  timestamp: Date
  isTyping?: boolean
  rating?: number
}

export function LiveChat() {
  const [isOpen, setIsOpen] = useState(false)
  const [message, setMessage] = useState("")
  const [showContactInfo, setShowContactInfo] = useState(false)
  const [messages, setMessages] = useState<Message[]>([
    {
      id: 1,
      type: "bot",
      content:
        "👋 Welcome to The Tidy Team! I'm your AI assistant with comprehensive knowledge about car detailing and house cleaning services.\n\n🚗 Car Services: Interior, Exterior, Full Detail, Ceramic Coating\n🏠 House Services: Regular, Deep Clean, Move-in/out, Commercial\n\nHow can I help you today?",
      timestamp: new Date(),
    },
  ])
  const [isTyping, setIsTyping] = useState(false)
  const [isOnline, setIsOnline] = useState(true)
  const [unreadCount, setUnreadCount] = useState(0)
  const messagesEndRef = useRef<HTMLDivElement>(null)
  const chatRef = useRef<HTMLDivElement>(null)

const smartResponses = {
    ukPricing:
      "📍 UK Car Valeting Market Pricing:\n\n🇬🇧 EXAMPLE UK PROVIDERS:\n• Fresh Car Valeting:\n  - Mini valet: £40–£60\n  - Full valet: £70–£100\n\n• CleanMe (app-based):\n  - Starting at £34 (hatchback)\n  - Up to £60+ (SUV)\n\n• CSM Valeting (Gloucester):\n  - Bronze valet: £40–£60 (small)\n  - £55–£70 (SUV)\n  - Gold valet: £120+\n\n💷 VEHICLE SIZE PRICING:\n• Compact SUV (Qashqai): +£10–£20\n• Full-size SUV (Range Rover): +£20–£40\n• 7-Seaters (VW Touran): +£20–£50\n\n🛠️ TYPICAL UK PRICE RANGES:\n• Exterior wash (basic): £10–£40\n• Mini valet (int & ext): £40–£60\n• Standard full valet: £70–£100\n• Premium/detailed valet: £100–£180+\n• Pre-sale + engine/detail: £130–£220+\n• Deep clean/detail (vans): Up to £300",

businessSetup:
      "✅ BUSINESS SETUP GUIDE:\n\n📋 LEGAL REQUIREMENTS:\n• Business license\n• General liability insurance\n• Worker's comp insurance (if hiring)\n• EIN (Employer ID Number)\n• Professional website & email\n\n📄 PROFESSIONAL PROPOSAL INCLUDES:\n• Company overview\n• Service list with recurring options\n• Pricing structure (hourly/flat/per sqft)\n• Frequency options (daily/weekly/monthly)\n• Supplies included details\n• Terms and conditions\n• Client testimonials\n\n🎯 FINDING CONTRACTS:\n• Visit local businesses in person\n• Contact property management companies\n• Network with real estate agents\n• Use platforms: Thumbtack, Bark, Angi\n• Government contracts: SAM.gov\n• Search for 'janitorial RFP'\n\n💼 WINNING STRATEGIES:\n• Offer discounted first cleaning\n• Follow up within few days\n• Build long-term relationships\n• Ask for referrals after success",

carInterior:
      "🚗 Interior Detailing Services:\n\n• Basic Interior (£89, 2hrs): Vacuum, wipe surfaces, glass cleaning\n• Premium Interior (£149, 2.5hrs): Deep clean, leather treatment, odor removal\n• Luxury Interior (£199, 3hrs): Complete detail, protection, sanitization\n\nIncludes: Dashboard, seats, carpets, door panels, cup holders. Would you like to book?",

carExterior:
      "✨ Exterior Detailing Services:\n\n• Basic Wash (£69, 1.5hrs): Hand wash, dry, tire shine\n• Premium Wash (£119, 2hrs): Clay bar, wax, wheel detail\n• Luxury Wash (£169, 2.5hrs): Paint correction, sealant, chrome polish\n\nAll services include pre-wash, hand wash, and protective finish. Ready to schedule?",

carFull:
      "🌟 Full Detailing Packages:\n\n• Complete Detail (£199, 4hrs): Interior + Exterior basic\n• Premium Detail (£299, 5hrs): Deep clean inside & out\n• Luxury Detail (£399, 6hrs): Ultimate protection package\n\nBest value for complete car transformation! Which package interests you?",

ceramic:
      "🛡️ Ceramic Coating Protection:\n\n• 1-Year Protection (£599, 6hrs): Basic ceramic coating\n• 3-Year Protection (£899, 7hrs): Premium grade coating\n• 5-Year Protection (£1299, 8hrs): Professional grade with warranty\n\nBenefits: UV protection, scratch resistance, easy cleaning, enhanced gloss. Want more details?",

houseRegular:
      "🏠 Regular House Cleaning:\n\n• Basic Clean (£89, 2hrs): Essential cleaning, perfect for maintenance\n• Deep Clean (£149, 3hrs): Thorough cleaning with detail work\n• Premium Clean (£199, 4hrs): Complete service with extras\n\nFrequency options: Weekly, bi-weekly, monthly. What works best for you?",

houseDeep:
      "🧽 Deep House Cleaning:\n\n• Standard Deep (£199, 4hrs): Comprehensive one-time clean\n• Premium Deep (£299, 6hrs): Includes appliances, baseboards\n• Ultimate Deep (£399, 8hrs): Complete home transformation\n\nPerfect for spring cleaning, post-renovation, or special occasions. Need a quote?",

houseMove:
      "📦 Move In/Out Cleaning:\n\n• Move Clean (£249, 4hrs): Essential cleaning for transitions\n• Premium Move (£349, 5hrs): Deep clean with appliance detail\n• Ultimate Move (£449, 6hrs): Complete sanitization service\n\nWe handle the cleaning so you can focus on moving. When's your move date?",

commercial:
      "🏢 Commercial Cleaning Services:\n\n• Basic Office (£149, 2hrs): Desks, floors, restrooms\n• Premium Office (£249, 4hrs): Deep clean with detail work\n• Complete Commercial (£399, 6hrs): Full facility service\n\nCustom schedules available: daily, weekly, monthly. What's your facility size?",

pricing:
      "💰 Our Service Pricing:\n\n🚗 CAR DETAILING:\n• Interior: £89-£199\n• Exterior: £69-£169\n• Full Detail: £199-£399\n• Ceramic Coating: £599-£1299\n\n🏠 HOUSE CLEANING:\n• Regular: £89-£199\n• Deep Clean: £199-£399\n• Move In/Out: £249-£449\n• Commercial: £149-£399\n\nAll prices include materials and equipment. Need a specific quote?",

booking:
      "📅 Easy Booking Options:\n\n1. 🌐 Online: Use our booking system (takes 2 minutes!)\n2. 📞 Phone: Call +44 123 456 7890\n3. 💬 Chat: I can help you book right here!\n4. 📧 Email: info@tidyteam.co.uk\n\nAvailable slots: Mon-Sat 8AM-6PM, Sun 10AM-4PM. What service interests you?",

areas:
      "📍 We serve the greater metropolitan area including:\n\n• City Center & Suburbs\n• Residential neighborhoods\n• Commercial districts\n• Industrial areas\n\nMobile service available within 25 miles. What's your location?",

mobile:
      "🚐 Mobile Service Details:\n\n• We come to your location\n• Fully equipped professional vans\n• Eco-friendly products included\n• Water and power self-contained\n• No mess left behind guarantee\n\nJust provide access and we handle everything else!",

products:
      "🌿 Premium Eco-Friendly Products:\n\n• Biodegradable cleaning solutions\n• Non-toxic, family & pet safe\n• Professional-grade equipment\n• Microfiber cloths and tools\n• HEPA filtration systems\n\nWe care about your health and the environment. Any specific concerns?",

methods:
      "🔬 Our Professional Methods:\n\n🚗 Cars: Multi-stage wash, clay bar treatment, paint correction\n🏠 Houses: Top-to-bottom system, HEPA vacuuming, sanitization\n\n• Trained technicians\n• Quality control checks\n• Satisfaction guarantee\n• Insurance coverage\n\nWhat specific technique interests you?",

hours:
      "🕒 Service Hours:\n\n• Monday-Friday: 8:00 AM - 6:00 PM\n• Saturday: 9:00 AM - 5:00 PM\n• Sunday: 10:00 AM - 4:00 PM\n• Emergency services available\n\nSame-day booking often available! When would you like service?",

duration:
      "⏱️ Service Duration Guide:\n\n🚗 CAR SERVICES:\n• Basic wash: 1.5-2 hours\n• Interior detail: 2-3 hours\n• Full detail: 4-6 hours\n• Ceramic coating: 6-8 hours\n\n🏠 HOUSE SERVICES:\n• Regular clean: 2-4 hours\n• Deep clean: 4-8 hours\n• Move clean: 4-6 hours\n\nTimes vary by size and condition. Need an estimate?",

addons:
      "➕ Popular Add-On Services:\n\n🚗 CAR EXTRAS:\n• Pet hair removal (+£25)\n• Odor elimination (+£35)\n• Headlight restoration (+£45)\n• Engine bay cleaning (+£55)\n\n🏠 HOUSE EXTRAS:\n• Inside oven cleaning (+£25)\n• Inside fridge cleaning (+£20)\n• Window cleaning (+£30)\n• Carpet shampooing (+£40)\n\nWhat extras interest you?",

maintenance:
      "🔄 Maintenance Programs:\n\n🚗 CAR MAINTENANCE:\n• Monthly detail: 15% discount\n• Quarterly ceramic refresh\n• Annual protection package\n\n🏠 HOUSE MAINTENANCE:\n• Weekly service: 20% off\n• Bi-weekly: 15% off\n• Monthly deep clean: 10% off\n\nRegular service keeps everything pristine and saves money!",

guarantee:
      "✅ Our Service Guarantee:\n\n• 100% satisfaction promise\n• Free re-service if not happy\n• Fully insured and bonded\n• Background-checked staff\n• 24-hour response to concerns\n\nYour peace of mind is our priority. Any specific concerns?",

contact:
      "📞 Contact The Tidy Team:\n\n• Phone: +44 123 456 7890\n• Email: info@tidyteam.co.uk\n• Address: 123 Clean Street, City, ST 12345\n• Live Chat: Right here with me!\n• Social: @TidyTeamServices\n\nWe're here to help 7 days a week!",

preparation:
      "📋 How to Prepare:\n\n🚗 FOR CAR SERVICE:\n• Remove personal items\n• Ensure access to vehicle\n• Note any damage/concerns\n\n🏠 FOR HOUSE SERVICE:\n• Clear surfaces of valuables\n• Secure pets if needed\n• Provide access instructions\n• Point out priority areas\n\nWe'll handle the rest!",

payment:
      "💳 Payment Options:\n\n• Cash (preferred)\n• Credit/Debit cards\n• Bank transfer\n• Digital payments (Apple Pay, Google Pay)\n• Corporate accounts available\n\nPayment due upon completion. No upfront fees required!",

weather:
      "🌦️ Weather Policy:\n\n• Indoor services continue as normal\n• Outdoor car services may reschedule for safety\n• We monitor weather closely\n• Free rescheduling for weather delays\n• Covered areas available when possible\n\nYour safety and service quality come first!",

default:
      "I'm here to help with any questions about The Tidy Team's car detailing and house cleaning services! I can provide information about:\n\n• Service details and pricing\n• Booking and scheduling\n• Service areas and logistics\n• Products and methods\n• Special offers and packages\n\nWhat specific information can I help you find? Or would you like me to connect you with our team? 😊",
  }

const scrollToBottom = () => {
    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" })
  }

useEffect(() => {
    scrollToBottom()
  }, [messages])

useEffect(() => {
    if (!isOpen && messages.length > 1) {
      setUnreadCount(messages.filter((m) => m.type !== "user").length - 1)
    } else {
      setUnreadCount(0)
    }
  }, [isOpen, messages])

useEffect(() => {
    const handleClickOutside = (event: MouseEvent) => {
      if (chatRef.current && !chatRef.current.contains(event.target as Node) && isOpen) {
        setIsOpen(false)
        setShowContactInfo(false)
      }
    }

if (isOpen) {
      document.addEventListener("mousedown", handleClickOutside)
    }

return () => {
      document.removeEventListener("mousedown", handleClickOutside)
    }
  }, [isOpen])

const getSmartResponse = (userMessage: string): string => {
    const msg = userMessage.toLowerCase()

if (msg.includes("uk") || msg.includes("british") || msg.includes("england") || msg.includes("market"))
      return smartResponses.ukPricing
    if (
      msg.includes("business setup") ||
      msg.includes("start business") ||
      msg.includes("license") ||
      msg.includes("insurance")
    )
      return smartResponses.businessSetup

if (msg.includes("interior") && (msg.includes("car") || msg.includes("detail"))) return smartResponses.carInterior
    if (msg.includes("exterior") && (msg.includes("car") || msg.includes("wash"))) return smartResponses.carExterior
    if (msg.includes("full detail") || (msg.includes("complete") && msg.includes("car"))) return smartResponses.carFull
    if (msg.includes("ceramic") || msg.includes("coating") || msg.includes("protection")) return smartResponses.ceramic

if (msg.includes("regular") && (msg.includes("house") || msg.includes("clean"))) return smartResponses.houseRegular
    if (msg.includes("deep") && (msg.includes("house") || msg.includes("clean"))) return smartResponses.houseDeep
    if (msg.includes("move") || msg.includes("moving")) return smartResponses.houseMove
    if (msg.includes("commercial") || msg.includes("office") || msg.includes("business"))
      return smartResponses.commercial

if (msg.includes("price") || msg.includes("cost") || msg.includes("£") || msg.includes("how much"))
      return smartResponses.pricing
    if (msg.includes("book") || msg.includes("appointment") || msg.includes("schedule")) return smartResponses.booking
    if (msg.includes("hour") || msg.includes("time") || msg.includes("open") || msg.includes("available"))
      return smartResponses.hours
    if (msg.includes("how long") || msg.includes("duration") || msg.includes("take")) return smartResponses.duration

if (msg.includes("area") || msg.includes("location") || msg.includes("where") || msg.includes("travel"))
      return smartResponses.areas
    if (msg.includes("mobile") || msg.includes("come to") || msg.includes("my place")) return smartResponses.mobile

if (msg.includes("product") || msg.includes("chemical") || msg.includes("eco") || msg.includes("safe"))
      return smartResponses.products
    if (msg.includes("method") || msg.includes("process") || msg.includes("how do you")) return smartResponses.methods

if (
      msg.includes("extra") ||
      msg.includes("add") ||
      msg.includes("additional") ||
      msg.includes("pet hair") ||
      msg.includes("odor")
    )
      return smartResponses.addons
    if (msg.includes("maintenance") || msg.includes("regular") || msg.includes("subscription"))
      return smartResponses.maintenance

if (msg.includes("guarantee") || msg.includes("warranty") || msg.includes("promise") || msg.includes("insurance"))
      return smartResponses.guarantee
    if (msg.includes("contact") || msg.includes("phone") || msg.includes("email") || msg.includes("address"))
      return smartResponses.contact
    if (msg.includes("prepare") || msg.includes("ready") || msg.includes("before")) return smartResponses.preparation
    if (msg.includes("pay") || msg.includes("payment") || msg.includes("card") || msg.includes("cash"))
      return smartResponses.payment
    if (msg.includes("weather") || msg.includes("rain") || msg.includes("snow")) return smartResponses.weather

if (msg.includes("service") || msg.includes("clean") || msg.includes("detail") || msg.includes("wash"))
      return smartResponses.pricing

return smartResponses.default
  }

const handleSendMessage = () => {
    if (!message.trim()) return

const newMessage: Message = {
      id: messages.length + 1,
      type: "user",
      content: message,
      timestamp: new Date(),
    }

setMessages((prev) => [...prev, newMessage])
    const currentMessage = message
    setMessage("")
    setIsTyping(true)

setTimeout(() => {
      setIsTyping(false)
      const botResponse: Message = {
        id: messages.length + 2,
        type: "bot",
        content: getSmartResponse(currentMessage),
        timestamp: new Date(),
      }
      setMessages((prev) => [...prev, botResponse])
    }, 1500)
  }

const handleContactUs = () => {
    setShowContactInfo(!showContactInfo)
  }

const handleRating = (messageId: number, rating: number) => {
    setMessages((prev) => prev.map((msg) => (msg.id === messageId ? { ...msg, rating } : msg)))
  }

const toggleChat = () => {
    setIsOpen((prev) => {
      const newState = !prev
      return newState
    })
    if (isOpen) {
      setShowContactInfo(false)
    }
  }

const closeChat = () => {
    setIsOpen(false)
    setShowContactInfo(false)
  }

return (
    <>
      <div className="fixed bottom-6 right-6 z-50">
        
        {!isOpen && (
          0" : "bg-red-500"} animate-pulse`}></div>
                <span className="text-xs text-muted-foreground">{isOnline ? "Online" : "Offline"}</span>
              </div>
            </div>
            <div className="flex items-center gap-2 mt-2">
              <Button variant="outline" size="sm" onClick={handleContactUs} className="text-xs bg-transparent">
                <User className="h-3 w-3 mr-1" />
                Contact Us
              </Button>
            </div>
            {showContactInfo && (
              <div className="mt-3 p-3 bg-muted/50 rounded-lg border border-border/20">
                <div className="space-y-2 text-sm">
                  <div className="flex items-center gap-2">
                    <Mail className="h-4 w-4 text-primary" />
                    <span>info@tidyteam.co.uk</span>
                  </div>
                  <div className="flex items-center gap-2">
                    <Phone className="h-4 w-4 text-primary" />
                    <span>+44 123 456 7890</span>
                  </div>
                </div>
              </div>
            )}
          </CardHeader>

<CardContent className="p-0 flex flex-col h-full">
            <div className="flex-1 overflow-y-auto p-4 space-y-4">
              {messages.map((msg) => (
                <div key={msg.id} className={`flex ${msg.type === "user" ? "justify-end" : "justify-start"}`}>
                  <div className={`max-w-[85%] group`}>
                    <div
                      className={`p-3 rounded-lg shadow-sm ${
                        msg.type === "user"
                          ? "bg-gradient-to-r from-primary to-primary/90 text-primary-foreground ml-4"
                          : msg.type === "agent"
                            ? "bg-gradient-to-r from-green-500 to-green-600 text-white mr-4"
                            : "bg-muted/80 text-foreground mr-4 border border-border/20"
                      }`}
                    >
                      <div className="flex items-start space-x-2">
                        {msg.type === "bot" && <Bot className="h-4 w-4 mt-0.5 flex-shrink-0 text-primary" />}
                        {msg.type === "agent" && <User className="h-4 w-4 mt-0.5 flex-shrink-0" />}
                        <div className="flex-1">
                          <p className="text-sm whitespace-pre-line">{msg.content}</p>
                          <div className="flex items-center justify-between mt-2">
                            <span className="text-xs opacity-70">
                              {msg.timestamp.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" })}
                            </span>
                            {msg.type === "bot" && !msg.rating && (
                              <div className="flex gap-1 opacity-0 group-hover:opacity-100 transition-opacity">
                                {[1, 2, 3, 4, 5].map((star) => (
                                  <Star
                                    key={star}
                                    className="h-3 w-3 cursor-pointer hover:text-yellow-500 transition-colors"
                                    onClick={() => handleRating(msg.id, star)}
                                  />
                                ))}
                              </div>
                            )}
                            {msg.rating && (
                              <div className="flex gap-1">
                                {[1, 2, 3, 4, 5].map((star) => (
                                  <Star
                                    key={star}
                                    className={`h-3 w-3 ${star <= msg.rating! ? "text-yellow-500 fill-current" : "text-gray-300"}`}
                                  />
                                ))}
                              </div>
                            )}
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              ))}

{isTyping && (
                <div className="flex justify-start">
                  <div className="bg-muted/80 text-foreground mr-4 p-3 rounded-lg border border-border/20">
                    <div className="flex items-center space-x-2">
                      <Bot className="h-4 w-4 text-primary" />
                      <div className="flex space-x-1">
                        <div className="w-2 h-2 bg-primary rounded-full animate-bounce"></div>
                        <div
                          className="w-2 h-2 bg-primary rounded-full animate-bounce"
                          style={{ animationDelay: "0.1s" }}
                        ></div>
                        <div
                          className="w-2 h-2 bg-primary rounded-full animate-bounce"
                          style={{ animationDelay: "0.2s" }}
                        ></div>
                      </div>
                    </div>
                  </div>
                </div>
              )}
              <div ref={messagesEndRef} />
            </div>

<div className="p-4 border-t border-border/20 bg-muted/20">
              <div className="flex items-center space-x-2">
                <Input
                  value={message}
                  onChange={(e) => setMessage(e.target.value)}
                  placeholder="Type your message..."
                  onKeyPress={(e) => e.key === "Enter" && handleSendMessage()}
                  className="flex-1 bg-background/50"
                  disabled={isTyping}
                />
                <Button
                  onClick={handleSendMessage}
                  size="icon"
                  className="neon-glow h-8 w-8"
                  disabled={isTyping || !message.trim()}
                >
                  <Send className="h-4 w-4" />
                </Button>
              </div>
              <div className="flex items-center justify-between mt-2 text-xs text-muted-foreground">
                <span>Powered by AI • Response time: ~30s</span>
                <div className="flex items-center gap-1">
                  <Clock className="h-3 w-3" />
                  <span>Usually replies instantly</span>
                </div>
              </div>
            </div>
          </CardContent>
        </Card>
      )}
    </>
  )
}
[V0_FILE]typescriptreact:file="app/services/commercial/page.tsx"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import { Building2, CheckCircle, Clock, Shield, Users, ArrowRight, Star, Award, Zap, Phone, Mail } from "lucide-react"
import Link from "next/link"

export default function CommercialServicesPage() {
  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <section className="relative py-20 px-4 bg-gradient-to-br from-blue-500/10 via-transparent to-blue-500/5">
        <div className="max-w-6xl mx-auto text-center">
          <div className="w-20 h-20 bg-gradient-to-br from-blue-500/30 to-blue-500/10 rounded-2xl flex items-center justify-center mx-auto mb-8">
            <Building2 className="h-10 w-10 text-blue-500" />
          </div>
          <Badge className="mb-6 bg-blue-500/20 border-blue-500/30 text-blue-700">Commercial Cleaning Services</Badge>
          <h1 className="text-5xl font-bold mb-6 text-foreground">Professional Commercial Cleaning</h1>
          <p className="text-xl text-muted-foreground mb-8 max-w-3xl mx-auto">
            Comprehensive cleaning solutions for office buildings, retail spaces, and business facilities. Maintain a
            professional image with our reliable commercial cleaning services.
          </p>
          <div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book?service=commercial">
              <Button size="lg" className="px-8 py-4">
                Get Free Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Link href="tel:+44123456789">
              <Button variant="outline" size="lg" className="px-8 py-4 bg-transparent">
                <Phone className="mr-2 h-5 w-5" />
                Call Now
              </Button>
            </Link>
          </div>
        </div>
      </section>

{/* Services Grid */}
      <section className="py-16 px-4">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Our Commercial Services</h2>
          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
            <Card className="border-border/20 hover:border-blue-500/50 transition-all duration-300">
              <CardContent className="p-6">
                <div className="w-12 h-12 bg-blue-500/20 rounded-lg flex items-center justify-center mb-4">
                  <Building2 className="h-6 w-6 text-blue-500" />
                </div>
                <h3 className="text-xl font-semibold mb-3">Office Buildings</h3>
                <p className="text-muted-foreground mb-4">
                  Complete office cleaning including workstations, meeting rooms, reception areas, and common spaces.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Daily office cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Sanitization services
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Carpet & upholstery cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-border/20 hover:border-blue-500/50 transition-all duration-300">
              <CardContent className="p-6">
                <div className="w-12 h-12 bg-blue-500/20 rounded-lg flex items-center justify-center mb-4">
                  <Users className="h-6 w-6 text-blue-500" />
                </div>
                <h3 className="text-xl font-semibold mb-3">Retail Spaces</h3>
                <p className="text-muted-foreground mb-4">
                  Specialized cleaning for retail environments to maintain customer appeal and hygiene standards.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Shop floor maintenance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Window & display cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Restroom sanitization
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-border/20 hover:border-blue-500/50 transition-all duration-300">
              <CardContent className="p-6">
                <div className="w-12 h-12 bg-blue-500/20 rounded-lg flex items-center justify-center mb-4">
                  <Shield className="h-6 w-6 text-blue-500" />
                </div>
                <h3 className="text-xl font-semibold mb-3">Business Facilities</h3>
                <p className="text-muted-foreground mb-4">
                  Comprehensive facility management and cleaning for various business environments.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Deep cleaning services
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Waste management
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Emergency cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* Features Section */}
      <section className="py-16 px-4 bg-gradient-to-r from-blue-500/5 via-transparent to-blue-500/5">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Why Choose Our Commercial Services</h2>
          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
            <div className="text-center">
              <div className="w-16 h-16 bg-blue-500/20 rounded-full flex items-center justify-center mx-auto mb-4">
                <Clock className="h-8 w-8 text-blue-500" />
              </div>
              <h3 className="text-lg font-semibold mb-2">Flexible Scheduling</h3>
              <p className="text-muted-foreground text-sm">Available 24/7 to work around your business hours</p>
            </div>
            <div className="text-center">
              <div className="w-16 h-16 bg-blue-500/20 rounded-full flex items-center justify-center mx-auto mb-4">
                <Award className="h-8 w-8 text-blue-500" />
              </div>
              <h3 className="text-lg font-semibold mb-2">Certified Team</h3>
              <p className="text-muted-foreground text-sm">Fully trained and insured cleaning professionals</p>
            </div>
            <div className="text-center">
              <div className="w-16 h-16 bg-blue-500/20 rounded-full flex items-center justify-center mx-auto mb-4">
                <Zap className="h-8 w-8 text-blue-500" />
              </div>
              <h3 className="text-lg font-semibold mb-2">Quick Response</h3>
              <p className="text-muted-foreground text-sm">Same-day service available for urgent cleaning needs</p>
            </div>
            <div className="text-center">
              <div className="w-16 h-16 bg-blue-500/20 rounded-full flex items-center justify-center mx-auto mb-4">
                <Star className="h-8 w-8 text-blue-500" />
              </div>
              <h3 className="text-lg font-semibold mb-2">Quality Guarantee</h3>
              <p className="text-muted-foreground text-sm">100% satisfaction guarantee on all services</p>
            </div>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-16 px-4">
        <div className="max-w-4xl mx-auto text-center">
          <Card className="border-border/20 p-8">
            <CardContent className="p-0">
              <h2 className="text-3xl font-bold mb-4">Ready to Enhance Your Business Image?</h2>
              <p className="text-lg text-muted-foreground mb-8">
                Get a free consultation and customized cleaning plan for your commercial space.
              </p>
              <div className="flex flex-col sm:flex-row gap-4 justify-center">
                <Link href="/book?service=commercial">
                  <Button size="lg" className="px-8 py-4">
                    Schedule Free Consultation
                  </Button>
                </Link>
                <Link href="mailto:info@tidyteam.com">
                  <Button variant="outline" size="lg" className="px-8 py-4 bg-transparent">
                    <Mail className="mr-2 h-5 w-5" />
                    Email Us
                  </Button>
                </Link>
              </div>
            </CardContent>
          </Card>
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/services/industrial/page.tsx"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import { Factory, CheckCircle, Shield, Wrench, ArrowRight, AlertTriangle, HardHat, Phone, Mail } from "lucide-react"
import Link from "next/link"

export default function IndustrialServicesPage() {
  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <section className="relative py-20 px-4 bg-gradient-to-br from-orange-500/10 via-transparent to-orange-500/5">
        <div className="max-w-6xl mx-auto text-center">
          <div className="w-20 h-20 bg-gradient-to-br from-orange-500/30 to-orange-500/10 rounded-2xl flex items-center justify-center mx-auto mb-8">
            <Factory className="h-10 w-10 text-orange-500" />
          </div>
          <Badge className="mb-6 bg-orange-500/20 border-orange-500/30 text-orange-700">
            Industrial Cleaning Services
          </Badge>
          <h1 className="text-5xl font-bold mb-6 text-foreground">Heavy-Duty Industrial Cleaning</h1>
          <p className="text-xl text-muted-foreground mb-8 max-w-3xl mx-auto">
            Specialized cleaning solutions for manufacturing plants, warehouses, and industrial facilities.
            Safety-compliant services with industrial-grade equipment and expertise.
          </p>
          <div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book?service=industrial">
              <Button size="lg" className="px-8 py-4 bg-orange-500 hover:bg-orange-600">
                Get Industrial Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Link href="tel:+44123456789">
              <Button variant="outline" size="lg" className="px-8 py-4 border-orange-500/30 bg-transparent">
                <Phone className="mr-2 h-5 w-5" />
                Emergency Service
              </Button>
            </Link>
          </div>
        </div>
      </section>

{/* Services Grid */}
      <section className="py-16 px-4">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Industrial Cleaning Expertise</h2>
          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
            <Card className="border-border/20 hover:border-orange-500/50 transition-all duration-300">
              <CardContent className="p-6">
                <div className="w-12 h-12 bg-orange-500/20 rounded-lg flex items-center justify-center mb-4">
                  <Factory className="h-6 w-6 text-orange-500" />
                </div>
                <h3 className="text-xl font-semibold mb-3">Manufacturing Plants</h3>
                <p className="text-muted-foreground mb-4">
                  Comprehensive cleaning for production facilities, machinery areas, and manufacturing floors.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Production line cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Machinery degreasing
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Floor coating maintenance
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-border/20 hover:border-orange-500/50 transition-all duration-300">
              <CardContent className="p-6">
                <div className="w-12 h-12 bg-orange-500/20 rounded-lg flex items-center justify-center mb-4">
                  <Wrench className="h-6 w-6 text-orange-500" />
                </div>
                <h3 className="text-xl font-semibold mb-3">Warehouses</h3>
                <p className="text-muted-foreground mb-4">
                  Large-scale warehouse cleaning including high-level cleaning and storage area maintenance.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    High-level dusting
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Loading dock cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Inventory area maintenance
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-border/20 hover:border-orange-500/50 transition-all duration-300">
              <CardContent className="p-6">
                <div className="w-12 h-12 bg-orange-500/20 rounded-lg flex items-center justify-center mb-4">
                  <HardHat className="h-6 w-6 text-orange-500" />
                </div>
                <h3 className="text-xl font-semibold mb-3">Safety Compliance</h3>
                <p className="text-muted-foreground mb-4">
                  OSHA-compliant cleaning procedures with proper safety protocols and documentation.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    OSHA compliance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Safety documentation
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Hazmat handling
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* Specialized Services */}
      <section className="py-16 px-4 bg-gradient-to-r from-orange-500/5 via-transparent to-orange-500/5">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Specialized Industrial Services</h2>
          <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
            <Card className="border-border/20">
              <CardContent className="p-6">
                <div className="flex items-center mb-4">
                  <AlertTriangle className="h-6 w-6 text-orange-500 mr-3" />
                  <h3 className="text-xl font-semibold">Hazardous Material Cleanup</h3>
                </div>
                <p className="text-muted-foreground mb-4">
                  Certified hazardous material cleanup and disposal services following strict safety protocols.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Chemical spill cleanup
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Proper waste disposal
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Environmental compliance
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-border/20">
              <CardContent className="p-6">
                <div className="flex items-center mb-4">
                  <Shield className="h-6 w-6 text-orange-500 mr-3" />
                  <h3 className="text-xl font-semibold">Emergency Response</h3>
                </div>
                <p className="text-muted-foreground mb-4">
                  24/7 emergency industrial cleaning services for urgent situations and facility incidents.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    24/7 availability
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Rapid response team
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Incident documentation
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-16 px-4">
        <div className="max-w-4xl mx-auto text-center">
          <Card className="border-border/20 p-8">
            <CardContent className="p-0">
              <h2 className="text-3xl font-bold mb-4">Need Industrial Cleaning Expertise?</h2>
              <p className="text-lg text-muted-foreground mb-8">
                Contact our industrial cleaning specialists for a comprehensive facility assessment and custom solution.
              </p>
              <div className="flex flex-col sm:flex-row gap-4 justify-center">
                <Link href="/book?service=industrial">
                  <Button size="lg" className="px-8 py-4 bg-orange-500 hover:bg-orange-600">
                    Request Site Assessment
                  </Button>
                </Link>
                <Link href="mailto:industrial@tidyteam.com">
                  <Button variant="outline" size="lg" className="px-8 py-4 border-orange-500/30 bg-transparent">
                    <Mail className="mr-2 h-5 w-5" />
                    Email Specialists
                  </Button>
                </Link>
              </div>
            </CardContent>
          </Card>
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/services/retail/page.tsx"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import { ShoppingBag, CheckCircle, Users, Sparkles, ArrowRight, Clock, Star, Phone, Mail } from "lucide-react"
import Link from "next/link"

export default function RetailServicesPage() {
  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <section className="relative py-20 px-4 bg-gradient-to-br from-green-500/10 via-transparent to-green-500/5">
        <div className="max-w-6xl mx-auto text-center">
          <div className="w-20 h-20 bg-gradient-to-br from-green-500/30 to-green-500/10 rounded-2xl flex items-center justify-center mx-auto mb-8">
            <ShoppingBag className="h-10 w-10 text-green-500" />
          </div>
          <Badge className="mb-6 bg-green-500/20 border-green-500/30 text-green-700">Retail Cleaning Services</Badge>
          <h1 className="text-5xl font-bold mb-6 text-foreground">Retail Space Excellence</h1>
          <p className="text-xl text-muted-foreground mb-8 max-w-3xl mx-auto">
            Create the perfect shopping environment with our specialized retail cleaning services. Maintain customer
            appeal and hygiene standards that drive sales and satisfaction.
          </p>
          <div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book?service=retail">
              <Button size="lg" className="px-8 py-4 bg-green-500 hover:bg-green-600">
                Get Retail Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Link href="tel:+44123456789">
              <Button variant="outline" size="lg" className="px-8 py-4 border-green-500/30 bg-transparent">
                <Phone className="mr-2 h-5 w-5" />
                Call Today
              </Button>
            </Link>
          </div>
        </div>
      </section>

{/* Services Grid */}
      <section className="py-16 px-4">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Retail Cleaning Solutions</h2>
          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
            <Card className="border-border/20 hover:border-green-500/50 transition-all duration-300">
              <CardContent className="p-6">
                <div className="w-12 h-12 bg-green-500/20 rounded-lg flex items-center justify-center mb-4">
                  <ShoppingBag className="h-6 w-6 text-green-500" />
                </div>
                <h3 className="text-xl font-semibold mb-3">Shop Floors</h3>
                <p className="text-muted-foreground mb-4">
                  Daily maintenance of retail floors including high-traffic areas and customer walkways.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Daily floor cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Spill response
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Anti-slip treatments
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-border/20 hover:border-green-500/50 transition-all duration-300">
              <CardContent className="p-6">
                <div className="w-12 h-12 bg-green-500/20 rounded-lg flex items-center justify-center mb-4">
                  <Sparkles className="h-6 w-6 text-green-500" />
                </div>
                <h3 className="text-xl font-semibold mb-3">Window & Display</h3>
                <p className="text-muted-foreground mb-4">
                  Professional window and display cleaning to showcase your products in the best light.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Streak-free windows
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Display case cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Mirror polishing
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-border/20 hover:border-green-500/50 transition-all duration-300">
              <CardContent className="p-6">
                <div className="w-12 h-12 bg-green-500/20 rounded-lg flex items-center justify-center mb-4">
                  <Users className="h-6 w-6 text-green-500" />
                </div>
                <h3 className="text-xl font-semibold mb-3">Customer Areas</h3>
                <p className="text-muted-foreground mb-4">
                  Specialized cleaning for fitting rooms, restrooms, and customer service areas.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Fitting room sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Restroom maintenance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Seating area cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* Retail Benefits */}
      <section className="py-16 px-4 bg-gradient-to-r from-green-500/5 via-transparent to-green-500/5">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Why Retail Businesses Choose Us</h2>
          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
            <div className="text-center">
              <div className="w-16 h-16 bg-green-500/20 rounded-full flex items-center justify-center mx-auto mb-4">
                <Clock className="h-8 w-8 text-green-500" />
              </div>
              <h3 className="text-lg font-semibold mb-2">Off-Hours Service</h3>
              <p className="text-muted-foreground text-sm">
                Cleaning during closed hours to avoid disrupting customers
              </p>
            </div>
            <div className="text-center">
              <div className="w-16 h-16 bg-green-500/20 rounded-full flex items-center justify-center mx-auto mb-4">
                <Star className="h-8 w-8 text-green-500" />
              </div>
              <h3 className="text-lg font-semibold mb-2">Brand Image</h3>
              <p className="text-muted-foreground text-sm">Maintain a pristine environment that reflects your brand</p>
            </div>
            <div className="text-center">
              <div className="w-16 h-16 bg-green-500/20 rounded-full flex items-center justify-center mx-auto mb-4">
                <Users className="h-8 w-8 text-green-500" />
              </div>
              <h3 className="text-lg font-semibold mb-2">Customer Safety</h3>
              <p className="text-muted-foreground text-sm">Ensure a safe, clean environment for all visitors</p>
            </div>
            <div className="text-center">
              <div className="w-16 h-16 bg-green-500/20 rounded-full flex items-center justify-center mx-auto mb-4">
                <Sparkles className="h-8 w-8 text-green-500" />
              </div>
              <h3 className="text-lg font-semibold mb-2">Detail Focused</h3>
              <p className="text-muted-foreground text-sm">Attention to every detail that customers notice</p>
            </div>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-16 px-4">
        <div className="max-w-4xl mx-auto text-center">
          <Card className="border-border/20 p-8">
            <CardContent className="p-0">
              <h2 className="text-3xl font-bold mb-4">Enhance Your Customer Experience</h2>
              <p className="text-lg text-muted-foreground mb-8">
                Create a welcoming retail environment that encourages customers to stay longer and return often.
              </p>
              <div className="flex flex-col sm:flex-row gap-4 justify-center">
                <Link href="/book?service=retail">
                  <Button size="lg" className="px-8 py-4 bg-green-500 hover:bg-green-600">
                    Schedule Store Visit
                  </Button>
                </Link>
                <Link href="mailto:retail@tidyteam.com">
                  <Button variant="outline" size="lg" className="px-8 py-4 border-green-500/30 bg-transparent">
                    <Mail className="mr-2 h-5 w-5" />
                    Get Retail Quote
                  </Button>
                </Link>
              </div>
            </CardContent>
          </Card>
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/page.tsx" isQuickEdit="true"
"use client"

import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import {
  Star,
  Shield,
  Zap,
  Sparkles,
  CheckCircle,
  ArrowRight,
  Play,
  Users,
  Award,
  Clock,
  Building2,
  Factory,
  ShoppingBag,
  Briefcase,
  MapPin,
  Heart,
  GraduationCap,
  Hammer,
  Key,
  X,
} from "lucide-react"
import Link from "next/link"
import { useState } from "react"

export default function HomePage() {
  const [showVideoModal, setShowVideoModal] = useState(false)

return (
    <div className="min-h-screen relative">
      {/* Enhanced Hero Section */}
      <section className="relative min-h-screen flex items-center justify-center overflow-hidden">
        <div className="absolute inset-0 bg-background">
          <div className="absolute inset-0 bg-gradient-to-r from-primary/5 via-transparent to-primary/10" />
        </div>

<div className="relative z-20 max-w-6xl mx-auto px-4 text-center">
          <Badge className="mb-6 neon-glow bg-primary/20 border-primary/30 text-xs sm:text-sm px-2 py-1 sm:px-4 sm:py-2 animate-pulse text-black">
            Premium Car Detailing & Home Services
          </Badge>

<h1 className="text-4xl sm:text-6xl md:text-8xl font-bold mb-8 neon-text bg-gradient-to-r from-foreground via-primary to-foreground bg-clip-text animate-gradient text-black">
            Shine Beyond Limits
          </h1>

<p className="text-lg sm:text-xl md:text-2xl text-muted-foreground mb-12 max-w-3xl mx-auto leading-relaxed">
            Experience the future of car detailing and home cleaning with our premium, technology-driven services that
            deliver perfection every time. Where innovation meets excellence.
          </p>

<div className="flex flex-col sm:flex-row gap-6 justify-center mb-16">
            <Link href="/book">
              <Button
                size="lg"
                className="neon-glow text-lg px-12 py-6 hover:shadow-xl hover:shadow-primary/30 transition-all duration-300 group hover-lift"
              >
                Book Your Service
                <ArrowRight className="ml-2 h-5 w-5 group-hover:translate-x-1 transition-transform" />
              </Button>
            </Link>
          </div>

<div className="flex flex-wrap justify-center items-center gap-8 text-sm text-muted-foreground">
            <div className="flex items-center gap-2 animate-sparkle">
              <Users className="h-4 w-4 text-primary" />
              <span>5,000+ Happy Customers</span>
            </div>
            <div className="flex items-center gap-2 animate-sparkle-delayed">
              <Award className="h-4 w-4 text-primary" />
              <span>Industry Leading Quality</span>
            </div>
            <div className="flex items-center gap-2 animate-sparkle">
              <Clock className="h-4 w-4 text-primary" />
              <span>Same Day Service</span>
            </div>
          </div>
        </div>
      </section>

{showVideoModal && (
        <div className="fixed inset-0 bg-black/80 backdrop-blur-sm z-50 flex items-center justify-center p-4">
          <div className="relative w-full max-w-4xl aspect-video bg-black rounded-2xl overflow-hidden glass">
            <button
              onClick={() => setShowVideoModal(false)}
              className="absolute top-4 right-4 z-10 p-2 bg-black/50 hover:bg-black/70 rounded-full text-white transition-colors"
            >
              <X className="h-6 w-6" />
            </button>
            <video
              className="w-full h-full object-cover"
              controls
              autoPlay
              poster="/professional-car-detailing-service-demonstration.png"
            >
              <source src="/demo-video.mp4" type="video/mp4" />
              Your browser does not support the video tag.
            </video>
          </div>
        </div>
      )}

<section className="py-16 sm:py-24 px-4 relative z-10 bg-gradient-to-r from-primary/5 via-transparent to-primary/5">
        <div className="max-w-6xl mx-auto">
          <div className="text-center mb-12 sm:mb-16">
            <h2 className="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4 sm:mb-6 neon-text">See Us in Action</h2>
            <p className="text-lg sm:text-xl text-muted-foreground max-w-2xl mx-auto">
              Watch how our professional team transforms vehicles and homes with precision and care
            </p>
          </div>

<div className="relative max-w-4xl mx-auto">
            <div
              className="relative aspect-video rounded-2xl overflow-hidden glass border-2 border-primary/20 hover:border-primary/40 transition-all duration-300 group cursor-pointer hover-lift"
              onClick={() => setShowVideoModal(true)}
            >
              <img
                src="/professional-car-detailing-service-team-working-on.png"
                alt="Professional car detailing demonstration"
                className="w-full h-full object-cover"
              />
              <div className="absolute inset-0 bg-black/30 group-hover:bg-black/20 transition-colors flex items-center justify-center">
                <div className="w-20 h-20 bg-primary/90 rounded-full flex items-center justify-center group-hover:scale-110 transition-transform neon-glow">
                  <Play className="h-8 w-8 text-white ml-1" />
                </div>
              </div>
              <div className="absolute bottom-4 left-4 right-4">
                <h3 className="text-white text-xl font-bold mb-2">Professional Service Demo</h3>
                <p className="text-white/80 text-sm">See our expert techniques and premium results</p>
              </div>
            </div>
          </div>
        </div>
      </section>

<section className="py-16 sm:py-24 px-4 relative z-10">
        <div className="max-w-6xl mx-auto">
          <div className="text-center mb-12 sm:mb-16">
            <h2 className="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4 sm:mb-6 neon-text">Our Premium Services</h2>
            <p className="text-lg sm:text-xl text-muted-foreground max-w-2xl mx-auto">
              Cutting-edge technology meets traditional craftsmanship to deliver unparalleled results
            </p>
          </div>

<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6 lg:gap-8">
            <Link href="/services/interior">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full hover-lift">
                <CardContent className="p-6 sm:p-8 text-center h-full flex flex-col">
                  <div className="w-12 h-12 sm:w-16 sm:h-16 bg-gradient-to-br from-primary/30 to-primary/10 rounded-2xl flex items-center justify-center mx-auto mb-4 sm:mb-6 group-hover:from-primary/40 group-hover:to-primary/20 transition-all duration-300 animate-pulse-glow">
                    <Sparkles className="h-6 w-6 sm:h-8 sm:w-8 text-primary" />
                  </div>
                  <h3 className="text-lg sm:text-xl font-semibold mb-2 sm:mb-3">Car Detailing</h3>
                  <p className="text-sm sm:text-base text-muted-foreground mb-3 sm:mb-4 flex-grow">
                    Premium interior and exterior detailing services with nano-technology protection
                  </p>
                  <div className="flex items-center justify-center text-xs sm:text-sm text-primary">
                    <CheckCircle className="h-3 w-3 sm:h-4 sm:w-4 mr-1" />
                    <span>75% Focus</span>
                  </div>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/paint-protection">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full hover-lift">
                <CardContent className="p-6 sm:p-8 text-center h-full flex flex-col">
                  <div className="w-12 h-12 sm:w-16 sm:h-16 bg-gradient-to-br from-primary/30 to-primary/10 rounded-2xl flex items-center justify-center mx-auto mb-4 sm:mb-6 group-hover:from-primary/40 group-hover:to-primary/20 transition-all duration-300 service-exterior-glow">
                    <Shield className="h-6 w-6 sm:h-8 sm:w-8 text-primary" />
                  </div>
                  <h3 className="text-lg sm:text-xl font-semibold mb-3">Paint Protection</h3>
                  <p className="text-sm sm:text-base text-muted-foreground mb-4 flex-grow">
                    Advanced ceramic coating and protection films with lifetime warranties
                  </p>
                  <div className="flex items-center justify-center text-sm text-primary">
                    <CheckCircle className="h-4 w-4 mr-1" />
                    <span>10 Year Warranty</span>
                  </div>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/maintenance">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full hover-lift">
                <CardContent className="p-6 sm:p-8 text-center h-full flex flex-col">
                  <div className="w-12 h-12 sm:w-16 sm:h-16 bg-gradient-to-br from-primary/30 to-primary/10 rounded-2xl flex items-center justify-center mx-auto mb-4 sm:mb-6 group-hover:from-primary/40 group-hover:to-primary/20 transition-all duration-300 service-maintenance-glow">
                    <Zap className="h-6 w-6 sm:h-8 sm:w-8 text-primary" />
                  </div>
                  <h3 className="text-lg sm:text-xl font-semibold mb-3">Maintenance Plans</h3>
                  <p className="text-sm sm:text-base text-muted-foreground mb-4 flex-grow">
                    Subscription packages for regular upkeep with smart scheduling
                  </p>
                  <div className="flex items-center justify-center text-sm text-primary">
                    <CheckCircle className="h-4 w-4 mr-1" />
                    <span>Save 30%</span>
                  </div>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/home-cleaning">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full hover-lift">
                <CardContent className="p-6 sm:p-8 text-center h-full flex flex-col">
                  <div className="w-12 h-12 sm:w-16 sm:h-16 bg-gradient-to-br from-primary/30 to-primary/10 rounded-2xl flex items-center justify-center mx-auto mb-4 sm:mb-6 group-hover:from-primary/40 group-hover:to-primary/20 transition-all duration-300 service-interior-glow">
                    <Star className="h-6 w-6 sm:h-8 sm:w-8 text-primary" />
                  </div>
                  <h3 className="text-lg sm:text-xl font-semibold mb-3">Home Cleaning</h3>
                  <p className="text-sm sm:text-base text-muted-foreground mb-4 flex-grow">
                    Professional residential cleaning services with eco-friendly solutions
                  </p>
                  <div className="flex items-center justify-center text-sm text-primary">
                    <CheckCircle className="h-4 w-4 mr-1" />
                    <span>25% Focus</span>
                  </div>
                </CardContent>
              </Card>
            </Link>
          </div>
        </div>
      </section>

<section className="py-16 sm:py-24 px-4 relative z-10">
        <div className="max-w-6xl mx-auto">
          <div className="text-center mb-12 sm:mb-16">
            <h2 className="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4 sm:mb-6 neon-text">Who We Serve</h2>
            <p className="text-lg sm:text-xl text-muted-foreground max-w-2xl mx-auto">
              Trusted by diverse clients across all sectors with tailored solutions for every need
            </p>
          </div>

<div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-3 sm:gap-4 md:gap-5 lg:gap-6 mb-8 sm:mb-10 md:mb-12">
            <Link href="/services/commercial">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full min-h-[140px] sm:min-h-[160px] md:min-h-[180px] lg:min-h-[200px] hover-lift">
                <CardContent className="p-3 sm:p-4 md:p-5 lg:p-6 text-center h-full flex flex-col justify-center">
                  <div className="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 bg-gradient-to-br from-blue-500/30 to-blue-500/10 rounded-lg sm:rounded-xl flex items-center justify-center mx-auto mb-2 sm:mb-3 md:mb-4 group-hover:from-blue-500/40 group-hover:to-blue-500/20 transition-all duration-300">
                    <Building2 className="h-4 w-4 sm:h-5 sm:w-5 md:h-6 md:w-6 lg:h-7 lg:w-7 text-blue-500" />
                  </div>
                  <h3 className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mb-1 sm:mb-2 md:mb-3 leading-tight">
                    Commercial
                  </h3>
                  <p className="text-xs sm:text-xs md:text-sm text-muted-foreground leading-tight">
                    Office buildings, retail spaces, and business facilities
                  </p>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/industrial">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full min-h-[140px] sm:min-h-[160px] md:min-h-[180px] lg:min-h-[200px] hover-lift">
                <CardContent className="p-3 sm:p-4 md:p-5 lg:p-6 text-center h-full flex flex-col justify-center">
                  <div className="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 bg-gradient-to-br from-orange-500/30 to-orange-500/10 rounded-lg sm:rounded-xl flex items-center justify-center mx-auto mb-2 sm:mb-3 md:mb-4 group-hover:from-orange-500/40 group-hover:to-orange-500/20 transition-all duration-300">
                    <Factory className="h-4 w-4 sm:h-5 sm:w-5 md:h-6 md:w-6 lg:h-7 lg:w-7 text-orange-500" />
                  </div>
                  <h3 className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mb-1 sm:mb-2 md:mb-3 leading-tight">
                    Industrial
                  </h3>
                  <p className="text-xs sm:text-xs md:text-sm text-muted-foreground leading-tight">
                    Manufacturing plants, warehouses, and industrial facilities
                  </p>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/retail">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full min-h-[140px] sm:min-h-[160px] md:min-h-[180px] lg:min-h-[200px] hover-lift">
                <CardContent className="p-3 sm:p-4 md:p-5 lg:p-6 text-center h-full flex flex-col justify-center">
                  <div className="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 bg-gradient-to-br from-green-500/30 to-green-500/10 rounded-lg sm:rounded-xl flex items-center justify-center mx-auto mb-2 sm:mb-3 md:mb-4 group-hover:from-green-500/40 group-hover:to-green-500/20 transition-all duration-300">
                    <ShoppingBag className="h-4 w-4 sm:h-5 sm:w-5 md:h-6 md:w-6 lg:h-7 lg:w-7 text-green-500" />
                  </div>
                  <h3 className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mb-1 sm:mb-2 md:mb-3 leading-tight">
                    Retail
                  </h3>
                  <p className="text-xs sm:text-xs md:text-sm text-muted-foreground leading-tight">
                    Shops, showrooms, and customer-facing spaces
                  </p>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/office">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full min-h-[140px] sm:min-h-[160px] md:min-h-[180px] lg:min-h-[200px] hover-lift">
                <CardContent className="p-3 sm:p-4 md:p-5 lg:p-6 text-center h-full flex flex-col justify-center">
                  <div className="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 bg-gradient-to-br from-purple-500/30 to-purple-500/10 rounded-lg sm:rounded-xl flex items-center justify-center mx-auto mb-2 sm:mb-3 md:mb-4 group-hover:from-purple-500/40 group-hover:to-purple-500/20 transition-all duration-300">
                    <Briefcase className="h-4 w-4 sm:h-5 sm:w-5 md:h-6 md:w-6 lg:h-7 lg:w-7 text-purple-500" />
                  </div>
                  <h3 className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mb-1 sm:mb-2 md:mb-3 leading-tight">
                    Office
                  </h3>
                  <p className="text-xs sm:text-xs md:text-sm text-muted-foreground leading-tight">
                    Corporate offices and professional workspaces
                  </p>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/local-authority">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full min-h-[140px] sm:min-h-[160px] md:min-h-[180px] lg:min-h-[200px] hover-lift">
                <CardContent className="p-3 sm:p-4 md:p-5 lg:p-6 text-center h-full flex flex-col justify-center">
                  <div className="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 bg-gradient-to-br from-red-500/30 to-red-500/10 rounded-lg sm:rounded-xl flex items-center justify-center mx-auto mb-2 sm:mb-3 md:mb-4 group-hover:from-red-500/40 group-hover:to-red-500/20 transition-all duration-300">
                    <MapPin className="h-4 w-4 sm:h-5 sm:w-5 md:h-6 md:w-6 lg:h-7 lg:w-7 text-red-500" />
                  </div>
                  <h3 className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mb-1 sm:mb-2 md:mb-3 leading-tight">
                    Local Authority
                  </h3>
                  <p className="text-xs sm:text-xs md:text-sm text-muted-foreground leading-tight">
                    Council buildings and public facilities
                  </p>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/nhs">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full min-h-[140px] sm:min-h-[160px] md:min-h-[180px] lg:min-h-[200px] hover-lift">
                <CardContent className="p-3 sm:p-4 md:p-5 lg:p-6 text-center h-full flex flex-col justify-center">
                  <div className="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 bg-gradient-to-br from-teal-500/30 to-teal-500/10 rounded-lg sm:rounded-xl flex items-center justify-center mx-auto mb-2 sm:mb-3 md:mb-4 group-hover:from-teal-500/40 group-hover:to-teal-500/20 transition-all duration-300">
                    <Heart className="h-4 w-4 sm:h-5 sm:w-5 md:h-6 md:w-6 lg:h-7 lg:w-7 text-teal-500" />
                  </div>
                  <h3 className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mb-1 sm:mb-2 md:mb-3 leading-tight">
                    NHS Authority
                  </h3>
                  <p className="text-xs sm:text-xs md:text-sm text-muted-foreground leading-tight">
                    Hospitals, clinics, and healthcare facilities
                  </p>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/nursing-homes">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full min-h-[140px] sm:min-h-[160px] md:min-h-[180px] lg:min-h-[200px] hover-lift">
                <CardContent className="p-3 sm:p-4 md:p-5 lg:p-6 text-center h-full flex flex-col justify-center">
                  <div className="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 bg-gradient-to-br from-pink-500/30 to-pink-500/10 rounded-lg sm:rounded-xl flex items-center justify-center mx-auto mb-2 sm:mb-3 md:mb-4 group-hover:from-pink-500/40 group-hover:to-pink-500/20 transition-all duration-300">
                    <Heart className="h-4 w-4 sm:h-5 sm:w-5 md:h-6 md:w-6 lg:h-7 lg:w-7 text-pink-500" />
                  </div>
                  <h3 className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mb-1 sm:mb-2 md:mb-3 leading-tight">
                    Nursing Homes
                  </h3>
                  <p className="text-xs sm:text-xs md:text-sm text-muted-foreground leading-tight">
                    Care facilities and residential homes
                  </p>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/schools">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full min-h-[140px] sm:min-h-[160px] md:min-h-[180px] lg:min-h-[200px] hover-lift">
                <CardContent className="p-3 sm:p-4 md:p-5 lg:p-6 text-center h-full flex flex-col justify-center">
                  <div className="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 bg-gradient-to-br from-yellow-500/30 to-yellow-500/10 rounded-lg sm:rounded-xl flex items-center justify-center mx-auto mb-2 sm:mb-3 md:mb-4 group-hover:from-yellow-500/40 group-hover:to-yellow-500/20 transition-all duration-300">
                    <GraduationCap className="h-4 w-4 sm:h-5 sm:w-5 md:h-6 md:w-6 lg:h-7 lg:w-7 text-yellow-500" />
                  </div>
                  <h3 className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mb-1 sm:mb-2 md:mb-3 leading-tight">
                    Schools
                  </h3>
                  <p className="text-xs sm:text-xs md:text-sm text-muted-foreground leading-tight">
                    Educational institutions and learning facilities
                  </p>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/builders-cleans">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full min-h-[140px] sm:min-h-[160px] md:min-h-[180px] lg:min-h-[200px] hover-lift">
                <CardContent className="p-3 sm:p-4 md:p-5 lg:p-6 text-center h-full flex flex-col justify-center">
                  <div className="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 bg-gradient-to-br from-amber-500/30 to-amber-500/10 rounded-lg sm:rounded-xl flex items-center justify-center mx-auto mb-2 sm:mb-3 md:mb-4 group-hover:from-amber-500/40 group-hover:to-amber-500/20 transition-all duration-300">
                    <Hammer className="h-4 w-4 sm:h-5 sm:w-5 md:h-6 md:w-6 lg:h-7 lg:w-7 text-amber-500" />
                  </div>
                  <h3 className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mb-1 sm:mb-2 md:mb-3 leading-tight">
                    Builders Cleans
                  </h3>
                  <p className="text-xs sm:text-xs md:text-sm text-muted-foreground leading-tight">
                    Post-construction and renovation cleaning
                  </p>
                </CardContent>
              </Card>
            </Link>

<Link href="/services/property-letting">
              <Card className="glass border-border/20 hover:border-primary/50 transition-all duration-500 group cursor-pointer h-full min-h-[140px] sm:min-h-[160px] md:min-h-[180px] lg:min-h-[200px] hover-lift">
                <CardContent className="p-3 sm:p-4 md:p-5 lg:p-6 text-center h-full flex flex-col justify-center">
                  <div className="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 lg:w-14 lg:h-14 bg-gradient-to-br from-indigo-500/30 to-indigo-500/10 rounded-lg sm:rounded-xl flex items-center justify-center mx-auto mb-2 sm:mb-3 md:mb-4 group-hover:from-indigo-500/40 group-hover:to-indigo-500/20 transition-all duration-300">
                    <Key className="h-4 w-4 sm:h-5 sm:w-5 md:h-6 md:w-6 lg:h-7 lg:w-7 text-indigo-500" />
                  </div>
                  <h3 className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mb-1 sm:mb-2 md:mb-3 leading-tight">
                    Property Letting
                  </h3>
                  <p className="text-xs sm:text-xs md:text-sm text-muted-foreground leading-tight">
                    Estate agents and rental property management
                  </p>
                </CardContent>
              </Card>
            </Link>
          </div>

<div className="flex justify-center">
            <Link href="/services/book">
              <Button
                size="lg"
                className="neon-glow text-lg px-12 py-6 hover:shadow-xl hover:shadow-primary/30 transition-all duration-300 group hover-lift"
              >
                Book Your Service
                <ArrowRight className="ml-2 h-5 w-5 group-hover:translate-x-1 transition-transform" />
              </Button>
            </Link>
            <Link href="/services/maintenance">
              <Button
                variant="outline"
                size="lg"
                className="text-base sm:text-lg px-8 sm:px-12 py-4 sm:py-6 glass border-primary/30 hover:bg-primary/10 bg-transparent w-full sm:w-auto hover-lift"
              >
                View Pricing
              </Button>
            </Link>
          </div>
          <p className="text-xs sm:text-sm text-muted-foreground mt-4 sm:mt-6">
            Free consultation • Same-day booking • 100% satisfaction guarantee
          </p>
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/services/office/page.tsx"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import {
  Briefcase,
  CheckCircle,
  ArrowRight,
  Users,
  Clock,
  Shield,
  Star,
  Building,
  Coffee,
  Wifi,
  Phone,
  Calendar,
} from "lucide-react"
import Link from "next/link"

export default function OfficePage() {
  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <section className="relative py-24 px-4 bg-gradient-to-br from-purple-50 to-purple-100">
        <div className="max-w-6xl mx-auto text-center">
          <Badge className="mb-6 bg-purple-100 text-purple-800 border-purple-200">
            <Briefcase className="h-4 w-4 mr-2" />
            Office Cleaning Services
          </Badge>

<h1 className="text-5xl font-bold mb-6 text-gray-900">Professional Office Cleaning</h1>

<p className="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
            Create a productive and healthy work environment with our comprehensive office cleaning services. From
            corporate headquarters to small business offices, we maintain professional standards that impress clients
            and motivate employees.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" className="bg-purple-600 hover:bg-purple-700">
                Get Free Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button variant="outline" size="lg" className="border-purple-300 text-purple-700 bg-transparent">
              <Phone className="mr-2 h-5 w-5" />
              Call (555) 123-4567
            </Button>
          </div>
        </div>
      </section>

{/* Services Grid */}
      <section className="py-16 px-4">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Our Office Cleaning Services</h2>

<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
            <Card className="border-purple-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Building className="h-12 w-12 text-purple-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Daily Office Cleaning</h3>
                <p className="text-gray-600 mb-4">
                  Comprehensive daily cleaning including desks, floors, restrooms, and common areas to maintain a
                  pristine work environment.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Desk and workstation sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Floor vacuuming and mopping
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Restroom deep cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-purple-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Coffee className="h-12 w-12 text-purple-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Break Room & Kitchen</h3>
                <p className="text-gray-600 mb-4">
                  Specialized cleaning for office kitchens, break rooms, and dining areas with food-safe sanitization
                  protocols.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Appliance cleaning and sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Countertop and sink deep clean
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Refrigerator and microwave cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-purple-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Users className="h-12 w-12 text-purple-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Conference Rooms</h3>
                <p className="text-gray-600 mb-4">
                  Ensure your meeting spaces are always presentation-ready with thorough cleaning and setup services.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Table and chair sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    AV equipment dusting
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Whiteboard and glass cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-purple-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Wifi className="h-12 w-12 text-purple-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">IT Equipment Care</h3>
                <p className="text-gray-600 mb-4">
                  Specialized cleaning for computers, servers, and sensitive electronic equipment with anti-static
                  solutions.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Computer and monitor cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Keyboard and mouse sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Server room maintenance
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-purple-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Shield className="h-12 w-12 text-purple-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Disinfection Services</h3>
                <p className="text-gray-600 mb-4">
                  Advanced disinfection protocols to maintain a healthy workplace and reduce sick days among staff.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    High-touch surface sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Air quality improvement
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    EPA-approved disinfectants
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-purple-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Calendar className="h-12 w-12 text-purple-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Flexible Scheduling</h3>
                <p className="text-gray-600 mb-4">
                  Work around your business hours with flexible cleaning schedules including after-hours and weekend
                  services.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    After-hours cleaning available
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Weekend and holiday service
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Emergency cleaning response
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* Benefits Section */}
      <section className="py-16 px-4 bg-gray-50">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-8">Why Choose Our Office Cleaning?</h2>

<div className="grid md:grid-cols-3 gap-8">
            <div className="text-center">
              <Star className="h-12 w-12 text-purple-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Professional Standards</h3>
              <p className="text-gray-600">
                Trained staff following industry best practices for commercial cleaning excellence.
              </p>
            </div>

<div className="text-center">
              <Clock className="h-12 w-12 text-purple-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Reliable Service</h3>
              <p className="text-gray-600">
                Consistent, on-time service that you can depend on to maintain your professional image.
              </p>
            </div>

<div className="text-center">
              <Shield className="h-12 w-12 text-purple-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Fully Insured</h3>
              <p className="text-gray-600">
                Complete insurance coverage and bonded staff for your peace of mind and protection.
              </p>
            </div>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-16 px-4 bg-purple-600 text-white">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-6">Ready to Transform Your Office?</h2>
          <p className="text-xl mb-8 opacity-90">
            Get a free consultation and customized cleaning plan for your office space.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" variant="secondary" className="bg-white text-purple-600 hover:bg-gray-100">
                Schedule Free Consultation
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button
              size="lg"
              variant="outline"
              className="border-white text-white hover:bg-white hover:text-purple-600 bg-transparent"
            >
              <Phone className="mr-2 h-5 w-5" />
              Call Now: (555) 123-4567
            </Button>
          </div>
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/services/local-authority/page.tsx"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import {
  MapPin,
  CheckCircle,
  ArrowRight,
  Users,
  Clock,
  Shield,
  Star,
  Building,
  Gavel,
  FileText,
  Phone,
  Award,
} from "lucide-react"
import Link from "next/link"

export default function LocalAuthorityPage() {
  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <section className="relative py-24 px-4 bg-gradient-to-br from-red-50 to-red-100">
        <div className="max-w-6xl mx-auto text-center">
          <Badge className="mb-6 bg-red-100 text-red-800 border-red-200">
            <MapPin className="h-4 w-4 mr-2" />
            Local Authority Services
          </Badge>

<h1 className="text-5xl font-bold mb-6 text-gray-900">Local Authority Cleaning Services</h1>

<p className="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
            Trusted cleaning partner for council buildings, public facilities, and government offices. We understand the
            unique requirements of public sector cleaning with full compliance to health and safety regulations.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" className="bg-red-600 hover:bg-red-700">
                Request Tender Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button variant="outline" size="lg" className="border-red-300 text-red-700 bg-transparent">
              <Phone className="mr-2 h-5 w-5" />
              Call (555) 123-4567
            </Button>
          </div>
        </div>
      </section>

{/* Services Grid */}
      <section className="py-16 px-4">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Public Sector Cleaning Solutions</h2>

<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
            <Card className="border-red-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Building className="h-12 w-12 text-red-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Council Buildings</h3>
                <p className="text-gray-600 mb-4">
                  Comprehensive cleaning for town halls, civic centers, and administrative buildings with public access
                  considerations.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Public area maintenance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Office and meeting room cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Reception and waiting areas
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-red-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Users className="h-12 w-12 text-red-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Community Centers</h3>
                <p className="text-gray-600 mb-4">
                  Specialized cleaning for multi-purpose community facilities including sports halls, meeting rooms, and
                  event spaces.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Sports facility cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Event space preparation
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Kitchen and catering areas
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-red-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Gavel className="h-12 w-12 text-red-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Court Houses</h3>
                <p className="text-gray-600 mb-4">
                  High-security cleaning services for judicial facilities with strict protocols and background-checked
                  staff.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Security-cleared personnel
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Courtroom maintenance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Confidential document handling
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-red-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <FileText className="h-12 w-12 text-red-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Libraries & Archives</h3>
                <p className="text-gray-600 mb-4">
                  Specialized cleaning for document preservation areas, reading rooms, and public library spaces.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Document-safe cleaning methods
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Climate-controlled area maintenance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Public computer area cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-red-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Shield className="h-12 w-12 text-red-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Emergency Services</h3>
                <p className="text-gray-600 mb-4">
                  24/7 cleaning support for fire stations, police stations, and emergency response facilities.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    24/7 availability
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Decontamination services
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Equipment cleaning protocols
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-red-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Award className="h-12 w-12 text-red-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Compliance & Standards</h3>
                <p className="text-gray-600 mb-4">
                  Full compliance with public sector regulations, health and safety standards, and environmental
                  requirements.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    ISO 9001 certified processes
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    COSHH compliance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Environmental sustainability
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* Benefits Section */}
      <section className="py-16 px-4 bg-gray-50">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-8">Why Local Authorities Choose Us</h2>

<div className="grid md:grid-cols-3 gap-8">
            <div className="text-center">
              <Star className="h-12 w-12 text-red-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Public Sector Experience</h3>
              <p className="text-gray-600">
                Over 15 years serving local authorities with understanding of public sector requirements.
              </p>
            </div>

<div className="text-center">
              <Clock className="h-12 w-12 text-red-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Flexible Contracts</h3>
              <p className="text-gray-600">
                Adaptable service agreements that work within public sector budgets and procurement processes.
              </p>
            </div>

<div className="text-center">
              <Shield className="h-12 w-12 text-red-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Full Compliance</h3>
              <p className="text-gray-600">
                Complete adherence to all health, safety, and environmental regulations required by law.
              </p>
            </div>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-16 px-4 bg-red-600 text-white">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-6">Partner with a Trusted Public Sector Cleaner</h2>
          <p className="text-xl mb-8 opacity-90">
            Contact us for tender documentation and competitive quotes for your local authority cleaning needs.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" variant="secondary" className="bg-white text-red-600 hover:bg-gray-100">
                Request Tender Information
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button
              size="lg"
              variant="outline"
              className="border-white text-white hover:bg-white hover:text-red-600 bg-transparent"
            >
              <Phone className="mr-2 h-5 w-5" />
              Call Now: (555) 123-4567
            </Button>
          </div>
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/services/nhs/page.tsx"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import {
  Heart,
  CheckCircle,
  ArrowRight,
  Users,
  Clock,
  Shield,
  Star,
  Building,
  Stethoscope,
  Activity,
  Phone,
  Award,
  AlertTriangle,
} from "lucide-react"
import Link from "next/link"

export default function NHSPage() {
  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <section className="relative py-24 px-4 bg-gradient-to-br from-teal-50 to-teal-100">
        <div className="max-w-6xl mx-auto text-center">
          <Badge className="mb-6 bg-teal-100 text-teal-800 border-teal-200">
            <Heart className="h-4 w-4 mr-2" />
            NHS Healthcare Cleaning
          </Badge>

<h1 className="text-5xl font-bold mb-6 text-gray-900">NHS Healthcare Facility Cleaning</h1>

<p className="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
            Specialized cleaning services for NHS hospitals, clinics, and healthcare facilities. We maintain the highest
            standards of hygiene and infection control to protect patients, staff, and visitors.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" className="bg-teal-600 hover:bg-teal-700">
                Get Healthcare Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button variant="outline" size="lg" className="border-teal-300 text-teal-700 bg-transparent">
              <Phone className="mr-2 h-5 w-5" />
              Emergency: (555) 123-4567
            </Button>
          </div>
        </div>
      </section>

{/* Services Grid */}
      <section className="py-16 px-4">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Healthcare Cleaning Specialists</h2>

<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
            <Card className="border-teal-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Stethoscope className="h-12 w-12 text-teal-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Clinical Areas</h3>
                <p className="text-gray-600 mb-4">
                  Specialized cleaning for operating theaters, ICUs, and clinical areas with strict infection control
                  protocols.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Operating theater deep cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    ICU and critical care units
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Isolation room protocols
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-teal-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Building className="h-12 w-12 text-teal-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Patient Wards</h3>
                <p className="text-gray-600 mb-4">
                  Comprehensive ward cleaning including patient rooms, nursing stations, and common areas with patient
                  comfort in mind.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Patient room sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Nursing station maintenance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Bathroom and shower facilities
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-teal-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Users className="h-12 w-12 text-teal-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Public Areas</h3>
                <p className="text-gray-600 mb-4">
                  High-traffic area cleaning for reception, waiting rooms, corridors, and visitor facilities with
                  continuous maintenance.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Reception and waiting areas
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Corridor and stairwell cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Visitor facilities maintenance
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-teal-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <AlertTriangle className="h-12 w-12 text-teal-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Infection Control</h3>
                <p className="text-gray-600 mb-4">
                  Advanced disinfection and decontamination services following NHS infection prevention and control
                  guidelines.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    MRSA and C.diff protocols
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Terminal cleaning procedures
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Outbreak response cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-teal-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Activity className="h-12 w-12 text-teal-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Emergency Response</h3>
                <p className="text-gray-600 mb-4">
                  24/7 emergency cleaning services for spills, contamination incidents, and urgent sanitization
                  requirements.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    24/7 emergency response
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Biohazard cleanup
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Rapid deployment teams
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-teal-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Award className="h-12 w-12 text-teal-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Quality Assurance</h3>
                <p className="text-gray-600 mb-4">
                  Rigorous quality control with regular audits, ATP testing, and compliance monitoring to NHS standards.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    ATP hygiene monitoring
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Regular quality audits
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    NHS compliance reporting
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* Benefits Section */}
      <section className="py-16 px-4 bg-gray-50">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-8">Why NHS Trusts Choose Us</h2>

<div className="grid md:grid-cols-3 gap-8">
            <div className="text-center">
              <Star className="h-12 w-12 text-teal-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Healthcare Expertise</h3>
              <p className="text-gray-600">
                Specialized training in healthcare cleaning with deep understanding of clinical requirements.
              </p>
            </div>

<div className="text-center">
              <Clock className="h-12 w-12 text-teal-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">24/7 Availability</h3>
              <p className="text-gray-600">
                Round-the-clock service to support healthcare operations without disruption to patient care.
              </p>
            </div>

<div className="text-center">
              <Shield className="h-12 w-12 text-teal-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Full Accreditation</h3>
              <p className="text-gray-600">
                NHS approved contractor with all necessary certifications and insurance coverage.
              </p>
            </div>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-16 px-4 bg-teal-600 text-white">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-6">Protect Your Patients and Staff</h2>
          <p className="text-xl mb-8 opacity-90">
            Contact us for a comprehensive healthcare cleaning assessment and competitive quote.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" variant="secondary" className="bg-white text-teal-600 hover:bg-gray-100">
                Request Healthcare Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button
              size="lg"
              variant="outline"
              className="border-white text-white hover:bg-white hover:text-teal-600 bg-transparent"
            >
              <Phone className="mr-2 h-5 w-5" />
              Emergency: (555) 123-4567
            </Button>
          </div>
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/services/nursing-homes/page.tsx"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import {
  Heart,
  CheckCircle,
  ArrowRight,
  Users,
  Clock,
  Shield,
  Star,
  Building,
  Home,
  Utensils,
  Phone,
  Bed,
} from "lucide-react"
import Link from "next/link"

export default function NursingHomesPage() {
  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <section className="relative py-24 px-4 bg-gradient-to-br from-pink-50 to-pink-100">
        <div className="max-w-6xl mx-auto text-center">
          <Badge className="mb-6 bg-pink-100 text-pink-800 border-pink-200">
            <Heart className="h-4 w-4 mr-2" />
            Care Home Cleaning Services
          </Badge>

<h1 className="text-5xl font-bold mb-6 text-gray-900">Nursing Home & Care Facility Cleaning</h1>

<p className="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
            Compassionate cleaning services for nursing homes and residential care facilities. We create safe,
            comfortable environments that feel like home while maintaining the highest hygiene standards.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" className="bg-pink-600 hover:bg-pink-700">
                Get Care Home Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button variant="outline" size="lg" className="border-pink-300 text-pink-700 bg-transparent">
              <Phone className="mr-2 h-5 w-5" />
              Call (555) 123-4567
            </Button>
          </div>
        </div>
      </section>

{/* Services Grid */}
      <section className="py-16 px-4">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Specialized Care Home Cleaning</h2>

<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
            <Card className="border-pink-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Bed className="h-12 w-12 text-pink-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Resident Rooms</h3>
                <p className="text-gray-600 mb-4">
                  Gentle, respectful cleaning of private rooms with attention to personal belongings and resident
                  comfort.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Personal space sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Bathroom deep cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Furniture and surface care
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-pink-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Users className="h-12 w-12 text-pink-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Common Areas</h3>
                <p className="text-gray-600 mb-4">
                  Welcoming cleaning of lounges, activity rooms, and social spaces where residents gather and families
                  visit.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Lounge and sitting areas
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Activity and therapy rooms
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Reception and visiting areas
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-pink-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Utensils className="h-12 w-12 text-pink-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Dining Areas</h3>
                <p className="text-gray-600 mb-4">
                  Food-safe cleaning of dining rooms, kitchens, and food preparation areas with HACCP compliance.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Dining room sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Kitchen deep cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Food preparation areas
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-pink-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Building className="h-12 w-12 text-pink-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Administrative Areas</h3>
                <p className="text-gray-600 mb-4">
                  Professional cleaning of offices, nursing stations, and administrative areas with confidentiality
                  respect.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Office and desk cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Nursing station maintenance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Medical record areas
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-pink-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Shield className="h-12 w-12 text-pink-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Infection Control</h3>
                <p className="text-gray-600 mb-4">
                  Specialized disinfection protocols to protect vulnerable residents from infections and maintain health
                  standards.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    High-touch surface disinfection
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Isolation room protocols
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Outbreak response cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-pink-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Home className="h-12 w-12 text-pink-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Specialized Care</h3>
                <p className="text-gray-600 mb-4">
                  Dementia-friendly cleaning approaches and specialized care for residents with specific health
                  conditions.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Dementia-sensitive cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Quiet operation protocols
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Resident routine respect
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* Benefits Section */}
      <section className="py-16 px-4 bg-gray-50">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-8">Why Care Homes Trust Us</h2>

<div className="grid md:grid-cols-3 gap-8">
            <div className="text-center">
              <Star className="h-12 w-12 text-pink-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Compassionate Service</h3>
              <p className="text-gray-600">
                Staff trained in elderly care sensitivity with respectful, gentle cleaning approaches.
              </p>
            </div>

<div className="text-center">
              <Clock className="h-12 w-12 text-pink-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Flexible Scheduling</h3>
              <p className="text-gray-600">
                Cleaning schedules that work around resident activities, meal times, and care routines.
              </p>
            </div>

<div className="text-center">
              <Shield className="h-12 w-12 text-pink-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">CQC Compliant</h3>
              <p className="text-gray-600">
                Full compliance with Care Quality Commission standards and care home regulations.
              </p>
            </div>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-16 px-4 bg-pink-600 text-white">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-6">Create a Home-Like Environment</h2>
          <p className="text-xl mb-8 opacity-90">
            Let us help you maintain a clean, comfortable, and caring environment for your residents.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" variant="secondary" className="bg-white text-pink-600 hover:bg-gray-100">
                Schedule Care Home Assessment
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button
              size="lg"
              variant="outline"
              className="border-white text-white hover:bg-white hover:text-pink-600 bg-transparent"
            >
              <Phone className="mr-2 h-5 w-5" />
              Call Now: (555) 123-4567
            </Button>
          </div>
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/services/schools/page.tsx"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import {
  GraduationCap,
  CheckCircle,
  ArrowRight,
  Users,
  Clock,
  Shield,
  Star,
  Building,
  BookOpen,
  Utensils,
  Phone,
  Activity,
} from "lucide-react"
import Link from "next/link"

export default function SchoolsPage() {
  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <section className="relative py-24 px-4 bg-gradient-to-br from-yellow-50 to-yellow-100">
        <div className="max-w-6xl mx-auto text-center">
          <Badge className="mb-6 bg-yellow-100 text-yellow-800 border-yellow-200">
            <GraduationCap className="h-4 w-4 mr-2" />
            Educational Facility Cleaning
          </Badge>

<h1 className="text-5xl font-bold mb-6 text-gray-900">School & Educational Facility Cleaning</h1>

<p className="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
            Creating safe, healthy learning environments for students and staff. Our specialized school cleaning
            services support education by maintaining clean, hygienic facilities that promote learning and wellbeing.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" className="bg-yellow-600 hover:bg-yellow-700">
                Get School Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button variant="outline" size="lg" className="border-yellow-300 text-yellow-700 bg-transparent">
              <Phone className="mr-2 h-5 w-5" />
              Call (555) 123-4567
            </Button>
          </div>
        </div>
      </section>

{/* Services Grid */}
      <section className="py-16 px-4">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Comprehensive School Cleaning Services</h2>

<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
            <Card className="border-yellow-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <BookOpen className="h-12 w-12 text-yellow-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Classrooms</h3>
                <p className="text-gray-600 mb-4">
                  Daily cleaning of classrooms, desks, whiteboards, and learning equipment to maintain optimal learning
                  conditions.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Desk and chair sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Whiteboard and display cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Floor care and maintenance
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-yellow-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Users className="h-12 w-12 text-yellow-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Common Areas</h3>
                <p className="text-gray-600 mb-4">
                  High-traffic area cleaning including corridors, reception, staff rooms, and assembly halls with
                  continuous maintenance.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Corridor and stairwell cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Reception area maintenance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Assembly hall deep cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-yellow-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Utensils className="h-12 w-12 text-yellow-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Dining Facilities</h3>
                <p className="text-gray-600 mb-4">
                  Food-safe cleaning of canteens, kitchens, and dining areas with HACCP compliance for student meal
                  services.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Canteen and dining hall cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Kitchen deep sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Food preparation area maintenance
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-yellow-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Activity className="h-12 w-12 text-yellow-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Sports Facilities</h3>
                <p className="text-gray-600 mb-4">
                  Specialized cleaning for gymnasiums, sports halls, changing rooms, and outdoor sports equipment.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Gymnasium floor care
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Changing room sanitization
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Sports equipment cleaning
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-yellow-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Building className="h-12 w-12 text-yellow-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Administrative Areas</h3>
                <p className="text-gray-600 mb-4">
                  Professional cleaning of offices, staff rooms, and administrative areas with respect for confidential
                  materials.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Office and desk cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Staff room maintenance
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Meeting room preparation
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-yellow-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Shield className="h-12 w-12 text-yellow-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Health & Safety</h3>
                <p className="text-gray-600 mb-4">
                  Child-safe cleaning products and protocols with enhanced sanitization to reduce illness transmission.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Child-safe cleaning products
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Enhanced sanitization protocols
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    DBS-checked cleaning staff
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* Benefits Section */}
      <section className="py-16 px-4 bg-gray-50">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-8">Why Schools Choose Us</h2>

<div className="grid md:grid-cols-3 gap-8">
            <div className="text-center">
              <Star className="h-12 w-12 text-yellow-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Education Focused</h3>
              <p className="text-gray-600">
                Understanding of educational environments with minimal disruption to learning activities.
              </p>
            </div>

<div className="text-center">
              <Clock className="h-12 w-12 text-yellow-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Flexible Timing</h3>
              <p className="text-gray-600">
                Cleaning schedules that work around school hours, events, and holiday periods.
              </p>
            </div>

<div className="text-center">
              <Shield className="h-12 w-12 text-yellow-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Child Safety First</h3>
              <p className="text-gray-600">
                DBS-checked staff using child-safe products with comprehensive safeguarding protocols.
              </p>
            </div>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-16 px-4 bg-yellow-600 text-white">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-6">Support Better Learning Environments</h2>
          <p className="text-xl mb-8 opacity-90">
            Contact us for a school cleaning assessment and see how we can support your educational mission.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" variant="secondary" className="bg-white text-yellow-600 hover:bg-gray-100">
                Schedule School Assessment
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button
              size="lg"
              variant="outline"
              className="border-white text-white hover:bg-white hover:text-yellow-600 bg-transparent"
            >
              <Phone className="mr-2 h-5 w-5" />
              Call Now: (555) 123-4567
            </Button>
          </div>
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/services/builders-cleans/page.tsx"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import {
  Hammer,
  CheckCircle,
  ArrowRight,
  Users,
  Clock,
  Shield,
  Star,
  Building,
  HardHat,
  Wrench,
  Phone,
  Award,
  AlertTriangle,
} from "lucide-react"
import Link from "next/link"

export default function BuildersCleansPage() {
  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <section className="relative py-24 px-4 bg-gradient-to-br from-amber-50 to-amber-100">
        <div className="max-w-6xl mx-auto text-center">
          <Badge className="mb-6 bg-amber-100 text-amber-800 border-amber-200">
            <Hammer className="h-4 w-4 mr-2" />
            Post-Construction Cleaning
          </Badge>

<h1 className="text-5xl font-bold mb-6 text-gray-900">Builders Cleans & Post-Construction Services</h1>

<p className="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
            Professional post-construction cleaning services for builders, contractors, and property developers. We
            transform construction sites into pristine, move-in ready spaces with thorough deep cleaning and debris
            removal.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" className="bg-amber-600 hover:bg-amber-700">
                Get Construction Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button variant="outline" size="lg" className="border-amber-300 text-amber-700 bg-transparent">
              <Phone className="mr-2 h-5 w-5" />
              Call (555) 123-4567
            </Button>
          </div>
        </div>
      </section>

{/* Services Grid */}
      <section className="py-16 px-4">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Post-Construction Cleaning Specialists</h2>

<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
            <Card className="border-amber-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <HardHat className="h-12 w-12 text-amber-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Rough Clean</h3>
                <p className="text-gray-600 mb-4">
                  Initial post-construction cleaning including debris removal, dust cleaning, and basic surface
                  preparation.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Construction debris removal
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Heavy dust and dirt cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Surface preparation
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-amber-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Building className="h-12 w-12 text-amber-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Final Clean</h3>
                <p className="text-gray-600 mb-4">
                  Detailed final cleaning to make properties move-in ready with attention to every surface and fixture.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Window and glass cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Fixture and fitting polish
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Floor deep cleaning and sealing
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-amber-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Wrench className="h-12 w-12 text-amber-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Renovation Cleaning</h3>
                <p className="text-gray-600 mb-4">
                  Specialized cleaning for renovation projects including paint splatter removal and restoration
                  cleaning.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Paint and adhesive removal
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Restoration surface cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Protective film removal
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-amber-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Users className="h-12 w-12 text-amber-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Commercial Projects</h3>
                <p className="text-gray-600 mb-4">
                  Large-scale cleaning for commercial construction projects including offices, retail spaces, and
                  warehouses.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Large-scale project management
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Multi-floor coordination
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Tight deadline delivery
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-amber-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <AlertTriangle className="h-12 w-12 text-amber-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Hazardous Material</h3>
                <p className="text-gray-600 mb-4">
                  Safe handling and removal of construction-related hazardous materials with proper disposal protocols.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Asbestos-safe procedures
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Chemical residue removal
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Proper waste disposal
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-amber-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Award className="h-12 w-12 text-amber-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Quality Assurance</h3>
                <p className="text-gray-600 mb-4">
                  Comprehensive quality checks and snagging list completion to ensure properties meet handover
                  standards.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Pre-handover inspections
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Snagging list completion
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Quality certification
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* Benefits Section */}
      <section className="py-16 px-4 bg-gray-50">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-8">Why Builders Choose Us</h2>

<div className="grid md:grid-cols-3 gap-8">
            <div className="text-center">
              <Star className="h-12 w-12 text-amber-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Construction Experience</h3>
              <p className="text-gray-600">
                Extensive experience with construction sites and understanding of building trade requirements.
              </p>
            </div>

<div className="text-center">
              <Clock className="h-12 w-12 text-amber-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Project Deadlines</h3>
              <p className="text-gray-600">
                Reliable service delivery to meet tight construction deadlines and handover schedules.
              </p>
            </div>

<div className="text-center">
              <Shield className="h-12 w-12 text-amber-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Health & Safety</h3>
              <p className="text-gray-600">
                Full health and safety compliance with construction site protocols and insurance coverage.
              </p>
            </div>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-16 px-4 bg-amber-600 text-white">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-6">Ready for Handover?</h2>
          <p className="text-xl mb-8 opacity-90">
            Get your construction project ready for handover with our professional post-construction cleaning services.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" variant="secondary" className="bg-white text-amber-600 hover:bg-gray-100">
                Schedule Site Assessment
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button
              size="lg"
              variant="outline"
              className="border-white text-white hover:bg-white hover:text-amber-600 bg-transparent"
            >
              <Phone className="mr-2 h-5 w-5" />
              Call Now: (555) 123-4567
            </Button>
          </div>
        </div>
      </section>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/services/property-letting/page.tsx"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import {
  Key,
  CheckCircle,
  ArrowRight,
  Users,
  Clock,
  Shield,
  Star,
  Building,
  Home,
  FileText,
  Phone,
  Award,
  Calendar,
} from "lucide-react"
import Link from "next/link"

export default function PropertyLettingPage() {
  return (
    <div className="min-h-screen">
      {/* Hero Section */}
      <section className="relative py-24 px-4 bg-gradient-to-br from-indigo-50 to-indigo-100">
        <div className="max-w-6xl mx-auto text-center">
          <Badge className="mb-6 bg-indigo-100 text-indigo-800 border-indigo-200">
            <Key className="h-4 w-4 mr-2" />
            Property Management Cleaning
          </Badge>

<h1 className="text-5xl font-bold mb-6 text-gray-900">Property Letting & Estate Agent Services</h1>

<p className="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
            Professional cleaning services for estate agents, property managers, and rental property owners. We help you
            maintain property values and ensure quick turnarounds between tenancies with comprehensive cleaning
            solutions.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" className="bg-indigo-600 hover:bg-indigo-700">
                Get Property Quote
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button variant="outline" size="lg" className="border-indigo-300 text-indigo-700 bg-transparent">
              <Phone className="mr-2 h-5 w-5" />
              Call (555) 123-4567
            </Button>
          </div>
        </div>
      </section>

{/* Services Grid */}
      <section className="py-16 px-4">
        <div className="max-w-6xl mx-auto">
          <h2 className="text-3xl font-bold text-center mb-12">Property Management Cleaning Solutions</h2>

<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
            <Card className="border-indigo-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Home className="h-12 w-12 text-indigo-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">End of Tenancy</h3>
                <p className="text-gray-600 mb-4">
                  Comprehensive deep cleaning for rental properties between tenancies to ensure deposit return and quick
                  re-letting.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Full property deep clean
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Inventory condition matching
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Deposit protection compliance
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-indigo-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Building className="h-12 w-12 text-indigo-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Void Property Cleaning</h3>
                <p className="text-gray-600 mb-4">
                  Specialized cleaning for vacant properties including deep sanitization and preparation for new
                  tenants.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Vacant property deep clean
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Sanitization and deodorizing
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Move-in ready preparation
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-indigo-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Users className="h-12 w-12 text-indigo-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Viewing Preparation</h3>
                <p className="text-gray-600 mb-4">
                  Quick turnaround cleaning to prepare properties for viewings and ensure the best first impression for
                  potential tenants.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Same-day viewing preparation
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Key area focus cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Presentation enhancement
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-indigo-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <FileText className="h-12 w-12 text-indigo-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Inventory Support</h3>
                <p className="text-gray-600 mb-4">
                  Cleaning services aligned with property inventories and condition reports for accurate tenant
                  check-ins and check-outs.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Inventory-matched cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Condition report support
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Documentation assistance
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-indigo-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Calendar className="h-12 w-12 text-indigo-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Regular Maintenance</h3>
                <p className="text-gray-600 mb-4">
                  Ongoing cleaning services for occupied rental properties to maintain standards and protect property
                  investments.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Scheduled maintenance cleaning
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Property condition monitoring
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Tenant satisfaction support
                  </li>
                </ul>
              </CardContent>
            </Card>

<Card className="border-indigo-200 hover:shadow-lg transition-shadow">
              <CardContent className="p-6">
                <Award className="h-12 w-12 text-indigo-600 mb-4" />
                <h3 className="text-xl font-semibold mb-3">Portfolio Management</h3>
                <p className="text-gray-600 mb-4">
                  Comprehensive cleaning management for property portfolios with centralized booking and reporting
                  systems.
                </p>
                <ul className="space-y-2">
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Multi-property coordination
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Centralized reporting
                  </li>
                  <li className="flex items-center text-sm">
                    <CheckCircle className="h-4 w-4 text-green-500 mr-2" />
                    Volume discount pricing
                  </li>
                </ul>
              </CardContent>
            </Card>
          </div>
        </div>
      </section>

{/* Benefits Section */}
      <section className="py-16 px-4 bg-gray-50">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-8">Why Property Professionals Choose Us</h2>

<div className="grid md:grid-cols-3 gap-8">
            <div className="text-center">
              <Star className="h-12 w-12 text-indigo-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Property Expertise</h3>
              <p className="text-gray-600">
                Deep understanding of property management needs and rental market requirements.
              </p>
            </div>

<div className="text-center">
              <Clock className="h-12 w-12 text-indigo-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Quick Turnaround</h3>
              <p className="text-gray-600">
                Fast, efficient service to minimize void periods and maximize rental income potential.
              </p>
            </div>

<div className="text-center">
              <Shield className="h-12 w-12 text-indigo-600 mx-auto mb-4" />
              <h3 className="text-xl font-semibold mb-3">Reliable Partnership</h3>
              <p className="text-gray-600">
                Consistent, professional service you can depend on for all your property management needs.
              </p>
            </div>
          </div>
        </div>
      </section>

{/* CTA Section */}
      <section className="py-16 px-4 bg-indigo-600 text-white">
        <div className="max-w-4xl mx-auto text-center">
          <h2 className="text-3xl font-bold mb-6">Maximize Your Property Returns</h2>
          <p className="text-xl mb-8 opacity-90">
            Partner with us to maintain your property portfolio and ensure quick, profitable tenancy turnovers.
          </p>

<div className="flex flex-col sm:flex-row gap-4 justify-center">
            <Link href="/book">
              <Button size="lg" variant="secondary" className="bg-white text-indigo-600 hover:bg-gray-100">
                Schedule Property Assessment
                <ArrowRight className="ml-2 h-5 w-5" />
              </Button>
            </Link>
            <Button
              size="lg"
              variant="outline"
              className="border-white text-white hover:bg-white hover:text-indigo-600 bg-transparent"
            >
              <Phone className="mr-2 h-5 w-5" />
              Call Now: (555) 123-4567
            </Button>
          </div>
        </div>
      </section>
    </div>
  )
}</article></body></html>

Ceramic Coating

Watch Ceramic Coating Process

{benefit.title}

Ceramic Coating Packages

Our Ceramic Coating Process

{process.title}

Why Choose Our Ceramic Coating?

Protect Your Investment

Paint Protection Film

PPF Installation Process

{benefit.title}

PPF Protection Packages

Ultimate Paint Protection

Engine Bay Cleaning

Engine Cleaning Process

{benefit.title}

Engine Cleaning Packages

Safe & Professional Process

Pre-Cleaning Inspection

Safe Degreasing

Detail Cleaning

Protection Application

Why Engine Cleaning Matters

Professional Engine Care

Car Care Education

Featured Articles

{article.title}

Video Tutorials

{video.title}

Quick Tips

{tip.title}

Recent Articles

{article.title}

Stay Updated

Deep Cleaning Service

Our Deep Cleaning Process

Assessment

Preparation

Deep Clean

Final Inspection

Time Efficient

Eco-Friendly

Satisfaction Guaranteed

Ready for a Spotless Home?

Move In/Out Cleaning

Complete Cleaning Checklist

Same Day Service

Deposit Guarantee

Flexible Timing

Quality Assured

Make Your Move Stress-Free

Before & After Transformations

{video.customer}

Got Questions? We've Got Answers

{category.category}

Still Have Questions?

Enhance Your Service

Car Detailing Add-Ons

Home Cleaning Add-Ons

Ready to Enhance Your Service?

Tidy Team Rewards

Membership Tiers

How It Works

Book Services

Earn Points

Unlock Tiers

Redeem Rewards

Rewards Catalog

{reward.name}

Ready to Start Earning Rewards?

Advanced Protection

Premium Products

Satisfaction Guaranteed

Concours-Level Results

Long-Term Protection

Value Preservation

What's Included

Satisfaction Guarantee

Transform Your Vehicle Today

Save Time