Merge version_3 into main

Merge version_3 into main

src/app/page.tsx

@@ -2,18 +2,12 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import { Zap, Shield, TrendingUp, Cloud } from 'lucide-react';
-import ContactCenter from '@/components/sections/contact/ContactCenter';
-import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
-import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
-import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
-import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
-import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
-import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
-import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
-import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
+import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
+import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';
 
 export default function LandingPage() {
   return (
@@ -31,216 +25,86 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarStyleCentered
+      <NavbarStyleApple
       navItems={[
-        {
-          name: "Home",          id: "hero"},
-        {
-          name: "About",          id: "about"},
-        {
-          name: "Pricing",          id: "pricing"},
-        {
-          name: "Testimonials",          id: "testimonials"},
-        {
-          name: "Contact",          id: "contact"},
+        { name: "Home", id: "hero" },
+        { name: "Solutions", id: "products" },
+        { name: "Plans", id: "pricing" },
+        { name: "Contact", id: "contact" },
       ]}
-      brandName="GrowthAccelerate"
+      brandName="PayScaleSystem"
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroBillboardRotatedCarousel
+      <HeroLogoBillboard
       background={{
-        variant: "plain"}}
-      title="Scale Your Revenue to $10k+ Weekly"
-      description="Unlock high-growth systems tailored to scale your operations and drive predictable revenue effortlessly."
+        variant: "sparkles-gradient"}}
+      logoText="Monetize Your Software"
+      description="Leverage our robust payment integration infrastructure to start charging $100+ for your application usage instantly."
       buttons={[
-        {
-          text: "Get Started",          href: "#contact"},
-      ]}
-      carouselItems={[
-        {
-          id: "h1",          imageSrc: "http://img.b2bpic.net/free-photo/empty-business-workplace-equipped-with-modern-tech-tools-serve-enterprise_482257-125151.jpg?_wi=1",          imageAlt: "Dashboard View"},
-        {
-          id: "h2",          imageSrc: "http://img.b2bpic.net/free-photo/dynamic-data-visualization-3d_23-2151904311.jpg?_wi=1",          imageAlt: "Metrics View"},
-        {
-          id: "h3",          imageSrc: "http://img.b2bpic.net/free-photo/solar-panels-plant-engineer-uses-pc-oversee-systems_482257-126156.jpg",          imageAlt: "Network View"},
-        {
-          id: "h4",          imageSrc: "http://img.b2bpic.net/free-photo/jolly-it-expert-doing-maintenance-server-room-infrastructure_482257-124598.jpg",          imageAlt: "Server View"},
-        {
-          id: "h5",          imageSrc: "http://img.b2bpic.net/free-photo/futurism-perspective-digital-nomads-lifestyle_23-2151252440.jpg",          imageAlt: "Code View"},
-        {
-          id: "h6",          imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-desktop-with-laptop-headphones_23-2148430894.jpg",          imageAlt: "Workspace View"},
+        { text: "View Solutions", href: "#products" },
+        { text: "Start Monetizing", href: "#pricing" }
       ]}
+      mediaAnimation="blur-reveal"
     />
   </div>
 
-  <div id="about" data-section="about">
-      <TextSplitAbout
-      useInvertedBackground={false}
-      title="Built for Results"
-      description={[
-        "We transform traditional business operations into high-performance revenue engines.",        "Our proven frameworks have helped dozens of companies break the $10k/week ceiling within months of implementation."]}
-    />
-  </div>
-
-  <div id="features" data-section="features">
-      <FeatureCardTwentySix
-      textboxLayout="default"
-      useInvertedBackground={false}
-      features={[
-        {
-          title: "Automated Leads",          description: "Generate high-quality leads consistently.",          buttonIcon: Zap,
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-computer-website-loading-speed-test_107791-17929.jpg"},
-        {
-          title: "Secure Systems",          description: "Enterprise-grade security for your data.",          buttonIcon: Shield,
-          imageSrc: "http://img.b2bpic.net/free-photo/cyber-security-concept-digital-art_23-2151637777.jpg"},
-        {
-          title: "Revenue Growth",          description: "Optimized sales funnels for high ROI.",          buttonIcon: TrendingUp,
-          imageSrc: "http://img.b2bpic.net/free-photo/paperwork-report-graphs-market-business_1232-3838.jpg"},
-        {
-          title: "Cloud Scale",          description: "Infinitely scalable infrastructure.",          buttonIcon: Cloud,
-          imageSrc: "http://img.b2bpic.net/free-photo/view-futuristic-high-tech-earth_23-2151100377.jpg"},
+  <div id="products" data-section="products">
+      <ProductCatalog
+      layout="section"
+      products={[
+        { id: "s1", name: "Basic Access Tier", price: "$100", rating: 4.8, imageSrc: "http://img.b2bpic.net/free-photo/dynamic-data-visualization-3d_23-2151904311.jpg?_wi=1" },
+        { id: "s2", name: "Professional Suite", price: "$250", rating: 4.9, imageSrc: "http://img.b2bpic.net/free-photo/empty-business-workplace-equipped-with-modern-tech-tools-serve-enterprise_482257-125151.jpg?_wi=1" },
+        { id: "s3", name: "Enterprise Module", price: "$500", rating: 5.0, imageSrc: "http://img.b2bpic.net/free-photo/futurism-perspective-digital-nomads-lifestyle_23-2151252440.jpg?_wi=1" }
       ]}
-      title="Core Accelerators"
-      description="Powerful capabilities to streamline your growth."
     />
   </div>
 
   <div id="pricing" data-section="pricing">
-      <PricingCardNine
+      <PricingCardFive
       animationType="slide-up"
       textboxLayout="default"
       useInvertedBackground={false}
       plans={[
         {
-          id: "p1",          title: "Accelerator",          price: "$2,999",          period: "/mo",          features: [
-            "1-on-1 Strategy",            "Funnel Automation",            "Support"],
-          button: {
-            text: "Select",            href: "#contact"},
-          imageSrc: "http://img.b2bpic.net/free-photo/group-graphics-designers-using-digital-tablet_1170-989.jpg",          imageAlt: "teamwork digital office"},
+          id: "p1", tag: "Starter", price: "$100", period: "/mo", 
+          description: "Entry level access to premium features.",          featuresTitle: "Core Benefits",          features: [ "Payment API Access", "Standard Support", "1 User Seat" ],
+          button: { text: "Buy Now" }
+        },
         {
-          id: "p2",          title: "Growth Engine",          price: "$5,999",          period: "/mo",          features: [
-            "Everything in Accelerator",            "Custom Automation",            "Priority"],
-          button: {
-            text: "Select",            href: "#contact"},
-          imageSrc: "http://img.b2bpic.net/free-photo/empty-business-workplace-equipped-with-modern-tech-tools-serve-enterprise_482257-125151.jpg?_wi=2",          imageAlt: "teamwork digital office"},
-        {
-          id: "p3",          title: "Enterprise Elite",          price: "$10,999",          period: "/mo",          features: [
-            "Everything in Growth",            "Full Dedicated Team",            "24/7 Support"],
-          button: {
-            text: "Select",            href: "#contact"},
-          imageSrc: "http://img.b2bpic.net/free-photo/dynamic-data-visualization-3d_23-2151904311.jpg?_wi=2",          imageAlt: "teamwork digital office"},
+          id: "p2", tag: "Growth", price: "$499", period: "/mo", 
+          description: "Perfect for scaling operations.",          featuresTitle: "Everything in Starter, plus:",          features: [ "Advanced Analytics", "Custom Webhooks", "5 User Seats" ],
+          button: { text: "Buy Now" }
+        }
       ]}
-      title="Transparent Growth Plans"
-      description="Choose the accelerator that fits your current stage."
-    />
-  </div>
-
-  <div id="socialProof" data-section="socialProof">
-      <SocialProofOne
-      textboxLayout="default"
-      useInvertedBackground={false}
-      names={[
-        "TechCorp",        "InnovateLabs",        "GrowthGen",        "DataScale",        "CloudSys",        "SecureTech",        "PrimeDigital"]}
-      title="Trusted by Leaders"
-      description="Industry innovators partner with us to drive scale."
-    />
-  </div>
-
-  <div id="metrics" data-section="metrics">
-      <MetricCardFourteen
-      useInvertedBackground={false}
-      title="Proven Impact"
-      tag="Performance"
-      metrics={[
-        {
-          id: "m1",          value: "$10M+",          description: "Revenue Generated"},
-        {
-          id: "m2",          value: "500+",          description: "Systems Optimized"},
-        {
-          id: "m3",          value: "120+",          description: "Happy Partners"},
-      ]}
-      metricsAnimation="slide-up"
-    />
-  </div>
-
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardSixteen
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      testimonials={[
-        {
-          id: "t1",          name: "John Doe",          role: "CEO",          company: "TechCorp",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg"},
-        {
-          id: "t2",          name: "Jane Smith",          role: "CTO",          company: "GrowthGen",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/aspirated-confident-businesswoman-looking-forward_1262-5277.jpg"},
-        {
-          id: "t3",          name: "Mike Brown",          role: "Founder",          company: "DataScale",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/man-woman-talking-urban-city-center-discussing-taking-pictures-project-digital-photo-camera_285396-9860.jpg"},
-        {
-          id: "t4",          name: "Emily White",          role: "CMO",          company: "CloudSys",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-working-business-with-computer_482257-20185.jpg"},
-        {
-          id: "t5",          name: "Chris Green",          role: "VP",          company: "SecureTech",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-male-personal-shopper-working_23-2148924139.jpg"},
-      ]}
-      kpiItems={[
-        {
-          value: "100%",          label: "Client Success"},
-        {
-          value: "24/7",          label: "Dedicated Support"},
-        {
-          value: "3x",          label: "Revenue Growth"},
-      ]}
-      title="Partner Voices"
-      description="Real results from real partners."
-    />
-  </div>
-
-  <div id="faq" data-section="faq">
-      <FaqSplitMedia
-      textboxLayout="default"
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "f1",          title: "How soon can I see results?",          content: "Our systems are designed for rapid impact, typically within 14 days."},
-        {
-          id: "f2",          title: "Is this for my industry?",          content: "We specialize in scaling digital-focused B2B and service companies."},
-        {
-          id: "f3",          title: "Can I cancel anytime?",          content: "Yes, our plans are flexible without long-term lock-ins."},
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/woman-working-home-kitchen-quarantine-with-laptop_23-2148740928.jpg"
-      title="Common Questions"
-      description="Clear answers to your concerns."
-      faqsAnimation="slide-up"
+      title="Flexible Subscription Plans"
+      description="Pick the right plan to start earning $100+ per user."
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactCenter
-      useInvertedBackground={false}
-      background={{
-        variant: "plain"}}
+      <ContactSplit
       tag="Get Started"
-      title="Ready to scale?"
-      description="Join the elite cohort hitting $10k/week."
-      buttonText="Apply Now"
+      title="Deploy Your Paywall"
+      description="Our team will help you integrate billing systems within 24 hours. Connect today."
+      background={{ variant: "gradient-bars" }}
+      useInvertedBackground={false}
+      buttonText="Request Integration"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterLogoReveal
-      logoText="GrowthAccelerate"
-      leftLink={{
-        text: "Privacy Policy",        href: "#"}}
-      rightLink={{
-        text: "Terms of Service",        href: "#"}}
+      <FooterMedia
+      logoText="PayScaleSystem"
+      imageSrc="http://img.b2bpic.net/free-photo/flat-lay-desktop-with-laptop-headphones_23-2148430894.jpg"
+      columns={[
+        { title: "Platform", items: [{ label: "Security", href: "#" }, { label: "Terms", href: "#" }] },
+        { title: "Support", items: [{ label: "Docs", href: "#" }, { label: "Email", href: "#" }] }
+      ]}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}