Update src/app/fleet/page.tsx

Merge version_116 into main

src/app/fleet/page.tsx

@@ -2,13 +2,13 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import ProductCardFour from '@/components/sections/product/ProductCardFour';
-import HeroSplit from '@/components/sections/hero/HeroSplit';
-import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
-import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import HeroBillboard from '@/components/sections/hero/HeroBillboard';
+import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import { useState } from 'react';
-import { Shield, Sparkles, UserCheck } from 'lucide-react';
+import { Shield, Sparkles, UserCheck, CalendarDays, ClipboardList } from 'lucide-react';
 
 export default function FleetPage() {
   const [popupContent, setPopupContent] = useState<{title: string, body: string} | null>(null);
@@ -16,11 +16,11 @@ export default function FleetPage() {
   return (
     <ThemeProvider
         defaultButtonVariant="expand-hover"
-        defaultTextAnimation="background-highlight"
+        defaultTextAnimation="entrance-slide"
         borderRadius="rounded"
         contentWidth="medium"
-        sizing="largeSmallSizeLargeTitles"
-        background="blurBottom"
+        sizing="medium"
+        background="circleGradient"
         cardStyle="glass-elevated"
         primaryButtonStyle="gradient"
         secondaryButtonStyle="glass"
@@ -28,7 +28,7 @@ export default function FleetPage() {
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
-            <NavbarStyleCentered
+            <NavbarLayoutFloatingOverlay
             navItems={[
                 { name: "Home", id: "/" },
                 { name: "Our Premium Fleet", id: "/fleet" },
@@ -43,7 +43,7 @@ export default function FleetPage() {
         </div>
 
         <div id="hero" data-section="hero">
-            <HeroSplit
+            <HeroBillboard
             title="Our Premium Fleet"
             description="Discover our range of luxury mobile restroom trailers, meticulously designed for comfort and elegance."
             background={{ variant: "plain" }}
@@ -54,22 +54,22 @@ export default function FleetPage() {
         </div>
 
         <div id="features" data-section="features">
-            <FeatureHoverPattern
+            <FeatureCardSeven
             animationType="slide-up"
             textboxLayout="default"
             title="Why Choose Our Fleet"
             description="Quality, comfort, and reliability in every trailer."
             useInvertedBackground={false}
             features={[
-                { icon: Shield, title: "Climate Controlled", description: "Stay comfortable in any weather with our advanced climate control systems." },
-                { icon: Sparkles, title: "Modern Finishings", description: "Elegant interior designs that elevate the look and feel of your event." },
-                { icon: UserCheck, title: "Professional Support", description: "We handle delivery, setup, and maintenance so you don't have to." }
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832277795-ebq2l26f.png?_wi=1", imageAlt: "Climate Controlled", title: "Climate Controlled", description: "Stay comfortable in any weather with our advanced climate control systems." },
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832277795-ebq2l26f.png?_wi=1", imageAlt: "Modern Finishings", title: "Modern Finishings", description: "Elegant interior designs that elevate the look and feel of your event." },
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832277795-ebq2l26f.png?_wi=1", imageAlt: "Professional Support", title: "Professional Support", description: "We handle delivery, setup, and maintenance so you don't have to." }
             ]}
             />
         </div>
 
         <div id="fleet-preview" data-section="fleet-preview">
-            <ProductCardFour
+            <ProductCardOne
             animationType="slide-up"
             textboxLayout="split-description"
             gridVariant="four-items-2x2-equal-grid"
@@ -79,7 +79,6 @@ export default function FleetPage() {
                     id: "p1", 
                     name: "3 Station, Private Floorplan Restroom Trailer", 
                     price: "$1,375 per day", 
-                    variant: "Luxury", 
                     imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832277795-ebq2l26f.png?_wi=2",                    onProductClick: () => setPopupContent({
                         title: "3-Station Private Restroom Trailer",                        body: "Luxury 3-station trailer."
                     })
@@ -88,7 +87,6 @@ export default function FleetPage() {
                     id: "p2", 
                     name: "4 Station, Community Floorplan Restroom Trailer", 
                     price: "$1,825 per day", 
-                    variant: "Rustic", 
                     imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832470445-mr4qosuh.png",                    onProductClick: () => setPopupContent({
                         title: "4-Station Community Restroom Trailer",                        body: "Rustic elegance 4-station trailer."
                     })
@@ -97,7 +95,6 @@ export default function FleetPage() {
                     id: "p3", 
                     name: "Standard Trailer", 
                     price: "$900 per day", 
-                    variant: "Basic", 
                     imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777844457157-k1f0t370.png" 
                 }
             ]}
@@ -122,10 +119,11 @@ export default function FleetPage() {
         )}
 
         <div id="footer" data-section="footer">
-            <FooterLogoReveal
+            <FooterBaseCard
             logoText="CleanScene"
-            leftLink={{ text: "Privacy Policy", href: "/privacy" }}
-            rightLink={{ text: "Terms", href: "/terms" }}
+            columns={[
+                { title: "Links", items: [{ label: "Privacy Policy", href: "/privacy" }, { label: "Terms", href: "/terms" }] }
+            ]}
             />
         </div>
       </ReactLenis>