Update src/app/fleet/page.tsx

Merge version_116 into main

src/app/fleet/page.tsx

@@ -2,10 +2,13 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
-import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+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, CalendarDays, ClipboardList } from 'lucide-react';
 
 export default function FleetPage() {
   const [popupContent, setPopupContent] = useState<{title: string, body: string} | null>(null);
@@ -13,23 +16,23 @@ export default function FleetPage() {
   return (
     <ThemeProvider
         defaultButtonVariant="expand-hover"
-        defaultTextAnimation="background-highlight"
+        defaultTextAnimation="entrance-slide"
         borderRadius="rounded"
         contentWidth="medium"
-        sizing="largeSmallSizeLargeTitles"
-        background="blurBottom"
-        cardStyle="soft-shadow"
-        primaryButtonStyle="radial-glow"
-        secondaryButtonStyle="solid"
-        headingFontWeight="bold"
+        sizing="medium"
+        background="circleGradient"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="glass"
+        headingFontWeight="normal"
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
-            <NavbarLayoutFloatingInline
+            <NavbarLayoutFloatingOverlay
             navItems={[
                 { name: "Home", id: "/" },
                 { name: "Our Premium Fleet", id: "/fleet" },
-                { name: "Contact us", id: "/contact-us" },
+                { name: "Contact us", id: "/contact" },
             ]}
             brandName="CleanScene"
             logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777837799704-b8guhfm1.png"
@@ -39,8 +42,34 @@ export default function FleetPage() {
             />
         </div>
 
+        <div id="hero" data-section="hero">
+            <HeroBillboard
+            title="Our Premium Fleet"
+            description="Discover our range of luxury mobile restroom trailers, meticulously designed for comfort and elegance."
+            background={{ variant: "plain" }}
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832277795-ebq2l26f.png?_wi=1"
+            imageAlt="Fleet"
+            mediaAnimation="slide-up"
+            />
+        </div>
+
+        <div id="features" data-section="features">
+            <FeatureCardSeven
+            animationType="slide-up"
+            textboxLayout="default"
+            title="Why Choose Our Fleet"
+            description="Quality, comfort, and reliability in every trailer."
+            useInvertedBackground={false}
+            features={[
+                { 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">
-            <ProductCardTwo
+            <ProductCardOne
             animationType="slide-up"
             textboxLayout="split-description"
             gridVariant="four-items-2x2-equal-grid"
@@ -48,30 +77,29 @@ export default function FleetPage() {
             products={[
                 { 
                     id: "p1", 
-                    brand: "CleanScene", 
                     name: "3 Station, Private Floorplan Restroom Trailer", 
                     price: "$1,375 per day", 
-                    rating: 5, 
-                    reviewCount: "128", 
-                    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832277795-ebq2l26f.png?_wi=1",                    onProductClick: () => setPopupContent({
-                        title: "3-Station Private Restroom Trailer Rental in Northeast Wisconsin | Modern Finishings",                        body: "Elevate your Northeast Wisconsin wedding, private event, or boutique gathering with our 3-station private floorplan restroom trailer rental — a premium portable restroom solution for upscale events in the Green Bay area and beyond. This luxury restroom trailer features three fully private, individual restroom stations with sleek modern finishings, perfect for intimate weddings, VIP gatherings, and high-end private events.\n\nDesigned for maximum guest comfort and privacy, our 3-station restroom trailer includes climate-controlled interiors, flushable toilets, vanities with running water, and customizable music to match the atmosphere of your event. Built in the USA, our American-made restroom trailer delivers the reliability and elegance your event deserves — providing a comfortable, hotel-quality experience for every guest.\n\nBased in Green Bay, WI, CleanScene Restroom Rental provides prompt delivery, professional setup, and full-service support throughout Northeast Wisconsin — so your event runs smoothly from start to finish. Book your 3-station private restroom trailer rental in Green Bay and Northeast Wisconsin today."
+                    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."
                     })
                 },
                 { 
                     id: "p2", 
-                    brand: "CleanScene", 
                     name: "4 Station, Community Floorplan Restroom Trailer", 
                     price: "$1,825 per day", 
-                    rating: 5, 
-                    reviewCount: "95", 
-                    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832470445-mr4qosuh.png?_wi=1",                    onProductClick: () => setPopupContent({
-                        title: "4-Station Community Restroom Trailer Rental in Northeast Wisconsin | Rustic Elegance",                        body: "Elevate your Northeast Wisconsin wedding, private event, or community gathering with our 4-station community floorplan restroom trailer rental — a premium portable restroom solution designed for high-traffic events in the Green Bay area and beyond. This luxury restroom trailer features a traditional Men's and Women's layout with two stations each, finished with rustic wood interiors that bring warmth and elegance to any venue.\n\nDesigned for guest comfort, our community restroom trailer includes climate-controlled interiors, flushable toilets, vanities with running water, and customizable music to set the perfect atmosphere. Built in the USA, our American-made restroom trailer delivers the reliability and high-end experience your event deserves — whether it's a rustic wedding, outdoor festival, family reunion, or community celebration.\n\nBased in Green Bay, WI, CleanScene Restroom Rental provides prompt delivery, professional setup, and full-service support throughout Northeast Wisconsin — so your event runs smoothly from start to finish. Book your 4-station community restroom trailer rental in Green Bay and Northeast Wisconsin today."
+                    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."
                     })
                 },
+                { 
+                    id: "p3", 
+                    name: "Standard Trailer", 
+                    price: "$900 per day", 
+                    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777844457157-k1f0t370.png" 
+                }
             ]}
-            title="Our premium fleet"
-            textBoxTitleClassName="text-[#0a7039]"
-            description="Premium, climate-controlled mobile restrooms for every event size. Multi-day rental discounts available."
+            title="Our full fleet overview"
+            description="Explore our detailed product listings for more information."
             />
         </div>
 
@@ -81,7 +109,7 @@ export default function FleetPage() {
               <h3 className="text-2xl font-bold mb-4 whitespace-pre-wrap">{popupContent.title}</h3>
               <p className="text-gray-700 leading-relaxed whitespace-pre-wrap">{popupContent.body}</p>
               <button 
-                className="mt-6 bg-[#0a7039] text-white px-6 py-2 rounded hover:bg-[#075e2f] transition"
+                className="mt-6 bg-black text-white px-6 py-2 rounded transition"
                 onClick={() => setPopupContent(null)}
               >
                 Close
@@ -91,15 +119,14 @@ export default function FleetPage() {
         )}
 
         <div id="footer" data-section="footer">
-            <FooterLogoEmphasis
+            <FooterBaseCard
+            logoText="CleanScene"
             columns={[
-                { items: [{ label: "Home", href: "/" }, { label: "Our Premium Fleet", href: "/fleet" }, { label: "Get My Free Estimate", href: "/estimate" }] },
-                { items: [{ label: "Contact Us", href: "/contact-us" }, { label: "Privacy Policy", href: "/privacy" }, { label: "Terms", href: "/terms" }] },
+                { title: "Links", items: [{ label: "Privacy Policy", href: "/privacy" }, { label: "Terms", href: "/terms" }] }
             ]}
-            logoText=""
             />
         </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/layout.tsx

@@ -15,8 +15,8 @@ import { Open_Sans } from "next/font/google";
 
 
 export const metadata: Metadata = {
-  title: 'Luxury Restroom Trailer Rentals in Northeast Wisconsin | CleanScene',
-  description: 'Premium mobile restroom trailer rentals for weddings, corporate events & private estates across Green Bay, Appleton & Door County. Get a free estimate today.',
+  title: 'Our Premium Fleet | CleanScene',
+  description: 'Discover our range of luxury mobile restroom trailers, meticulously designed for comfort and elegance.',
   robots: {
     "index": true,
     "follow": true

src/app/page.tsx

@@ -8,7 +8,6 @@ import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloating
 import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
 import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
 import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
-import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
 
 export default function LandingPage() {
   return (
@@ -56,7 +55,7 @@ export default function LandingPage() {
                 { text: "Get My Free Estimate", href: "/estimate" },
                 { text: "View The Fleet", href: "/fleet" },
             ]}
-            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777135032652-q27squi7.jpg"
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777135032652-q27squi7.jpg?_wi=1"
             mediaAnimation="slide-up"
             />
         </div>
@@ -67,7 +66,8 @@ export default function LandingPage() {
             title="The CleanScene Difference"
             titleClassName="text-[#0a7039]"
             description={[
-                "We believe restrooms shouldn't just be functional - they should be part of the event design and experience.", "Our premium restroom trailers offer the comfort of a quality interior space to provide a modern hospitality experience.."
+                "Transform the standard event experience by providing luxury sanitation facilities that your guests will truly appreciate.", 
+                "Hiring premium restroom trailers means you are ensuring immaculate comfort and sophisticated design for your wedding, corporate gathering, or special event, removing any stress about guest facilities."
             ]}
             />
         </div>
@@ -79,29 +79,16 @@ export default function LandingPage() {
             gridVariant="asymmetric-60-wide-40-narrow"
             useInvertedBackground={false}
             products={[
-                { id: "p1", brand: "CleanScene", name: "3 Station, Private Floorplan Restroom Trailer", price: "$1,375 per day", rating: 5, reviewCount: "128", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832277795-ebq2l26f.png?_wi=2", onProductClick: () => window.location.href = "/fleet/p1" },
-                { id: "p2", brand: "CleanScene", name: "4 Station, Community Floorplan Restroom Trailer", price: "$1,825 per day", rating: 5, reviewCount: "95", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832470445-mr4qosuh.png?_wi=1", onProductClick: () => window.location.href = "/fleet/p2" },
+                { id: "p1", brand: "CleanScene", name: "3 Station, Private Floorplan Restroom Trailer", price: "$1,375 per day", rating: 5, reviewCount: "128", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832277795-ebq2l26f.png?_wi=2", onProductClick: () => window.location.href = "/fleet" },
+                { id: "p2", brand: "CleanScene", name: "4 Station, Community Floorplan Restroom Trailer", price: "$1,825 per day", rating: 5, reviewCount: "95", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777832470445-mr4qosuh.png?_wi=1", onProductClick: () => window.location.href = "/fleet" },
             ]}
             title="Our Premium Fleet"
             textBoxTitleClassName="text-[#0a7039]"
             description="Made-in-USA trailers designed for peak comfort."
-            buttons={[{ text: "View Full Specifications" }]}
+            buttons={[{ text: "View Full Specifications", href: "/fleet" }]}
             />
         </div>
 
-        <div id="hero-carousel" data-section="hero-carousel">
-          <HeroBillboardCarousel 
-            title="Experience Luxury"
-            description="Our premium fleet in action at events across the region."
-            background={{ variant: "gradient-bars" }}
-            mediaItems={[
-              { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777134554820-hv8fxndc.jpg", imageAlt: "Event scene 1" },
-              { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777134554820-rdizvwfd.jpg?_wi=2", imageAlt: "Event scene 2" },
-              { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777134554820-klkyjyqk.jpg", imageAlt: "Event scene 3" }
-            ]}
-          />
-        </div>
-
         <div id="features" data-section="features">
             <FeatureCardOne
             animationType="slide-up"
@@ -112,9 +99,9 @@ export default function LandingPage() {
             cardTitleClassName="text-[#0a7039]"
             description="Our premium rental fleet is designed to fit seamlessly into any Northeast Wisconsin event and leave a lasting impression."
             features={[
-                { title: "Weddings & Private Parties", description: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777134554820-hv8fxndc.jpg" },
+                { title: "Weddings & Private Parties", description: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777134554820-hv8fxndc.jpg?_wi=2" },
                 { title: "Community Events", description: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777134554820-rdizvwfd.jpg?_wi=2" },
-                { title: "Corporate Events", description: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777134554820-klkyjyqk.jpg" },
+                { title: "Corporate Events", description: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777134554820-klkyjyqk.jpg?_wi=2" },
             ]}
             />
         </div>

src/app/pricing/page.tsx

@@ -3,7 +3,7 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
-import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
+import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
 
 export default function PricingPage() {
@@ -37,7 +37,7 @@ export default function PricingPage() {
             />
         </div>
         <div id="pricing" data-section="pricing">
-            <PricingCardTwo
+            <PricingCardEight
                 useInvertedBackground={false}
                 animationType="slide-up"
                 textboxLayout="split"

src/app/privacy/page.tsx

@@ -4,57 +4,51 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
-import LegalSection from '@/components/legal/LegalSection';
 
 export default function PrivacyPage() {
   return (
     <ThemeProvider
         defaultButtonVariant="expand-hover"
-        defaultTextAnimation="entrance-slide"
+        defaultTextAnimation="background-highlight"
         borderRadius="rounded"
         contentWidth="medium"
-        sizing="medium"
-        background="circleGradient"
-        cardStyle="glass-elevated"
-        primaryButtonStyle="gradient"
-        secondaryButtonStyle="glass"
-        headingFontWeight="normal"
+        sizing="largeSmallSizeLargeTitles"
+        background="blurBottom"
+        cardStyle="soft-shadow"
+        primaryButtonStyle="radial-glow"
+        secondaryButtonStyle="solid"
+        headingFontWeight="bold"
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
             <NavbarLayoutFloatingInline
-            navItems={[
-                { name: "Home", id: "/" },
-                { name: "Our Premium Fleet", id: "/fleet" },
-                { name: "Contact us", id: "/contact-us" },
-            ]}
-            brandName="CleanScene"
-            logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777837799704-b8guhfm1.png"
-            logoAlt="CleanScene Logo"
-            button={{ text: "Get My Free Estimate", href: "/estimate" }}
-            className="py-2"
+                navItems={[
+                    { name: "Home", id: "/" },
+                    { name: "Our Premium Fleet", id: "/fleet" },
+                    { name: "Contact us", id: "/contact-us" },
+                ]}
+                brandName="CleanScene"
+                logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Cr9i1HT3S4vLNiV9XJ6S4fk81W/uploaded-1777837799704-b8guhfm1.png"
+                logoAlt="CleanScene Logo"
+                button={{ text: "Get My Free Estimate", href: "/estimate" }}
+                className="py-2"
             />
         </div>
 
-        <div id="legal" data-section="legal">
-            <LegalSection
-            layout="page"
-            title="Privacy Policy"
-            sections={[
-              { heading: "Data Collection", content: { type: "paragraph", text: "We collect information you provide directly to us when you use our services." } },
-              { heading: "Usage", content: { type: "list", items: ["To provide our services", "To improve user experience"] } },
-              { heading: "Security", content: { type: "numbered-list", items: ["We use encryption", "We restrict access"] } }
-            ]}
-            />
+        <div id="content" className="py-20 px-6 max-w-4xl mx-auto">
+            <h1 className="text-4xl font-bold mb-8 text-[#0a7039]">Privacy Policy</h1>
+            <div className="prose max-w-none">
+                <p>Welcome to CleanScene. This Privacy Policy explains how we collect, use, and protect your information when you visit our website or use our services.</p>
+            </div>
         </div>
 
         <div id="footer" data-section="footer">
             <FooterLogoEmphasis
-            columns={[
-                { items: [{ label: "Home", href: "/" }, { label: "Our Premium Fleet", href: "/fleet" }, { label: "Get My Free Estimate", href: "/estimate" }] },
-                { items: [{ label: "Contact Us", href: "/contact-us" }, { label: "Privacy Policy", href: "/privacy" }, { label: "Terms", href: "/terms" }] },
-            ]}
-            logoText="CleanScene"
+                columns={[
+                    { items: [{ label: "Home", href: "/" }, { label: "Our Premium Fleet", href: "/fleet" }, { label: "Get My Free Estimate", href: "/estimate" }] },
+                    { items: [{ label: "Contact Us", href: "/contact-us" }, { label: "Privacy Policy", href: "/privacy" }, { label: "Terms", href: "/terms" }] },
+                ]}
+                logoText=""
             />
         </div>
       </ReactLenis>