Update src/app/payment/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -42,7 +42,7 @@ export default function LandingPage() {
       ]}
       brandName="Place2Page"
       button={{
-        text: "Get Started",        href: "#contact"}}
+        text: "Get Started",        href: "/payment"}}
     />
   </div>
 
@@ -52,21 +52,15 @@ export default function LandingPage() {
       description="Turn your Google Maps listing into a professional, SEO-optimized website instantly—no coding, no designers, no headaches. Let AI do the heavy lifting while you focus on your business."
       buttons={[
         {
-          text: "Start Free for 30 Days",          href: "#contact"},
+          text: "Start Free for 30 Days",          href: "/payment"},
       ]}
       slides={[
-        {
+        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205391570-f4e98867.png?_wi=1", imageAlt: "Dashboard preview" },
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205391570-f4e98867.png?_wi=1",          imageAlt: "Dashboard preview"},
+        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205432290-afecacb1.png", imageAlt: "Dashboard preview" },
-        {
+        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205441049-5b0dee05.png", imageAlt: "Dashboard preview" },
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205432290-afecacb1.png",          imageAlt: "Dashboard preview"},
+        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205450561-4a357aa8.png", imageAlt: "Dashboard preview" },
-        {
+        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205459007-6f781846.png", imageAlt: "Dashboard preview" },
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205441049-5b0dee05.png",          imageAlt: "Dashboard preview"},
+        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205467883-d5259473.png", imageAlt: "Dashboard preview" },
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205450561-4a357aa8.png",          imageAlt: "Dashboard preview"},
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205459007-6f781846.png",          imageAlt: "Dashboard preview"},
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205467883-d5259473.png",          imageAlt: "Dashboard preview"},
       ]}
     />
   </div>
@@ -79,32 +73,23 @@ export default function LandingPage() {
       features={[
         {
           title: "Copy Maps Link",          description: "Grab your existing business URL from Google Maps.",          bentoComponent: "media-stack",          items: [
-            {
+            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-a-user-copying-a-1778205398915-b342abda.png?_wi=1", imageAlt: "Step 1" },
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-a-user-copying-a-1778205398915-b342abda.png?_wi=1",              imageAlt: "Step 1"},
+            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-a-user-copying-a-1778205477429-83e8a8c4.png", imageAlt: "Step 1" },
-            {
+            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-a-user-copying-a-1778205486261-92cf6a54.png", imageAlt: "Step 1" },
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-a-user-copying-a-1778205477429-83e8a8c4.png",              imageAlt: "Step 1"},
-            {
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-a-user-copying-a-1778205486261-92cf6a54.png",              imageAlt: "Step 1"},
           ]
         },
         {
           title: "AI Magic",          description: "Paste it into Place2Page and watch our AI build your site.",          bentoComponent: "media-stack",          items: [
-            {
+            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-ai-processing-th-1778205407339-e99e664f.png?_wi=1", imageAlt: "Step 2" },
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-ai-processing-th-1778205407339-e99e664f.png?_wi=1",              imageAlt: "Step 2"},
+            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-ai-processing-th-1778205495442-cd89e88d.png", imageAlt: "Step 2" },
-            {
+            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-ai-processing-th-1778205505462-e7d84244.png", imageAlt: "Step 2" },
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-ai-processing-th-1778205495442-cd89e88d.png",              imageAlt: "Step 2"},
-            {
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-ai-processing-th-1778205505462-e7d84244.png",              imageAlt: "Step 2"},
           ]
         },
         {
           title: "Go Live",          description: "Publish your professional, SEO-ready website instantly.",          bentoComponent: "media-stack",          items: [
-            {
+            { imageSrc: "http://img.b2bpic.net/free-photo/female-white-suit-sitting-table-with-her-laptop-near-green-bushes_181624-23858.jpg", imageAlt: "Step 3" },
-              imageSrc: "http://img.b2bpic.net/free-photo/female-white-suit-sitting-table-with-her-laptop-near-green-bushes_181624-23858.jpg",              imageAlt: "Step 3"},
+            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-of-a-beautiful-live-webs-1778205515348-feecac2b.png", imageAlt: "Step 3" },
-            {
+            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-of-a-beautiful-live-webs-1778205523861-0547b204.png", imageAlt: "Step 3" },
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-of-a-beautiful-live-webs-1778205515348-feecac2b.png",              imageAlt: "Step 3"},
-            {
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-of-a-beautiful-live-webs-1778205523861-0547b204.png",              imageAlt: "Step 3"},
           ]
         },
       ]}
@@ -129,16 +114,11 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={false}
       testimonials={[
-        {
+        { id: "1", name: "Sarah Johnson", date: "Jan 2024", title: "Cafe Owner", quote: "Place2Page saved me hours of web development stress.", tag: "Verified User", avatarSrc: "http://img.b2bpic.net/free-photo/female-white-suit-sitting-table-with-her-laptop-near-green-bushes_181624-23858.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205391570-f4e98867.png?_wi=2" },
-          id: "1",          name: "Sarah Johnson",          date: "Jan 2024",          title: "Cafe Owner",          quote: "Place2Page saved me hours of web development stress.",          tag: "Verified User",          avatarSrc: "http://img.b2bpic.net/free-photo/female-white-suit-sitting-table-with-her-laptop-near-green-bushes_181624-23858.jpg",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/a-futuristic-ai-powered-dashboard-interf-1778205391570-f4e98867.png?_wi=2",          imageAlt: "happy cafe business owner portrait"},
+        { id: "2", name: "Michael Chen", date: "Feb 2024", title: "Restaurant Manager", quote: "My SEO improved dramatically in one week.", tag: "Verified User", avatarSrc: "http://img.b2bpic.net/free-photo/african-american-man-with-impairment-analyzing-online-report-laptop-planning-project-strategy-disability-friendly-office-entrepreneur-with-health-condition-sitting-wheelchair-job_482257-47246.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-a-user-copying-a-1778205398915-b342abda.png?_wi=2" },
-        {
+        { id: "3", name: "Emily Rodriguez", date: "Mar 2024", title: "Boutique Owner", quote: "The AI content generation is shockingly good.", tag: "Verified User", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-black-american-male-using-laptop-drink-coffee-cafe_613910-8994.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-ai-processing-th-1778205407339-e99e664f.png?_wi=2" },
-          id: "2",          name: "Michael Chen",          date: "Feb 2024",          title: "Restaurant Manager",          quote: "My SEO improved dramatically in one week.",          tag: "Verified User",          avatarSrc: "http://img.b2bpic.net/free-photo/african-american-man-with-impairment-analyzing-online-report-laptop-planning-project-strategy-disability-friendly-office-entrepreneur-with-health-condition-sitting-wheelchair-job_482257-47246.jpg",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-a-user-copying-a-1778205398915-b342abda.png?_wi=2",          imageAlt: "happy cafe business owner portrait"},
+        { id: "4", name: "David Kim", date: "Apr 2024", title: "Cafe Manager", quote: "Finally, a tool that understands local business needs.", tag: "Verified User", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-redhead-female-barista-small-coffee-shop_613910-10446.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-of-a-beautiful-live-webs-1778205415811-3d731f28.png" },
-        {
+        { id: "5", name: "Lisa Wang", date: "May 2024", title: "Salon Owner", quote: "Simple, fast, and results are incredible.", tag: "Verified User", avatarSrc: "http://img.b2bpic.net/free-friendly-waitress-with-cup-hot-drink_23-2147775876.jpg", imageSrc: "http://img.b2bpic.net/free-vector/minimal-logos-marble-background_23-2148368363.jpg" },
-          id: "3",          name: "Emily Rodriguez",          date: "Mar 2024",          title: "Boutique Owner",          quote: "The AI content generation is shockingly good.",          tag: "Verified User",          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-black-american-male-using-laptop-drink-coffee-cafe_613910-8994.jpg",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-showing-ai-processing-th-1778205407339-e99e664f.png?_wi=2",          imageAlt: "happy cafe business owner portrait"},
-        {
-          id: "4",          name: "David Kim",          date: "Apr 2024",          title: "Cafe Manager",          quote: "Finally, a tool that understands local business needs.",          tag: "Verified User",          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-redhead-female-barista-small-coffee-shop_613910-10446.jpg",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKQM9lPNI4lPQ9uPYtLimgRQHP/an-illustration-of-a-beautiful-live-webs-1778205415811-3d731f28.png",          imageAlt: "happy cafe business owner portrait"},
-        {
-          id: "5",          name: "Lisa Wang",          date: "May 2024",          title: "Salon Owner",          quote: "Simple, fast, and results are incredible.",          tag: "Verified User",          avatarSrc: "http://img.b2bpic.net/free-photo/friendly-waitress-with-cup-hot-drink_23-2147775876.jpg",          imageSrc: "http://img.b2bpic.net/free-vector/minimal-logos-marble-background_23-2148368363.jpg",          imageAlt: "happy cafe business owner portrait"},
       ]}
       title="Trusted by Local Business Founders"
       description="Join thousands of cafe and restaurant owners who have transformed their digital presence."
@@ -152,16 +132,10 @@ export default function LandingPage() {
       useInvertedBackground={false}
       plans={[
         {
-          id: "starter",          badge: "Essential",          price: "$19/mo",          subtitle: "Perfect for one location.",          features: [
+          id: "basic",          badge: "Basic",          price: "$0/mo",          subtitle: "Essential tools for getting started.",          features: [ "Basic listing page", "AI content generation", "Standard support" ]
-            "SEO optimization",            "Auto-updates",            "Email support"],
         },
         {
-          id: "pro",          badge: "Best Value",          price: "$49/mo",          subtitle: "For established multi-location owners.",          features: [
+          id: "core",          badge: "Core",          price: "$4.99/mo",          subtitle: "Enhanced tools for growth.",          features: [ "Everything in Basic", "Custom domain support", "Priority support" ]
-            "Everything in Starter",            "Multiple locations",            "Priority support"],
-        },
-        {
-          id: "enterprise",          badge: "Agency",          price: "$199/mo",          subtitle: "Full control and analytics.",          features: [
-            "Everything in Pro",            "White-label support",            "Custom domains"],
         },
       ]}
       title="Affordable Plans for Growing Businesses"
@@ -185,12 +159,9 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={false}
       faqs={[
-        {
+        { id: "q1", title: "Do I need a Maps account?", content: "Yes, you need an existing Google Maps listing." },
-          id: "q1",          title: "Do I need a Maps account?",          content: "Yes, you need an existing Google Maps listing."},
+        { id: "q2", title: "How fast is it?", content: "The AI builds and publishes your site in under a minute." },
-        {
+        { id: "q3", title: "Is it SEO optimized?", content: "Absolutely, built-in schema markup and keyword targeting included." },
-          id: "q2",          title: "How fast is it?",          content: "The AI builds and publishes your site in under a minute."},
-        {
-          id: "q3",          title: "Is it SEO optimized?",          content: "Absolutely, built-in schema markup and keyword targeting included."},
       ]}
       title="Common Questions"
       description="Everything you need to know about Place2Page."
@@ -201,14 +172,13 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactCTA
       useInvertedBackground={false}
-      background={{
+      background={{ variant: "sparkles-gradient" }}
-        variant: "sparkles-gradient"}}
       tag="Ready to get started?"
       title="Launch Your Site Today"
       description="Stop struggling with web development and join the future of local business."
       buttons={[
         {
-          text: "Start 30-Day Free Trial",          href: "#"},
+          text: "Start 30-Day Free Trial",          href: "/payment"},
       ]}
     />
   </div>
@@ -218,30 +188,22 @@ export default function LandingPage() {
       columns={[
         {
           title: "Product",          items: [
-            {
+            { label: "Features", href: "#features" },
-              label: "Features",              href: "#features"},
+            { label: "Pricing", href: "#pricing" },
-            {
+            { label: "FAQ", href: "#faq" },
-              label: "Pricing",              href: "#pricing"},
-            {
-              label: "FAQ",              href: "#faq"},
           ],
         },
         {
           title: "Company",          items: [
-            {
+            { label: "About Us", href: "/#" },
-              label: "About Us",              href: "#"},
+            { label: "Careers", href: "/#" },
-            {
+            { label: "Contact", href: "#contact" },
-              label: "Careers",              href: "#"},
-            {
-              label: "Contact",              href: "#contact"},
           ],
         },
         {
           title: "Legal",          items: [
-            {
+            { label: "Privacy Policy", href: "/#" },
-              label: "Privacy Policy",              href: "#"},
+            { label: "Terms of Service", href: "/#" },
-            {
-              label: "Terms of Service",              href: "#"},
           ],
         },
       ]}

src/app/payment/page.tsx

@@ -0,0 +1,70 @@
+"use client";
+
+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 FooterBase from '@/components/sections/footer/FooterBase';
+
+export default function PaymentPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="shift-hover"
+        defaultTextAnimation="background-highlight"
+        borderRadius="soft"
+        contentWidth="mediumSmall"
+        sizing="large"
+        background="grid"
+        cardStyle="layered-gradient"
+        primaryButtonStyle="radial-glow"
+        secondaryButtonStyle="layered"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingInline
+              navItems={[
+                { name: "How it Works", id: "/#how-it-works" },
+                { name: "Features", id: "/#features" },
+                { name: "Pricing", id: "/#pricing" },
+                { name: "FAQ", id: "/#faq" },
+              ]}
+              brandName="Place2Page"
+              button={{ text: "Get Started", href: "/payment" }}
+            />
+        </div>
+
+        <div className="pt-32 pb-20">
+          <PricingCardTwo
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            title="Choose Your Plan"
+            description="Select the perfect plan to get your local business online."
+            plans={[
+              {
+                id: "basic",                badge: "Basic",                price: "$0/mo",                subtitle: "Essential tools for getting started.",                buttons: [{ text: "Choose this", href: "#" }],
+                features: ["Basic listing page", "AI content generation", "Standard support"]
+              },
+              {
+                id: "core",                badge: "Core",                price: "$4.99/mo",                subtitle: "Enhanced tools for growth.",                buttons: [{ text: "Choose this", href: "#" }],
+                features: ["Everything in Basic", "Custom domain support", "Priority support"]
+              }
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+            <FooterBase
+              columns={[
+                { title: "Product", items: [{ label: "Features", href: "/#features" }, { label: "Pricing", href: "/#pricing" }, { label: "FAQ", href: "/#faq" }] },
+                { title: "Company", items: [{ label: "About Us", href: "/#" }, { label: "Careers", href: "/#" }, { label: "Contact", href: "/#contact" }] },
+                { title: "Legal", items: [{ label: "Privacy Policy", href: "/#" }, { label: "Terms of Service", href: "/#" }] },
+              ]}
+              logoText="Place2Page"
+            />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}