From 8312d2c7707210c4f08b5978d923c50c608d7548 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Tue, 12 May 2026 23:33:59 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 377 +++++++----------------------------------------
 1 file changed, 56 insertions(+), 321 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index f0b2273..aebc9aa 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,16 +2,16 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactText from '@/components/sections/contact/ContactText';
-import FaqDouble from '@/components/sections/faq/FaqDouble';
-import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
-import FooterBase from '@/components/sections/footer/FooterBase';
-import HeroCentered from '@/components/sections/hero/HeroCentered';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
+import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
-import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
+import ProductCardThree from '@/components/ecommerce/productCatalog/ProductCatalog';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
-import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
-import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
+import MediaAbout from '@/components/sections/about/MediaAbout';
+import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
 import { Shield } from "lucide-react";
 
 export default function LandingPage() {
@@ -32,372 +32,107 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleApple
       navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Services",
-          id: "features",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
+        { name: "Home", id: "hero" },
+        { name: "About", id: "about" },
+        { name: "Services", id: "features" },
+        { name: "Contact", id: "contact" },
       ]}
       brandName="Roofing Near Me"
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroCentered
-      background={{
-        variant: "gradient-bars",
-      }}
+      <HeroBillboardCarousel
+      background={{ variant: "gradient-bars" }}
       title="Roofing Experts You Can Trust"
-      description="Providing top-tier roofing installation, repair, and maintenance services for your home. Quality work, every time."
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/portrait-young-business-woman-talking-phone-while-standing-outside-office-buildings-business-success-concept_58466-12283.jpg",
-          alt: "Client",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/enjoying-morning-sun-before-start-work_329181-11779.jpg",
-          alt: "Client",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/specialist-grinds-tile-before-fixing-it-wall-builder-decorates-walls-apartment-finishing-building-with-modern-materials_166373-2086.jpg",
-          alt: "Client",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/young-male-model-posing-outdoor_23-2148289284.jpg",
-          alt: "Client",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/exterior-home_1203-2241.jpg",
-          alt: "Client",
-        },
-      ]}
-      buttons={[
-        {
-          text: "Get Free Estimate",
-          href: "#contact",
-        },
-      ]}
-      marqueeItems={[
-        {
-          type: "text",
-          text: "Licensed & Insured",
-        },
-        {
-          type: "text",
-          text: "24/7 Emergency Service",
-        },
-        {
-          type: "text",
-          text: "Lifetime Warranty",
-        },
-        {
-          type: "text",
-          text: "Top Rated Local Pro",
-        },
-        {
-          type: "text",
-          text: "Free Consultations",
-        },
+      description="Professional-grade roofing installation and repair services."
+      mediaItems={[
+        { imageSrc: "http://img.b2bpic.net/free-photo/exterior-home_1203-2241.jpg", imageAlt: "Roofing project" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-doing-his-job-with-belt_23-2149343658.jpg", imageAlt: "Roofing professional" }
       ]}
+      buttons={[{ text: "Get Free Estimate", href: "#contact" }]}
     />
   </div>
 
   <div id="about" data-section="about">
-      <TestimonialAboutCard
-      useInvertedBackground={false}
+      <MediaAbout
       tag="About Us"
       title="Decades of Roofing Excellence"
-      description="We specialize in residential roofing, offering durable solutions tailored to your home's unique needs."
-      subdescription="Our team uses premium materials and certified installation processes for long-lasting protection."
-      icon={Shield}
-      imageSrc="http://img.b2bpic.net/free-photo/construction-worker-doing-his-job-with-belt_23-2149343658.jpg?_wi=1"
-      mediaAnimation="slide-up"
+      description="We provide premium residential roofing solutions with unmatched quality and service."
+      imageSrc="http://img.b2bpic.net/free-photo/construction-worker-doing-his-job-with-belt_23-2149343658.jpg"
+      useInvertedBackground={false}
     />
   </div>
 
   <div id="features" data-section="features">
-      <FeatureCardTwentyNine
+      <FeatureCardTwelve
       animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={false}
-      features={[
-        {
-          title: "New Installation",
-          description: "High-quality shingle and metal roof installations.",
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-geometric-abstract-twist-background_1048-17020.jpg?_wi=1",
-          titleImageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13116.jpg",
-          buttonText: "Read More",
-        },
-        {
-          title: "Emergency Repairs",
-          description: "Quick, reliable response for storm damage and leaks.",
-          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-sitting-roof_23-2149343640.jpg?_wi=1",
-          titleImageSrc: "http://img.b2bpic.net/free-photo/mechanic-filling-out-insurance-contract_482257-85122.jpg",
-          buttonText: "Read More",
-        },
-        {
-          title: "Roof Inspections",
-          description: "Thorough maintenance checks for peace of mind.",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-walking-roof_1321-1041.jpg?_wi=1",
-          titleImageSrc: "http://img.b2bpic.net/free-photo/full-shot-roofer-working-with-helmet_23-2149343710.jpg",
-          buttonText: "Read More",
-        },
-      ]}
+      textboxLayout="split"
       title="Our Professional Services"
-      description="From complete roof replacements to minor repairs, we have you covered."
+      description="Comprehensive maintenance and installation packages."
+      features={[
+        { id: "f1", label: "Installation", title: "New Roofs", items: ["Asphalt Shingles", "Metal Roofing", "Slate Tile"], buttons: [{ text: "View Details" }] },
+        { id: "f2", label: "Maintenance", title: "Reliable Repairs", items: ["Emergency Leak Fix", "Storm Damage Repair", "Full Inspections"], buttons: [{ text: "Learn More" }] }
+      ]}
     />
   </div>
 
   <div id="process" data-section="process">
-      <ProductCardTwo
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={false}
+      <ProductCardThree
+      layout="section"
+      title="Roofing Catalog"
+      description="Browse our most popular roofing materials."
       products={[
-        {
-          id: "p1",
-          brand: "ProRoof",
-          name: "Asphalt Shingles",
-          price: "From $5,000",
-          rating: 5,
-          reviewCount: "120",
-          imageSrc: "http://img.b2bpic.net/free-photo/white-tiled-building-blue-sky_181624-6378.jpg",
-        },
-        {
-          id: "p2",
-          brand: "MetalMax",
-          name: "Standing Seam Metal",
-          price: "From $12,000",
-          rating: 5,
-          reviewCount: "85",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-into-solid-fuel-boiler-working-with-biofuels-economical-heating-top-view_169016-14806.jpg",
-        },
-        {
-          id: "p3",
-          brand: "EcoTile",
-          name: "Slate Tile Roofing",
-          price: "From $20,000",
-          rating: 5,
-          reviewCount: "45",
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-with-helmet_23-2149343651.jpg",
-        },
-        {
-          id: "p4",
-          brand: "Composite",
-          name: "Eco-Friendly Shingles",
-          price: "From $7,000",
-          rating: 5,
-          reviewCount: "60",
-          imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-using-hammer-job-site_23-2150530685.jpg",
-        },
-        {
-          id: "p5",
-          brand: "ProRoof",
-          name: "Architectural Shingles",
-          price: "From $6,500",
-          rating: 5,
-          reviewCount: "95",
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-geometric-weave-abstract-wallpaper-background_1048-9944.jpg",
-        },
-        {
-          id: "p6",
-          brand: "MetalMax",
-          name: "Corrugated Metal",
-          price: "From $9,000",
-          rating: 5,
-          reviewCount: "70",
-          imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-blue-lines-perfect-using-as-background_181624-15180.jpg",
-        },
+        { id: "p1", name: "Asphalt Shingles", price: "$5,000+", imageSrc: "http://img.b2bpic.net/free-photo/white-tiled-building-blue-sky_181624-6378.jpg" },
+        { id: "p2", name: "Metal Roofing", price: "$12,000+", imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-into-solid-fuel-boiler-working-with-biofuels-economical-heating-top-view_169016-14806.jpg" }
       ]}
-      title="Our Roofing Solutions"
-      description="We offer a variety of roofing materials tailored to your climate and aesthetic preferences."
     />
   </div>
 
   <div id="testimonials" data-section="testimonials">
-      <TestimonialCardFive
-      textboxLayout="default"
-      useInvertedBackground={false}
+      <TestimonialCardThirteen
+      showRating={true}
+      animationType="slide-up"
+      textboxLayout="split"
+      title="What Clients Say"
       testimonials={[
-        {
-          id: "t1",
-          name: "Mark R.",
-          date: "Jan 2024",
-          title: "Great Service!",
-          quote: "The roofing team was professional and fast. Highly recommended.",
-          tag: "Repair",
-          avatarSrc: "http://img.b2bpic.net/free-photo/blissful-tanned-woman-pajama-waving-hand-with-smile-amazing-caucasian-female-model-standing-balcony_197531-20975.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/old-house-with-tiled-roof_169016-29073.jpg",
-          imageAlt: "happy homeowner looking at new roof",
-        },
-        {
-          id: "t2",
-          name: "Elena M.",
-          date: "Dec 2023",
-          title: "Excellent Job",
-          quote: "Beautiful roof installation, done exactly as promised.",
-          tag: "New Roof",
-          avatarSrc: "http://img.b2bpic.net/free-photo/happy-woman-background-new-house-portrait-first-time-buyer-house-owner-apartment-renter-flat-tenant-landlady-moving-day-buying-own-property-concept_493343-29871.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-doing-his-job-with-belt_23-2149343658.jpg?_wi=2",
-          imageAlt: "happy homeowner looking at new roof",
-        },
-        {
-          id: "t3",
-          name: "John D.",
-          date: "Nov 2023",
-          title: "Expert Team",
-          quote: "Very thorough inspection and detailed repair process.",
-          tag: "Inspection",
-          avatarSrc: "http://img.b2bpic.net/free-photo/country-music-band-singing-outdoors_23-2149498460.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-geometric-abstract-twist-background_1048-17020.jpg?_wi=2",
-          imageAlt: "happy homeowner looking at new roof",
-        },
-        {
-          id: "t4",
-          name: "Sara W.",
-          date: "Oct 2023",
-          title: "Responsive",
-          quote: "Quickest response to our leak emergency.",
-          tag: "Emergency",
-          avatarSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13336.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-sitting-roof_23-2149343640.jpg?_wi=2",
-          imageAlt: "happy homeowner looking at new roof",
-        },
-        {
-          id: "t5",
-          name: "Tom K.",
-          date: "Sep 2023",
-          title: "Professional",
-          quote: "Clear pricing and perfect project completion.",
-          tag: "Full Replace",
-          avatarSrc: "http://img.b2bpic.net/free-photo/construction-people-working-roof_23-2149343666.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-walking-roof_1321-1041.jpg?_wi=2",
-          imageAlt: "happy homeowner looking at new roof",
-        },
+        { id: "t1", name: "Mark R.", handle: "@markr", testimonial: "The roofing team was professional and fast!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/blissful-tanned-woman-pajama-waving-hand-with-smile-amazing-caucasian-female-model-standing-balcony_197531-20975.jpg" }
       ]}
-      title="What Homeowners Say"
-      description="Our satisfied clients trust us for their most important asset."
     />
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqDouble
-      textboxLayout="default"
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "q1",
-          title: "How long does a roof last?",
-          content: "Most asphalt shingle roofs last between 20 to 30 years.",
-        },
-        {
-          id: "q2",
-          title: "How do I know I need a new roof?",
-          content: "Look for cracked shingles, leaks, or granule loss.",
-        },
-        {
-          id: "q3",
-          title: "Do you provide estimates?",
-          content: "Yes, we offer free, detailed roofing estimates.",
-        },
-      ]}
-      title="Frequently Asked Questions"
-      description="Common questions about our roofing processes."
+      <FaqSplitMedia
+      faqs={[{ id: "q1", title: "How long does a roof last?", content: "Typically 20-30 years." }]}
+      title="FAQs"
       faqsAnimation="slide-up"
+      textboxLayout="split"
+      imageSrc="http://img.b2bpic.net/free-photo/construction-people-working-roof_23-2149343666.jpg"
     />
   </div>
 
   <div id="social" data-section="social">
       <SocialProofOne
-      textboxLayout="default"
-      useInvertedBackground={false}
-      names={[
-        "Roofing Masters",
-        "Build Pro",
-        "Shield Roofing",
-        "Safe Roof",
-        "Pro Installers",
-        "Elite Roofing",
-        "Top Repair",
-      ]}
+      names={["Roofing Masters", "Build Pro", "Shield Roofing"]}
       title="Industry Partners"
-      description="Proudly working with industry-leading brands."
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactText
-      useInvertedBackground={false}
-      background={{
-        variant: "rotated-rays-static",
-      }}
-      text="Ready to get started? Contact us today for a free inspection or estimate."
-      buttons={[
-        {
-          text: "Contact Us Now",
-          href: "mailto:info@roofing.com",
-        },
+      <ContactSplitForm
+      title="Get Your Estimate"
+      description="Our team is ready to inspect your property."
+      inputs={[
+        { name: "name", type: "text", placeholder: "Full Name", required: true },
+        { name: "email", type: "email", placeholder: "Email Address", required: true }
       ]}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBase
-      columns={[
-        {
-          title: "Company",
-          items: [
-            {
-              label: "About",
-              href: "#about",
-            },
-            {
-              label: "Contact",
-              href: "#contact",
-            },
-          ],
-        },
-        {
-          title: "Services",
-          items: [
-            {
-              label: "Installation",
-              href: "#features",
-            },
-            {
-              label: "Repair",
-              href: "#features",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Privacy",
-              href: "#",
-            },
-            {
-              label: "Terms",
-              href: "#",
-            },
-          ],
-        },
-      ]}
+      <FooterBaseReveal
       logoText="Roofing Near Me"
+      columns={[{ title: "Links", items: [{ label: "Home", href: "#" }] }]}
     />
   </div>
       </ReactLenis>
-- 
2.49.1