Merge version_8_1777354098866 into main

Merge version_8_1777354098866 into main

src/App.tsx

@@ -1,329 +1,12 @@
-import AboutTestimonial from '@/components/sections/about/AboutTestimonial';
-import ContactCta from '@/components/sections/contact/ContactCta';
-import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
-import FeaturesStatisticsCards from '@/components/sections/features/FeaturesStatisticsCards';
-import FooterBrandReveal from '@/components/sections/footer/FooterBrandReveal';
-import HeroBillboard from '@/components/sections/hero/HeroBillboard';
-import NavbarCentered from '@/components/ui/NavbarCentered';
-import PricingSimpleCards from '@/components/sections/pricing/PricingSimpleCards';
-import ProductVariantCards from '@/components/sections/product/ProductVariantCards';
-import TestimonialRatingCards from '@/components/sections/testimonial/TestimonialRatingCards';
+import { Routes, Route } from "react-router-dom";
+import HomePage from "@/pages/HomePage";
+import ServicesPage from "@/pages/ServicesPage";
 
 export default function App() {
   return (
-    <>
-  <div id="nav" data-section="nav">
-      <NavbarCentered
-      logo="DriveEasy"
-      navItems={[
-        {
-          name: "Home",
-          href: "#hero",
-        },
-        {
-          name: "About",
-          href: "#about",
-        },
-        {
-          name: "Vehicles",
-          href: "#vehicles",
-        },
-        {
-          name: "Pricing",
-          href: "#pricing",
-        },
-      ]}
-      ctaButton={{
-        text: "Book Now",
-        href: "#contact",
-      }}
-    />
-  </div>
-
-  <div id="hero" data-section="hero">
-      <HeroBillboard
-      tag="Reliable Rental Service"
-      title="Drive Your Way with DriveEasy"
-      description="Premium car rentals for every journey. Discover a fleet of modern, well-maintained vehicles ready for your next adventure."
-      primaryButton={{
-        text: "Browse Fleet",
-        href: "#vehicles",
-      }}
-      secondaryButton={{
-        text: "Book Now",
-        href: "#contact",
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/child-perspective-motorcar-generic-race_1232-3545.jpg"
-    />
-  </div>
-
-  <div id="about" data-section="about">
-      <AboutTestimonial
-      tag="Why Us"
-      quote="DriveEasy transformed our vacation. The booking process was seamless, and the car was in pristine condition. Excellent service!"
-      author="Mark Thompson"
-      role="Frequent Traveler"
-      imageSrc="http://img.b2bpic.net/free-photo/happy-auto-repairman-handshaking-with-female-customer-workshop_637285-9789.jpg"
-    />
-  </div>
-
-  <div id="stats" data-section="stats">
-      <FeaturesStatisticsCards
-      tag="Our Impact"
-      title="Trusted by Thousands"
-      description="Data-driven excellence in vehicle rental experiences."
-      items={[
-        {
-          title: "Vehicles",
-          description: "Active fleet size",
-          label: "Fleet",
-          value: "500+",
-        },
-        {
-          title: "Happy Clients",
-          description: "Satisfied renters",
-          label: "Clients",
-          value: "15k+",
-        },
-        {
-          title: "Locations",
-          description: "Global reach",
-          label: "Stations",
-          value: "45",
-        },
-      ]}
-    />
-  </div>
-
-  <div id="vehicles" data-section="vehicles">
-      <ProductVariantCards
-      tag="Our Fleet"
-      title="Modern Vehicles"
-      description="Choose from our wide selection of high-quality vehicles."
-      products={[
-        {
-          name: "Economy Hatchback",
-          variant: "Compact",
-          price: "$45/day",
-          imageSrc: "http://img.b2bpic.net/free-photo/family-car-salon-woman-buying-car-little-african-girl-with-mther_1157-45011.jpg",
-        },
-        {
-          name: "Family SUV",
-          variant: "Spacious",
-          price: "$85/day",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-choosing-car-car-showroom_1303-22807.jpg",
-        },
-        {
-          name: "Executive Sedan",
-          variant: "Premium",
-          price: "$120/day",
-          imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-businessman-white-shirt-speaking-by-phone-entering-his-car-while-standing-outdoors-streets-city-near-modern-office-center_496169-517.jpg",
-        },
-        {
-          name: "Urban Crossover",
-          variant: "Versatile",
-          price: "$70/day",
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-couple-car-showroom-dealership_23-2149117122.jpg",
-        },
-        {
-          name: "Sports Coupe",
-          variant: "Performance",
-          price: "$150/day",
-          imageSrc: "http://img.b2bpic.net/free-photo/girl-car_1157-6513.jpg",
-        },
-        {
-          name: "Comfort Minivan",
-          variant: "Group",
-          price: "$110/day",
-          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-with-cute-chihuahua-dog_23-2150265005.jpg",
-        },
-      ]}
-    />
-  </div>
-
-  <div id="pricing" data-section="pricing">
-      <PricingSimpleCards
-      tag="Rates"
-      title="Affordable Plans"
-      description="Choose the rental duration that fits your travel plans."
-      plans={[
-        {
-          tag: "Basic",
-          price: "$49",
-          description: "For short city trips",
-          features: [
-            "Unlimited Miles",
-            "Basic Insurance",
-            "24/7 Support",
-          ],
-        },
-        {
-          tag: "Standard",
-          price: "$89",
-          description: "Best for weekend getaways",
-          features: [
-            "All Basic +",
-            "Premium Insurance",
-            "Free Cancellation",
-            "Roadside Assistance",
-          ],
-        },
-        {
-          tag: "Premium",
-          price: "$139",
-          description: "For long-term luxury travel",
-          features: [
-            "All Standard +",
-            "Full Coverage",
-            "Free Delivery",
-            "Priority Check-in",
-          ],
-        },
-      ]}
-    />
-  </div>
-
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialRatingCards
-      tag="Testimonials"
-      title="User Stories"
-      description="Hear from our happy customers."
-      testimonials={[
-        {
-          name: "Alice Johnson",
-          role: "Corporate Client",
-          quote: "Fantastic service and excellent vehicles.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/lady-car-salon-woman-buying-car-elegant-woman-blue-dress_1157-45031.jpg",
-        },
-        {
-          name: "Bob Smith",
-          role: "Traveler",
-          quote: "Easy booking and very helpful staff.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/people-technology-close-up-shot-happy-face-attractive-bearded-man-sitting-front-laptop-screen-smiling-joyfully-while-messaging-friends-online-via-social-networks_273609-6655.jpg",
-        },
-        {
-          name: "Charlie Davis",
-          role: "Local Renter",
-          quote: "Reliable and consistent quality.",
-          rating: 4,
-          imageSrc: "http://img.b2bpic.net/free-photo/young-traveler-enjoys-serenity-high-altitude-wilderness_482257-124914.jpg",
-        },
-        {
-          name: "Diana Prince",
-          role: "Vacationer",
-          quote: "Loved the clean and new car I got.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-customer-car-dealership-with-seller_23-2149106200.jpg",
-        },
-        {
-          name: "Edward Norton",
-          role: "Tourist",
-          quote: "Best car rental experience so far.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-green-eyed-brunette-woman-hair-band-white-t-shirt-against-wall-windows-cacti_197531-17042.jpg",
-        },
-      ]}
-    />
-  </div>
-
-  <div id="faq" data-section="faq">
-      <FaqTwoColumn
-      tag="Support"
-      title="Common Questions"
-      description="Find answers to our most popular questions here."
-      items={[
-        {
-          question: "What is the age requirement?",
-          answer: "You must be 21 years or older with a valid driver's license.",
-        },
-        {
-          question: "Are insurance plans included?",
-          answer: "We offer various insurance options, including full coverage.",
-        },
-        {
-          question: "Can I cancel my booking?",
-          answer: "Yes, cancellations are free if made 48 hours before pickup.",
-        },
-        {
-          question: "Is mileage unlimited?",
-          answer: "Most of our standard plans include unlimited mileage.",
-        },
-      ]}
-    />
-  </div>
-
-  <div id="contact" data-section="contact">
-      <ContactCta
-      tag="Ready to go?"
-      text="Start your booking today. Click the button to reach out."
-      primaryButton={{
-        text: "Contact Us",
-        href: "#footer",
-      }}
-      secondaryButton={{
-        text: "Book Fleet",
-        href: "#vehicles",
-      }}
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterBrandReveal
-      brand="DriveEasy"
-      columns={[
-        {
-          items: [
-            {
-              label: "About Us",
-              href: "#about",
-            },
-            {
-              label: "Services",
-              href: "#",
-            },
-            {
-              label: "Blog",
-              href: "#",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Terms of Service",
-              href: "#",
-            },
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Safety",
-              href: "#",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Contact",
-              href: "#",
-            },
-            {
-              label: "Locations",
-              href: "#",
-            },
-            {
-              label: "Support",
-              href: "#",
-            },
-          ],
-        },
-      ]}
-    />
-  </div>
-    </>
+    <Routes>
+      <Route path="/" element={<HomePage />} />
+      <Route path="/services" element={<ServicesPage />} />
+    </Routes>
   );
 }

src/components/sections/legal/LegalSection.tsx

@@ -0,0 +1,27 @@
+const LegalSection = () => {
+  return (
+    <section className="py-20">
+      <div className="w-content-width mx-auto">
+        <h2 className="text-3xl font-bold mb-6 text-center">Legal Information</h2>
+        <div className="space-y-4 text-foreground/80">
+          <p>
+            This website and its content are copyright of DriveEasy - © DriveEasy 2023. All rights reserved. Any redistribution or reproduction of part or all of the contents in any form is prohibited other than the following: you may print or download to a local hard disk extracts for your personal and non-commercial use only. You may not, except with our express written permission, distribute or commercially exploit the content. Nor may you transmit it or store it in any other website or other form of electronic retrieval system.
+          </p>
+          <h3 className="text-xl font-semibold pt-4">Terms of Service</h3>
+          <p>
+            By accessing this website, you are agreeing to be bound by these website Terms and Conditions of Use, all applicable laws and regulations, and agree that you are responsible for compliance with any applicable local laws. If you do not agree with any of these terms, you are prohibited from using or accessing this site. The materials contained in this website are protected by applicable copyright and trade mark law.
+          </p>
+          <p>
+            Permission is granted to temporarily download one copy of the materials (information or software) on DriveEasy's website for personal, non-commercial transitory viewing only. This is the grant of a license, not a transfer of title, and under this license you may not: modify or copy the materials; use the materials for any commercial purpose, or for any public display (commercial or non-commercial); attempt to decompile or reverse engineer any software contained on DriveEasy's website; remove any copyright or other proprietary notations from the materials; or transfer the materials to another person or 'mirror' the materials on any other server.
+          </p>
+          <h3 className="text-xl font-semibold pt-4">Privacy Policy</h3>
+          <p>
+            Your privacy is very important to us. Accordingly, we have developed this Policy in order for you to understand how we collect, use, communicate and disclose and make use of personal information. We are committed to conducting our business in accordance with these principles in order to ensure that the confidentiality of personal information is protected and maintained.
+          </p>
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default LegalSection;

src/components/sections/pricing/PricingPage.tsx

@@ -0,0 +1,52 @@
+import PricingCenteredCards from '@/components/sections/pricing/PricingCenteredCards';
+
+const pricingPlans = [
+    {
+      tag: "Basic",
+      price: "$49",
+      description: "For short city trips",
+      features: [
+        "Unlimited Miles",
+        "Basic Insurance",
+        "24/7 Support",
+      ],
+      primaryButton: { text: "Book Now", href: "#contact" },
+    },
+    {
+      tag: "Standard",
+      price: "$89",
+      description: "Best for weekend getaways",
+      features: [
+        "All Basic +",
+        "Premium Insurance",
+        "Free Cancellation",
+        "Roadside Assistance",
+      ],
+      primaryButton: { text: "Book Now", href: "#contact" },
+    },
+    {
+      tag: "Premium",
+      price: "$139",
+      description: "For long-term luxury travel",
+      features: [
+        "All Standard +",
+        "Full Coverage",
+        "Free Delivery",
+        "Priority Check-in",
+      ],
+      primaryButton: { text: "Book Now", href: "#contact" },
+    },
+  ];
+
+export default function PricingPage() {
+  return (
+    <section id="pricing" data-section="pricing">
+      <PricingCenteredCards
+        tag="Rates"
+        title="Affordable Plans"
+        description="Choose the rental duration that fits your travel plans."
+        plans={pricingPlans}
+      />
+    </section>
+  );
+}

src/components/sections/social-proof/SocialProofOne.tsx

@@ -0,0 +1,58 @@
+import TextAnimation from "@/components/ui/TextAnimation";
+import InfoCardMarquee from "@/components/ui/InfoCardMarquee";
+
+export default function SocialProofOne() {
+  const testimonials = [
+    { 
+      icon: "Star", 
+      label: "John Doe", 
+      value: "The best car rental experience I've ever had. Highly recommended!"
+    },
+    { 
+      icon: "Star", 
+      label: "Jane Smith", 
+      value: "Incredible selection of luxury vehicles. Will definitely use again."
+    },
+    { 
+      icon: "Star", 
+      label: "Michael Johnson", 
+      value: "Smooth process from start to finish. The Ferrari was a dream."
+    },
+    { 
+      icon: "Star", 
+      label: "Emily Davis", 
+      value: "Exceptional customer service and pristine cars."
+    },
+    { 
+      icon: "Star", 
+      label: "Chris Wilson", 
+      value: "A truly premium experience. The Porsche 911 was flawless."
+    }
+  ];
+
+  return (
+    <section aria-label="Social Proof section" className="py-20 overflow-hidden">
+      <div className="flex flex-col gap-8">
+        <div className="flex flex-col items-center w-content-width mx-auto gap-3 md:gap-2">
+          <span className="px-3 py-1 text-sm card rounded">Testimonials</span>
+          <TextAnimation
+            text="What Our Customers Say"
+            variant="slide-up"
+            tag="h2"
+            className="text-6xl font-medium text-center text-balance"
+          />
+          <TextAnimation
+            text="Don't just take our word for it. Hear from our satisfied clients who have experienced the thrill of driving our luxury fleet."
+            variant="slide-up"
+            tag="p"
+            className="md:max-w-6/10 text-lg leading-tight text-center"
+          />
+        </div>
+        
+        <div className="w-full mt-4">
+          <InfoCardMarquee items={testimonials} />
+        </div>
+      </div>
+    </section>
+  );
+}

src/index.css

@@ -1,4 +1,4 @@
-@import url('https://fonts.googleapis.com/css2?family=${interTight.variable}:wght@400;500;600;700&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
 @import "tailwindcss";
 @import "./styles/masks.css";
 @import "./styles/animations.css";
@@ -7,13 +7,13 @@
   /* @colorThemes/lightTheme/grayBlueAccent */
   --background: #ffffff;
   --card: #f9f9f9;
-  --foreground: #000612e6;
-  --primary-cta: #106EFB;
+  --foreground: #000f06e6;
+  --primary-cta: #0a7039;
   --primary-cta-text: #ffffff;
   --secondary-cta: #f9f9f9;
-  --secondary-cta-text: #000612e6;
+  --secondary-cta-text: #000f06e6;
   --accent: #e2e2e2;
-  --background-accent: #106EFB;
+  --background-accent: #c4c4c4;
 
   /* @layout/border-radius/rounded */
   --radius: 1rem;
@@ -88,7 +88,7 @@
   --color-background-accent: var(--background-accent);
 
   /* Fonts */
-  --font-sans: '${interTight.variable}', sans-serif;
+  --font-sans: 'Inter', sans-serif;
   --font-mono: monospace;
 
   /* Border Radius */
@@ -122,6 +122,12 @@
   --text-9xl: var(--text-9xl);
 }
 
+#pricing {
+  background: var(--background);
+  padding-top: 5rem;
+  padding-bottom: 5rem;
+}
+
 * {
   scrollbar-width: thin;
   scrollbar-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 0);
@@ -136,7 +142,7 @@ body {
   margin: 0;
   background-color: var(--background);
   color: var(--foreground);
-  font-family: '${interTight.variable}', sans-serif;
+  font-family: 'Inter', sans-serif;
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -149,7 +155,7 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: '${interTight.variable}', sans-serif;
+  font-family: 'Inter', sans-serif;
 }
 
 /* WEBILD_CARD_STYLE */

src/pages/HomePage.tsx

@@ -1,22 +1,100 @@
-import NavbarCentered from "@/components/ui/NavbarCentered";
 import { routes } from "@/routes";
+import NavbarCentered from "@/components/ui/NavbarCentered";
+import HeroBillboard from "@/components/sections/hero/HeroBillboard";
+import FeaturesAlternatingSplit from "@/components/sections/features/FeaturesAlternatingSplit";
+import ContactCta from "@/components/sections/contact/ContactCta";
+import FooterSimple from "@/components/sections/footer/FooterSimple";
+import SocialProofOne from '@/components/sections/social-proof/SocialProofOne';
 
-const HomePage = () => {
+export default function HomePage() {
   return (
-    <div className="min-h-screen bg-background">
+    <div className="flex min-h-screen flex-col bg-background text-foreground">
       <NavbarCentered
-        logo="Logo"
+        logo="Webild Cars"
         navItems={routes.map((r) => ({ name: r.label, href: r.path }))}
-        ctaButton={{ text: "Get Started", href: "#" }}
+        ctaButton={{ text: "Explore Models", href: "/ferrari" }}
       />
-      <main className="pt-20 flex flex-col items-center justify-center min-h-[80vh] px-4">
-        <h1 className="text-4xl font-bold text-foreground mb-4">Welcome</h1>
-        <p className="text-lg text-muted-foreground max-w-xl text-center">
-          Your website content will appear here.
-        </p>
+      <main className="flex-grow">
+        <HeroBillboard
+          tag="Premium Collection"
+          title="Experience Automotive Excellence"
+          description="Discover our curated selection of the world's most iconic luxury and performance vehicles. From the track-ready McLaren to the elegant Mercedes."
+          primaryButton={{ text: "View All Models", href: "/ferrari" }}
+          secondaryButton={{ text: "Contact Us", href: "/contact" }}
+          imageSrc="https://images.unsplash.com/photo-1542239616-c56783935935?q=80&w=2940&auto=format&fit=crop"
+        />
+        <FeaturesAlternatingSplit
+          tag="Our Fleet"
+          title="The Pinnacle of Engineering"
+          description="Explore our exclusive lineup of five legendary automotive marques, each offering a unique blend of performance, luxury, and heritage."
+          items={[
+            {
+              title: "Ferrari",
+              description: "Experience the passion of Italian engineering. Unmistakable design paired with naturally aspirated V12 and twin-turbo V8 engines that deliver pure exhilaration.",
+              primaryButton: { text: "Explore Ferrari", href: "/ferrari" },
+              imageSrc: "https://images.unsplash.com/photo-1592853625511-85c1178e2417?auto=format&fit=crop&q=80",
+            },
+            {
+              title: "Porsche",
+              description: "The perfect balance of everyday usability and track-focused performance. Discover the timeless silhouette of the 911 and the precision of German engineering.",
+              primaryButton: { text: "Explore Porsche", href: "/porsche" },
+              imageSrc: "https://images.unsplash.com/photo-1503376712341-0048236c9302?auto=format&fit=crop&q=80",
+            },
+            {
+              title: "McLaren",
+              description: "Born on the track, built for the road. McLaren brings Formula 1 technology to the street with ultra-lightweight carbon fiber chassis and aerodynamic perfection.",
+              primaryButton: { text: "Explore McLaren", href: "/mcclaren" },
+              imageSrc: "https://images.unsplash.com/photo-1621007947382-bb3c3994e3fd?auto=format&fit=crop&q=80",
+            },
+            {
+              title: "Mercedes-Benz",
+              description: "The best or nothing. Mercedes combines cutting-edge technology, unparalleled luxury, and the raw power of AMG to create the ultimate driving experience.",
+              primaryButton: { text: "Explore Mercedes", href: "/mercedes" },
+              imageSrc: "https://images.unsplash.com/photo-1618843479313-40f8afb4b4d8?auto=format&fit=crop&q=80",
+            },
+            {
+              title: "BMW",
+              description: "The ultimate driving machine. BMW M models offer a perfect harmony of aggressive styling, dynamic handling, and luxurious comfort for the discerning driver.",
+              primaryButton: { text: "Explore BMW", href: "/bmw" },
+              imageSrc: "https://images.unsplash.com/photo-1555093873-002d259e8238?auto=format&fit=crop&q=80",
+            }
+          ]}
+        />
+        <ContactCta
+          tag="Get Started"
+          text="Ready to Drive Your Dream Car?"
+          primaryButton={{ text: "Get in Touch", href: "/contact" }}
+          secondaryButton={{ text: "View Pricing", href: "/pricing" }}
+        />
       </main>
+      <FooterSimple
+        brand="Webild Cars"
+        columns={[
+          {
+            title: "Models",
+            items: [
+              { label: "Ferrari", href: "/ferrari" },
+              { label: "BMW", href: "/bmw" },
+              { label: "Porsche", href: "/porsche" },
+              { label: "Mercedes", href: "/mercedes" },
+              { label: "McLaren", href: "/mcclaren" },
+            ]
+          },
+          {
+            title: "Company",
+            items: [
+              { label: "About Us", href: "/about" },
+              { label: "Contact", href: "/contact" },
+              { label: "Services", href: "/services" },
+            ]
+          }
+        ]}
+        copyright="© 2024 Webild Cars. All rights reserved."
+        links={[
+          { label: "Privacy Policy", href: "/policy" },
+          { label: "Terms of Service", href: "/policy" },
+        ]}
+      />
     </div>
   );
-};
-
-export default HomePage;
+}

src/pages/ServicesPage.tsx

@@ -0,0 +1,25 @@
+import HeroSplit from "@/components/sections/hero/HeroSplit";
+import FeaturesAlternatingSplit from "@/components/sections/features/FeaturesAlternatingSplit";
+
+export default function ServicesPage() {
+  return (
+    <>
+      <HeroSplit
+        tag="Our Premium Services"
+        title="Experience Unmatched Convenience with DriveEasy"
+        description="From flexible booking and a diverse fleet to 24/7 roadside assistance and premium add-ons, we ensure every aspect of your journey is seamless and stress-free. Discover how we make car rental truly easy."
+        primaryButton={{"text":"Book Your Next Ride","href":"/vehicles"}}
+        secondaryButton={{"text":"Explore Our Offerings","href":"#service-details"}}
+        imageSrc="https://images.unsplash.com/photo-1583121274602-3e2820c69888?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1974&q=80"
+      />
+      <FeaturesAlternatingSplit
+        tag="Our Services"
+        title="Comprehensive Services for Your Journey"
+        description="At DriveEasy, we offer a range of premium services designed to make your car rental experience smooth, convenient, and worry-free."
+        primaryButton={{"text":"Book Your Car","href":"/vehicles"}}
+        secondaryButton={{"text":"View Pricing","href":"/pricing"}}
+        items={[{"title":"Seamless Online Booking","description":"Book your perfect car in just a few clicks, anytime, anywhere. Our user-friendly platform makes reservations a breeze.","imageSrc":"https://images.unsplash.com/photo-1556740738-b6a63e62c1d5?auto=format&fit=crop&q=80&w=2070&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"},{"title":"Flexible Rental Periods","description":"Whether it's for a day, a week, or a month, we offer flexible rental plans to fit your schedule and budget.","imageSrc":"https://images.unsplash.com/photo-1580239023190-84f39570189c?auto=format&fit=crop&q=80&w=2070&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"},{"title":"24/7 Roadside Assistance","description":"Travel with peace of mind knowing our dedicated support team is available around the clock for any unexpected situations.","imageSrc":"https://images.unsplash.com/photo-1582719503527-c77377786f5b?auto=format&fit=crop&q=80&w=2070&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"}]}
+      />
+    </>
+  );
+}

src/pages/cars/FerrariPage.tsx

@@ -0,0 +1,7 @@
+export default function FerrariPage() {
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-background text-foreground">
+      <h1 className="text-4xl font-bold">Ferrari Page Content</h1>
+    </div>
+  );
+}

src/routes.ts

@@ -6,4 +6,6 @@ export interface Route {
 
 export const routes: Route[] = [
   { path: '/', label: 'Home', pageFile: 'HomePage' },
+  { path: '/services', label: 'Services', pageFile: 'ServicesPage' },
+  { path: '/home', label: 'Home', pageFile: 'HomePage' },
 ];