src/App.tsx

@@ -5,9 +5,10 @@ import FeaturesStatisticsCards from '@/components/sections/features/FeaturesStat
 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 PricingPage from '@/components/sections/pricing/PricingPage';
 import ProductVariantCards from '@/components/sections/product/ProductVariantCards';
 import TestimonialRatingCards from '@/components/sections/testimonial/TestimonialRatingCards';
+import LegalSection from '@/components/sections/legal/LegalSection';
 
 export default function App() {
   return (
@@ -141,47 +142,7 @@ export default function App() {
     />
   </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>
+    <PricingPage />
 
   <div id="testimonials" data-section="testimonials">
       <TestimonialRatingCards
@@ -269,6 +230,10 @@ export default function App() {
     />
   </div>
 
+  <div id="legal" data-section="legal">
+    <LegalSection />
+  </div>
+
   <div id="footer" data-section="footer">
       <FooterBrandReveal
       brand="DriveEasy"

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/index.css

@@ -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);