Update src/app/page.tsx

Merge version_5 into main

src/app/order-confirmation/page.tsx

@@ -0,0 +1,63 @@
+"use client";
+
+import React from "react";
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import HeroOverlay from "@/components/sections/hero/HeroOverlay";
+import { CheckCircle } from "lucide-react";
+
+const globalNavItems = [
+  { name: "Solutions", id: "/#solutions" },
+  { name: "About Us", id: "/#about" },
+  { name: "Testimonials", id: "/#testimonials" },
+  { name: "FAQ", id: "/#faq" },
+  { name: "Contact", id: "/#contact" },
+  { name: "Shop", id: "/products" },
+  { name: "Get a Quote", id: "/order" }
+];
+
+export default function OrderConfirmationPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="directional-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="soft"
+      contentWidth="medium"
+      sizing="medium"
+      background="aurora"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            brandName="Star Cam"
+            navItems={globalNavItems}
+            button={{ text: "Get a Quote", href: "/order" }}
+            animateOnLoad={false}
+          />
+        </div>
+
+        <div id="order-confirmation" data-section="order-confirmation">
+          <HeroOverlay
+            title="Quote Request Received!"
+            description="Thank you for contacting Star Cam. We've received your request and will be in touch shortly to discuss your security needs."
+            tag="Confirmation"
+            tagIcon={CheckCircle}
+            buttons={[
+              { text: "Back to Home", href: "/" }
+            ]}
+            buttonAnimation="slide-up"
+            showDimOverlay={true}
+            showBlur={true}
+            textPosition="bottom"
+            ariaLabel="Order confirmation section"
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/order/page.tsx

@@ -0,0 +1,72 @@
+"use client";
+
+import React from "react";
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import { Sparkles } from "lucide-react";
+import ContactForm from "@/components/form/ContactForm";
+import { useRouter } from "next/navigation";
+
+const globalNavItems = [
+  { name: "Solutions", id: "/#solutions" },
+  { name: "About Us", id: "/#about" },
+  { name: "Testimonials", id: "/#testimonials" },
+  { name: "FAQ", id: "/#faq" },
+  { name: "Contact", id: "/#contact" },
+  { name: "Shop", id: "/products" },
+  { name: "Get a Quote", id: "/order" }
+];
+
+export default function OrderPage() {
+  const router = useRouter();
+
+  const handleSubmitOrder = async (orderData: any) => {
+    // In a real application, this would send orderData to your backend
+    console.log("Submitting order:", orderData);
+    // Simulate API call
+    await new Promise(resolve => setTimeout(resolve, 1000));
+    router.push('/order-confirmation'); // Redirect to confirmation page
+  };
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="directional-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="soft"
+      contentWidth="medium"
+      sizing="medium"
+      background="aurora"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            brandName="Star Cam"
+            navItems={globalNavItems}
+            button={{ text: "Get a Quote", href: "/order" }}
+            animateOnLoad={false}
+          />
+        </div>
+
+        <div id="order-form" data-section="order-form">
+          <ContactForm
+            title="Get Your Free Security Camera Quote"
+            description="Tell us about your security needs, and our experts will design a custom solution for you."
+            tag="Free Quote"
+            tagIcon={Sparkles}
+            inputPlaceholder="Describe your security requirements (e.g., 'Home surveillance', 'Business monitoring', 'Specific camera types')"
+            buttonText="Request Quote"
+            termsText="By submitting, you agree to allow Star Cam to contact you regarding your security quote."
+            onSubmit={handleSubmitOrder}
+            centered={true}
+            useInvertedBackground={false}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -14,6 +14,43 @@ import ContactCTA from "@/components/sections/contact/ContactCTA";
 import FooterMedia from "@/components/sections/footer/FooterMedia";
 import { ShieldCheck, Wrench, DollarSign, Phone } from "lucide-react";
 
+const globalNavItems = [
+  { name: "Services", id: "/#services" },
+  { name: "About", id: "/#about" },
+  { name: "Testimonials", id: "/#testimonials" },
+  { name: "FAQ", id: "/#faq" },
+  { name: "Contact", id: "/#contact" },
+  { name: "Products", id: "/products" },
+  { name: "Place Order", id: "/order" }
+];
+
+const globalFooterColumns = [
+  {
+    title: "Services",    items: [
+      { label: "AC Installation", href: "/#services" },
+      { label: "Heating Systems", href: "/#services" },
+      { label: "Maintenance Plans", href: "/#services" },
+      { label: "Emergency Repairs", href: "/#services" }
+    ]
+  },
+  {
+    title: "Company",    items: [
+      { label: "About Us", href: "/#about" },
+      { label: "Testimonials", href: "/#testimonials" },
+      { label: "FAQ", href: "/#faq" },
+      { label: "Contact", href: "/#contact" }
+    ]
+  },
+  {
+    title: "Contact",    items: [
+      { label: "(512) 555-1234", href: "tel:5125551234" },
+      { label: "info@airprohvac.com", href: "mailto:info@airprohvac.com" },
+      { label: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" },
+      { label: "123 Comfort St, Austin, TX 78701" }
+    ]
+  }
+];
+
 export default function HvacPage() {
   return (
     <ThemeProvider
@@ -31,34 +68,29 @@ export default function HvacPage() {
       <ReactLenis root>
         <div id="nav" data-section="nav">
           <NavbarLayoutFloatingInline
-            brandName="AirPro HVAC"
-            navItems={[
-              { name: "Services", id: "services" },
-              { name: "About", id: "about" },
-              { name: "Testimonials", id: "testimonials" },
-              { name: "Contact", id: "contact" },
-            ]}
-            button={{ text: "Get a Quote", href: "#contact" }}
+            brandName="STAR CAM  "
+            navItems={globalNavItems}
+            button={{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }}
             animateOnLoad={false}
           />
         </div>
 
         <div id="hero" data-section="hero">
           <HeroOverlay
-            title="Your Comfort Is Our Priority"
+            title="STAR CAM"
             description="Professional heating, ventilation, and air conditioning services for homes and businesses. From installations to emergency repairs, we keep your climate perfect year-round."
             avatars={[
-              { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-1.jpg", alt: "Client" },
-              { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.jpg", alt: "Client" },
-              { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.jpg", alt: "Client" },
+              { src: "https://img.b2bpic.net/free-photo/two-happy-men-working-together-new-business-project_171337-7319.jpg?id=7337520", alt: "Client" },
+              { src: "https://img.b2bpic.net/free-photo/beautiful-modern-building-modern-architecture_181624-21692.jpg?id=11111843", alt: "Client" },
+              { src: "https://img.b2bpic.net/premium-photo/man-hands-with-web-30-technology-digital-tech-future-30-technology-global-network-blockchain-crypto-currency-global-futuristic-website-internet-development-data_1137986-1558.jpg?id=145099533", alt: "Client" }
             ]}
             avatarText="Trusted by 500+ clients"
             buttons={[
-              { text: "Schedule Service", href: "#contact" },
-              { text: "Our Services", href: "#services" },
+              { text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" },
+              { text: "Our Services", href: "#services" }
             ]}
             buttonAnimation="slide-up"
-            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-1.jpg"
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EprnGZAq4usWBFNmipWTEdOdyV/uploaded-1780888285884-9y22pbat.png"
             imageAlt="HVAC technician performing system maintenance"
             showDimOverlay={true}
           />
@@ -67,13 +99,33 @@ export default function HvacPage() {
         <div id="about" data-section="about">
           <MetricSplitMediaAbout
             tag="About Us"
-            title="Reliable Climate Solutions Since 2005"
-            description="AirPro HVAC has been keeping homes and businesses comfortable for nearly two decades. Our certified technicians deliver expert installations, maintenance, and repairs — backed by transparent pricing and a commitment to getting the job done right the first time."
+            title="خبره طويله وثقه"
+            description="لماذا STAR CAM؟
+
+
+أحدث تقنيات المراقبة والأمان.
+
+
+جودة عالية وأداء موثوق.
+
+
+تركيب احترافي وفق أعلى المعايير.
+
+
+دعم فني وخدمة ما بعد البيع.
+
+
+حلول مخصصة تناسب مختلف القطاعات.
+
+
+نسعى إلى بناء بيئة أكثر أمانًا من خلال حلول ذكية تمنح عملاءنا راحة البال والثقة الكاملة في حماية ممتلكاتهم وأعمالهم.
+STAR CAM... نراقب المستقبل لحماية اليوم.
+"
             metrics={[
               {
                 value: "2,500+",                title: "Systems installed and serviced"},
               {
-                value: "98%",                title: "Customer satisfaction rate"},
+                value: "98%",                title: "Customer satisfaction rate"}
             ]}
             imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-2.jpg"
             imageAlt="Commercial HVAC units on rooftop"
@@ -89,7 +141,7 @@ export default function HvacPage() {
           <FeatureCardOne
             title="Our Services"
             description="From installations to emergency repairs, we have your comfort covered."
-            buttons={[{ text: "Get a Quote", href: "#contact" }]}
+            buttons={[{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }]}
             buttonAnimation="slide-up"
             features={[
               {
@@ -103,7 +155,7 @@ export default function HvacPage() {
               {
                 title: "Duct Cleaning",                description: "Professional duct cleaning to improve air quality and system efficiency throughout your property.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-8.jpg?_wi=1",                imageAlt: "Duct cleaning service"},
               {
-                title: "System Inspections",                description: "Thorough inspections with detailed reports and transparent recommendations — no hidden fees.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-9.jpg",                imageAlt: "HVAC system inspection"},
+                title: "System Inspections",                description: "Thorough inspections with detailed reports and transparent recommendations — no hidden fees.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-9.jpg",                imageAlt: "HVAC system inspection"}
             ]}
             gridVariant="uniform-all-items-equal"
             uniformGridCustomHeightClasses="aspect-square"
@@ -126,7 +178,8 @@ export default function HvacPage() {
               title: "Quality Workmanship",              description: "Our skilled technicians excel in various HVAC repairs, using only top-quality materials."},
             {
               icon: DollarSign,
-              title: "Fair & Transparent Pricing",              description: "No surprises here! We offer clear quotes and fair pricing for quality work."},
+              title: "Fair & Transparent Pricing",              description: "No surprises here! We offer clear quotes and fair pricing for quality work."
+            }
           ]}
           textboxLayout="default"
           animationType="slide-up"
@@ -144,7 +197,8 @@ export default function HvacPage() {
             {
               title: "Expert Repair or Install",              description: "We complete the work using premium parts and proven techniques — most jobs done same day.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-4.jpg?_wi=2",              imageAlt: "HVAC repair in progress"},
             {
-              title: "Quality Guarantee",              description: "We test everything before we leave and back all work with our satisfaction guarantee.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-8.jpg?_wi=2",              imageAlt: "Final quality check"},
+              title: "Quality Guarantee",              description: "We test everything before we leave and back all work with our satisfaction guarantee.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-8.jpg?_wi=2",              imageAlt: "Final quality check"
+            }
           ]}
           textboxLayout="default"
           useInvertedBackground={false}
@@ -162,7 +216,8 @@ export default function HvacPage() {
                 imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.jpg",                imageAlt: "Linda M."},
               {
                 id: "3",                name: "Carlos D.",                handle: "Homeowner, Houston TX",                testimonial: "Our furnace broke down on the coldest night of the year. AirPro had someone at our door within two hours. Fixed it on the spot. Can't thank them enough.",                rating: 5,
-                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.jpg",                imageAlt: "Carlos D."},
+                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.jpg",                imageAlt: "Carlos D."
+              }
             ]}
             showRating={true}
             animationType="slide-up"
@@ -173,7 +228,7 @@ export default function HvacPage() {
         <div id="faq" data-section="faq">
           <FaqSplitText
             sideTitle="Frequently Asked Questions"
-            buttons={[{ text: "Contact Us", href: "#contact" }]}
+            buttons={[{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }]}
             buttonAnimation="slide-up"
             faqsAnimation="slide-up"
             textPosition="left"
@@ -188,7 +243,8 @@ export default function HvacPage() {
               {
                 id: "4",                title: "Do you offer financing options?",                content: "Yes, we offer flexible financing plans for new installations and major repairs. Ask about our 0% interest options so you can stay comfortable without straining your budget."},
               {
-                id: "5",                title: "How long does a typical installation take?",                content: "Most residential HVAC installations are completed in one day. Larger commercial projects may take 2-3 days depending on the scope. We'll give you an accurate timeline during your consultation."},
+                id: "5",                title: "How long does a typical installation take?",                content: "Most residential HVAC installations are completed in one day. Larger commercial projects may take 2-3 days depending on the scope. We'll give you an accurate timeline during your consultation."
+              }
             ]}
           />
         </div>
@@ -200,7 +256,7 @@ export default function HvacPage() {
             title="Ready to Stay Comfortable Year-Round?"
             description="Whether you need a new installation, emergency repair, or routine maintenance — our team is ready to help. Call us today or request a free quote."
             buttons={[
-              { text: "Get a Free Quote", href: "#contact" },
+              { text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" },
               { text: "Call (512) 555-1234", href: "tel:5125551234" }
             ]}
             background={{ variant: "plain" }}
@@ -211,37 +267,13 @@ export default function HvacPage() {
         <div id="footer" data-section="footer">
           <FooterMedia
             logoText="AirPro HVAC"
-            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-10.jpg"
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-10.jpg?_wi=1"
             imageAlt="HVAC technician inspecting equipment"
-            columns={[
-              {
-                title: "Services",                items: [
-                  { label: "AC Installation", href: "#services" },
-                  { label: "Heating Systems", href: "#services" },
-                  { label: "Maintenance Plans", href: "#services" },
-                  { label: "Emergency Repairs", href: "#services" },
-                ],
-              },
-              {
-                title: "Company",                items: [
-                  { label: "About Us", href: "#about" },
-                  { label: "Testimonials", href: "#testimonials" },
-                  { label: "FAQ", href: "#faq" },
-                  { label: "Contact", href: "#contact" },
-                ],
-              },
-              {
-                title: "Contact",                items: [
-                  { label: "(512) 555-1234", href: "tel:5125551234" },
-                  { label: "info@airprohvac.com", href: "mailto:info@airprohvac.com" },
-                  { label: "123 Comfort St, Austin, TX 78701" }
-                ],
-              },
-            ]}
+            columns={globalFooterColumns}
             copyrightText="© 2026 | AirPro HVAC"
           />
         </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/products/[id]/page.tsx

@@ -0,0 +1,193 @@
+"use client";
+
+import React from "react";
+import { useParams } from "next/navigation";
+import Image from "next/image";
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+import ButtonTextShift from "@/components/button/ButtonTextShift/ButtonTextShift";
+
+const dummyProducts = [
+  {
+    id: "1",    name: "High-Efficiency AC Unit",    description: "This 2-ton, 18 SEER AC unit provides superior cooling efficiency and quiet operation for medium-sized homes, significantly reducing energy consumption.",    price: "$2,500",    variant: "2-Ton, 18 SEER",    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-4.jpg?w=800&h=600"
+  },
+  {
+    id: "2",    name: "Smart Thermostat",    description: "Control your home's climate from anywhere with this Wi-Fi enabled smart thermostat. Features include energy usage reports, learning capabilities, and voice control compatibility.",    price: "$199",    variant: "Wi-Fi Enabled",    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-9.jpg?w=800&h=600"
+  },
+  {
+    id: "3",    name: "Air Purifier",    description: "Improve indoor air quality with this advanced air purifier. Equipped with a true HEPA filter, it captures 99.97% of airborne particles, including dust, pollen, pet dander, and smoke.",    price: "$350",    variant: "HEPA Filter",    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-8.jpg?w=800&h=600"
+  },
+  {
+    id: "4",    name: "Furnace System",    description: "A robust furnace system designed for reliable heating performance in colder climates. This 90,000 BTU unit ensures even heat distribution and energy efficiency throughout your home.",    price: "$1,800",    variant: "90,000 BTU",    imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-5.jpg?w=800&h=600"
+  }
+];
+
+export default function ProductDetailPage() {
+  const params = useParams();
+  const { id } = params;
+  const product = dummyProducts.find((p) => p.id === id);
+
+  if (!product) {
+    return (
+      <ThemeProvider
+        defaultButtonVariant="directional-hover"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="soft"
+        contentWidth="medium"
+        sizing="medium"
+        background="aurora"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
+      >
+        <ReactLenis root>
+          <NavbarLayoutFloatingInline
+            brandName="AirPro HVAC"
+            navItems={[
+              { name: "Products", id: "/products" },
+              { name: "Cart", id: "/cart" },
+              { name: "Checkout", id: "/checkout" },
+              { name: "Services", id: "#services" },
+              { name: "About", id: "#about" },
+              { name: "Testimonials", id: "#testimonials" },
+              { name: "Contact", id: "#contact" }
+            ]}
+            button={{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }}
+            animateOnLoad={false}
+          />
+          <div className="container mx-auto py-16 text-center">
+            <h1 className="text-3xl font-bold mb-4">Product Not Found</h1>
+            <p>The product you are looking for does not exist.</p>
+          </div>
+          <FooterMedia
+            logoText="AirPro HVAC"
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-10.jpg?_wi=2"
+            imageAlt="HVAC technician inspecting equipment"
+            columns={[
+              {
+                title: "Services",                items: [
+                  { label: "AC Installation", href: "#services" },
+                  { label: "Heating Systems", href: "#services" },
+                  { label: "Maintenance Plans", href: "#services" },
+                  { label: "Emergency Repairs", href: "#services" }
+                ]
+              },
+              {
+                title: "Company",                items: [
+                  { label: "About Us", href: "#about" },
+                  { label: "Testimonials", href: "#testimonials" },
+                  { label: "FAQ", href: "#faq" },
+                  { label: "Contact", href: "#contact" }
+                ]
+              },
+              {
+                title: "Contact",                items: [
+                  { label: "(512) 555-1234", href: "tel:5125551234" },
+                  { label: "info@airprohvac.com", href: "mailto:info@airprohvac.com" },
+                  { label: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" },
+                  { label: "123 Comfort St, Austin, TX 78701" }
+                ]
+              }
+            ]}
+            copyrightText="© 2026 | AirPro HVAC"
+          />
+        </ReactLenis>
+      </ThemeProvider>
+    );
+  }
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="directional-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="soft"
+      contentWidth="medium"
+      sizing="medium"
+      background="aurora"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            brandName="AirPro HVAC"
+            navItems={[
+              { name: "Products", id: "/products" },
+              { name: "Cart", id: "/cart" },
+              { name: "Checkout", id: "/checkout" },
+              { name: "Services", id: "#services" },
+              { name: "About", id: "#about" },
+              { name: "Testimonials", id: "#testimonials" },
+              { name: "Contact", id: "#contact" }
+            ]}
+            button={{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }}
+            animateOnLoad={false}
+          />
+        </div>
+
+        <div className="container mx-auto py-16 px-4">
+          <div className="grid md:grid-cols-2 gap-8 items-center">
+            <div className="relative h-96 w-full rounded-lg overflow-hidden">
+              <Image
+                src={product.imageSrc}
+                alt={product.name}
+                layout="fill"
+                objectFit="cover"
+                className="rounded-lg"
+              />
+            </div>
+            <div className="flex flex-col gap-4">
+              <h1 className="text-4xl font-bold">{product.name}</h1>
+              <p className="text-2xl font-semibold text-primary-cta">{product.price}</p>
+              <p className="text-lg text-foreground/80">{product.description}</p>
+              {product.variant && (
+                <p className="text-base text-foreground/60">Variant: {product.variant}</p>
+              )}
+              <ButtonTextShift text="Add to Cart" onClick={() => alert(`${product.name} added to cart!`)} className="w-fit mt-4" />
+            </div>
+          </div>
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterMedia
+            logoText="AirPro HVAC"
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-10.jpg?_wi=3"
+            imageAlt="HVAC technician inspecting equipment"
+            columns={[
+              {
+                title: "Services",                items: [
+                  { label: "AC Installation", href: "#services" },
+                  { label: "Heating Systems", href: "#services" },
+                  { label: "Maintenance Plans", href: "#services" },
+                  { label: "Emergency Repairs", href: "#services" }
+                ]
+              },
+              {
+                title: "Company",                items: [
+                  { label: "About Us", href: "#about" },
+                  { label: "Testimonials", href: "#testimonials" },
+                  { label: "FAQ", href: "#faq" },
+                  { label: "Contact", href: "#contact" }
+                ]
+              },
+              {
+                title: "Contact",                items: [
+                  { label: "(512) 555-1234", href: "tel:5125551234" },
+                  { label: "info@airprohvac.com", href: "mailto:info@airprohvac.com" },
+                  { label: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" },
+                  { label: "123 Comfort St, Austin, TX 78701" }
+                ]
+              }
+            ]}
+            copyrightText="© 2026 | AirPro HVAC"
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/products/page.tsx

@@ -0,0 +1,102 @@
+"use client";
+
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import ProductCardFour from "@/components/sections/product/ProductCardFour";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+
+export default function ProductsPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="directional-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="soft"
+      contentWidth="medium"
+      sizing="medium"
+      background="aurora"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            brandName="AirPro HVAC"
+            navItems={[
+              { name: "Products", id: "/products" },
+              { name: "Cart", id: "/cart" },
+              { name: "Checkout", id: "/checkout" },
+              { name: "Services", id: "#services" },
+              { name: "About", id: "#about" },
+              { name: "Testimonials", id: "#testimonials" },
+              { name: "Contact", id: "#contact" }
+            ]}
+            button={{ text: "Get a Quote", href: "#contact" }}
+            animateOnLoad={false}
+          />
+        </div>
+
+        <div className="min-h-screen py-16">
+          <ProductCardFour
+            title="Our Products"
+            description="Discover our range of high-quality HVAC products."
+            products={[
+              {
+                id: "1",                name: "High-Efficiency AC Unit",                price: "$2,500",                variant: "2-Ton, 18 SEER",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-4.jpg?_wi=1",                onProductClick: () => window.location.href = "/products/1"
+              },
+              {
+                id: "2",                name: "Smart Thermostat",                price: "$199",                variant: "Wi-Fi Enabled",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-9.jpg?_wi=1",                onProductClick: () => window.location.href = "/products/2"
+              },
+              {
+                id: "3",                name: "Air Purifier",                price: "$350",                variant: "HEPA Filter",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-8.jpg?_wi=1",                onProductClick: () => window.location.href = "/products/3"
+              },
+              {
+                id: "4",                name: "Furnace System",                price: "$1,800",                variant: "90,000 BTU",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-5.jpg?_wi=1",                onProductClick: () => window.location.href = "/products/4"
+              }
+            ]}
+            gridVariant="three-columns-all-equal-width"
+            animationType="slide-up"
+            useInvertedBackground={false}
+            textboxLayout="default"
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterMedia
+            logoText="AirPro HVAC"
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-10.jpg"
+            imageAlt="HVAC technician inspecting equipment"
+            columns={[
+              {
+                title: "Services",                items: [
+                  { label: "AC Installation", href: "#services" },
+                  { label: "Heating Systems", href: "#services" },
+                  { label: "Maintenance Plans", href: "#services" },
+                  { label: "Emergency Repairs", href: "#services" }
+                ]
+              },
+              {
+                title: "Company",                items: [
+                  { label: "About Us", href: "#about" },
+                  { label: "Testimonials", href: "#testimonials" },
+                  { label: "FAQ", href: "#faq" },
+                  { label: "Contact", href: "#contact" }
+                ]
+              },
+              {
+                title: "Contact",                items: [
+                  { label: "(512) 555-1234", href: "tel:5125551234" },
+                  { label: "info@airprohvac.com", href: "mailto:info@airprohvac.com" },
+                  { label: "123 Comfort St, Austin, TX 78701" }
+                ]
+              }
+            ]}
+            copyrightText="© 2026 | AirPro HVAC"
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}