Update src/app/page.tsx

Merge version_3 into main

src/app/about/page.tsx

@@ -0,0 +1,25 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function AboutPage() {
+  return (
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "About", id: "/about"}, {name: "Contact", id: "/contact"}, {name: "Services", id: "/services"}, {name: "Documentation", id: "/documentation"}]} brandName="Lovable" />
+        </div>
+        <div id="about-section" data-section="about-section">
+          <TextSplitAbout title="About Us" description={["We are building the future of web development, one AI-powered component at a time.", "Our mission is to democratize high-quality software creation for everyone."]} useInvertedBackground={false} />
+        </div>
+        <div id="footer" data-section="footer">
+          <FooterSimple columns={[{ title: "Platform", items: [{ label: "Features", href: "/#features" }, { label: "Pricing", href: "/pricing" }] }, { title: "Company", items: [{ label: "About", href: "/about" }, { label: "Contact", href: "/contact" }] }]} bottomLeftText="© 2024 Lovable Dev." bottomRightText="" />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/chat/page.tsx

@@ -0,0 +1,51 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import Textarea from '@/components/form/Textarea';
+import { useState } from 'react';
+
+export default function ChatPage() {
+  const [prompt, setPrompt] = useState('');
+  return (
+    <ThemeProvider
+        defaultButtonVariant="text-shift"
+        defaultTextAnimation="background-highlight"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="large"
+        background="none"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="shadow"
+        secondaryButtonStyle="glass"
+        headingFontWeight="bold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Features", id: "/features" },
+              { name: "Pricing", id: "/pricing" },
+            ]}
+            brandName="Lovable"
+          />
+        </div>
+        <main className="flex h-[calc(100vh-80px)] w-full overflow-hidden mt-20">
+          <div className="w-1/2 border-r border-border p-6 overflow-y-auto">
+            <h1 className="text-2xl font-bold mb-4">Live Chat</h1>
+            <div className="mb-6">
+                <Textarea value={prompt} onChange={setPrompt} placeholder="Enter your prompt here..." />
+            </div>
+            <div className="bg-card p-4 rounded-lg">Chat messages would go here...</div>
+          </div>
+          <div className="w-1/2 p-6 overflow-y-auto">
+            <h1 className="text-2xl font-bold mb-4">Live Preview</h1>
+            <div className="bg-card p-4 rounded-lg">Live application preview would render here...</div>
+          </div>
+        </main>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/contact/page.tsx

@@ -0,0 +1,25 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import ContactText from '@/components/sections/contact/ContactText';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function ContactPage() {
+  return (
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "About", id: "/about"}, {name: "Contact", id: "/contact"}, {name: "Services", id: "/services"}, {name: "Documentation", id: "/documentation"}]} brandName="Lovable" />
+        </div>
+        <div id="contact-text" data-section="contact-text">
+           <ContactText text="Get in touch with our team" background={{variant: "rotated-rays-animated"}} useInvertedBackground={false} />
+        </div>
+        <div id="footer" data-section="footer">
+          <FooterSimple columns={[{ title: "Platform", items: [{ label: "Features", href: "/#features" }, { label: "Pricing", href: "/pricing" }] }, { title: "Company", items: [{ label: "About", href: "/about" }, { label: "Contact", href: "/contact" }] }]} bottomLeftText="© 2024 Lovable Dev." bottomRightText="" />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/documentation/page.tsx

@@ -0,0 +1,25 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function DocumentationPage() {
+  return (
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "About", id: "/about"}, {name: "Contact", id: "/contact"}, {name: "Services", id: "/services"}, {name: "Documentation", id: "/documentation"}]} brandName="Lovable" />
+        </div>
+        <div className="pt-32 pb-20 px-8">
+           <h1 className="text-4xl font-bold mb-8">Documentation</h1>
+           <p>Learn everything you need to know about building with Lovable.</p>
+        </div>
+        <div id="footer" data-section="footer">
+          <FooterSimple columns={[{ title: "Platform", items: [{ label: "Features", href: "/#features" }, { label: "Pricing", href: "/pricing" }] }, { title: "Company", items: [{ label: "About", href: "/about" }, { label: "Contact", href: "/contact" }] }]} bottomLeftText="© 2024 Lovable Dev." bottomRightText="" />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -9,8 +9,15 @@ import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
 import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
+import Textarea from '@/components/form/Textarea';
+import { useState } from 'react';
 
 export default function LandingPage() {
+  const [prompt, setPrompt] = useState('');
+  const handleAuthAction = () => {
+    console.log("Redirecting to Authentication Flow...");
+  };
+
   return (
     <ThemeProvider
         defaultButtonVariant="text-shift"
@@ -28,12 +35,9 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleFullscreen
       navItems={[
-        {
-          name: "Features",          id: "features"},
-        {
-          name: "Pricing",          id: "pricing"},
-        {
-          name: "About",          id: "about"},
+        { name: "Features", id: "features" },
+        { name: "Pricing", id: "pricing" },
+        { name: "About", id: "about" },
       ]}
       brandName="Lovable"
     />
@@ -41,29 +45,28 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroBillboardRotatedCarousel
-      background={{
-        variant: "rotated-rays-animated"}}
+      background={{ variant: "rotated-rays-animated" }}
       title="Build beautiful apps in minutes, not months"
       description="AI-powered web development that combines stunning design with production-ready code. Ship faster without sacrificing quality or your creative vision."
       buttons={[
-        {
-          text: "Start Building Free",          href: "#"},
+        { text: "Start Building Free", onClick: handleAuthAction },
       ]}
       carouselItems={[
-        {
-          id: "c1",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/professional-software-interface-showing--1774629920038-608dc6e2.png"},
-        {
-          id: "c2",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/close-up-of-code-syntax-highlighting-wit-1774629918375-2ceadacd.png"},
-        {
-          id: "c3",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/abstract-data-visualization-with-flowing-1774629917674-391b8515.png"},
-        {
-          id: "c4",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/sleek-web-design-showcase-on-a-high-reso-1774629918002-4a4e5e50.png"},
-        {
-          id: "c5",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/futuristic-ui-components-floating-glass--1774629918779-4f834d38.png"},
-        {
-          id: "c6",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/high-tech-workspace-with-clean-setup-art-1774629918441-dff7b7f1.png"},
+        { id: "c1", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/professional-software-interface-showing--1774629920038-608dc6e2.png" },
+        { id: "c2", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/close-up-of-code-syntax-highlighting-wit-1774629918375-2ceadacd.png" },
+        { id: "c3", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/abstract-data-visualization-with-flowing-1774629917674-391b8515.png" },
+        { id: "c4", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/sleek-web-design-showcase-on-a-high-reso-1774629918002-4a4e5e50.png" },
+        { id: "c5", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/futuristic-ui-components-floating-glass--1774629918779-4f834d38.png" },
+        { id: "c6", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/high-tech-workspace-with-clean-setup-art-1774629918441-dff7b7f1.png" },
       ]}
     />
+    <div className="mt-8 px-6">
+        <Textarea 
+            value={prompt} 
+            onChange={setPrompt} 
+            placeholder="Describe your dream app..."
+        />
+    </div>
   </div>
 
   <div id="features" data-section="features">
@@ -72,12 +75,9 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={true}
       features={[
-        {
-          id: "f1",          title: "Rapid Prototyping",          description: "Generate full UI components instantly using natural language prompts.",          tag: "Speed",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/lightning-speed-icon-on-tech-platform-bl-1774629919044-2c2f42f5.png"},
-        {
-          id: "f2",          title: "AI-Native Logic",          description: "Seamless integration of complex logic without backend boilerplate.",          tag: "Intelligence",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/ai-brain-icon-with-integrated-circuit-de-1774629917970-58cf5e8f.png"},
-        {
-          id: "f3",          title: "Production Ready",          description: "Clean, optimized code that scales from MVP to enterprise scale.",          tag: "Reliability",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/production-ready-icon-with-shield-and-ch-1774629917391-64e89ca8.png"},
+        { id: "f1", title: "Rapid Prototyping", description: "Generate full UI components instantly using natural language prompts.", tag: "Speed", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/lightning-speed-icon-on-tech-platform-bl-1774629919044-2c2f42f5.png" },
+        { id: "f2", title: "AI-Native Logic", description: "Seamless integration of complex logic without backend boilerplate.", tag: "Intelligence", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/ai-brain-icon-with-integrated-circuit-de-1774629917970-58cf5e8f.png" },
+        { id: "f3", title: "Production Ready", description: "Clean, optimized code that scales from MVP to enterprise scale.", tag: "Reliability", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/production-ready-icon-with-shield-and-ch-1774629917391-64e89ca8.png" },
       ]}
       title="Built for Velocity"
       description="Powerful AI capabilities to accelerate every part of your development lifecycle."
@@ -90,12 +90,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       metrics={[
-        {
-          id: "m1",          value: "10x",          title: "Speed",          description: "Faster delivery to market",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/dashboard-chart-showing-explosive-growth-1774629919031-9d619cd9.png"},
-        {
-          id: "m2",          value: "75%",          title: "Efficiency",          description: "Reduction in boilerplate",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/efficiency-metric-icon-showing-10x-outpu-1774629917481-f1bfea4b.png"},
-        {
-          id: "m3",          value: "100+",          title: "Launched",          description: "Apps powered by Lovable",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/global-impact-metric-icon-earth-with-net-1774629917650-a7f2ca8c.png"},
+        { id: "m1", value: "10x", title: "Speed", description: "Faster delivery to market", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/dashboard-chart-showing-explosive-growth-1774629919031-9d619cd9.png" },
+        { id: "m2", value: "75%", title: "Efficiency", description: "Reduction in boilerplate", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/efficiency-metric-icon-showing-10x-outpu-1774629917481-f1bfea4b.png" },
+        { id: "m3", value: "100+", title: "Launched", description: "Apps powered by Lovable", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/global-impact-metric-icon-earth-with-net-1774629917650-a7f2ca8c.png" },
       ]}
       title="Efficiency Unleashed"
       description="Real impact metrics from real startup stories."
@@ -108,16 +105,11 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       testimonials={[
-        {
-          id: "t1",          name: "Sarah Johnson",          handle: "@sarahj",          testimonial: "Lovable changed my workflow forever. Built a production SaaS in just 48 hours.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/beautiful-app-interface-screenshot-showi-1774629918420-b74eaca3.png"},
-        {
-          id: "t2",          name: "Michael Chen",          handle: "@mchen",          testimonial: "The quality of code is unmatched in the low-code space. Finally, a tool that respects developers.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/dashboard-ui-showing-complex-data-visual-1774629918798-43747982.png"},
-        {
-          id: "t3",          name: "Elena Rodriguez",          handle: "@elenadev",          testimonial: "Incredible speed and design elegance. My clients love the aesthetic polish.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/clean-website-layout-showing-minimalist--1774629922389-f1278410.png"},
-        {
-          id: "t4",          name: "David Kim",          handle: "@dkim",          testimonial: "The AI is actually helpful, not just another wrapper. It understands architectural patterns.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/sleek-dark-theme-mobile-app-mock-up-1774629919134-045108e8.png"},
-        {
-          id: "t5",          name: "Alex Rivera",          handle: "@arivera",          testimonial: "An absolute game changer for building MVPs. Saved us weeks of development effort.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/portrait-of-a-tech-startup-founder-smili-1774629918350-55f8f2fb.png"},
+        { id: "t1", name: "Sarah Johnson", handle: "@sarahj", testimonial: "Lovable changed my workflow forever. Built a production SaaS in just 48 hours.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/beautiful-app-interface-screenshot-showi-1774629918420-b74eaca3.png" },
+        { id: "t2", name: "Michael Chen", handle: "@mchen", testimonial: "The quality of code is unmatched in the low-code space. Finally, a tool that respects developers.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/dashboard-ui-showing-complex-data-visual-1774629918798-43747982.png" },
+        { id: "t3", name: "Elena Rodriguez", handle: "@elenadev", testimonial: "Incredible speed and design elegance. My clients love the aesthetic polish.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/clean-website-layout-showing-minimalist--1774629922389-f1278410.png" },
+        { id: "t4", name: "David Kim", handle: "@dkim", testimonial: "The AI is actually helpful, not just another wrapper. It understands architectural patterns.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/sleek-dark-theme-mobile-app-mock-up-1774629919134-045108e8.png" },
+        { id: "t5", name: "Alex Rivera", handle: "@arivera", testimonial: "An absolute game changer for building MVPs. Saved us weeks of development effort.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXKBrHI0DBJmd19ktIOtFQjZ6T/portrait-of-a-tech-startup-founder-smili-1774629918350-55f8f2fb.png" },
       ]}
       title="Loved by Builders"
       description="See why top developers choose Lovable for their creative vision."
@@ -130,30 +122,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       plans={[
-        {
-          id: "p1",          badge: "Free",          price: "$0",          subtitle: "For personal side projects",          buttons: [
-            {
-              text: "Get Started",              href: "#"},
-          ],
-          features: [
-            "Limited generations",            "Community support",            "Public repos"],
-        },
-        {
-          id: "p2",          badge: "Pro",          price: "$49/mo",          subtitle: "For rapid builders",          buttons: [
-            {
-              text: "Go Pro",              href: "#"},
-          ],
-          features: [
-            "Unlimited generations",            "Priority AI model",            "Commercial license",            "GitHub sync"],
-        },
-        {
-          id: "p3",          badge: "Team",          price: "$199/mo",          subtitle: "For scaling teams",          buttons: [
-            {
-              text: "Contact Sales",              href: "#"},
-          ],
-          features: [
-            "Team collaboration",            "Custom integrations",            "SSO & security",            "Priority support"],
-        },
+        { id: "p1", badge: "Free", price: "$0", subtitle: "For personal side projects", buttons: [{ text: "Get Started", onClick: handleAuthAction }], features: ["Limited generations", "Community support", "Public repos"] },
+        { id: "p2", badge: "Pro", price: "$49/mo", subtitle: "For rapid builders", buttons: [{ text: "Go Pro", onClick: handleAuthAction }], features: ["Unlimited generations", "Priority AI model", "Commercial license", "GitHub sync"] },
+        { id: "p3", badge: "Team", price: "$199/mo", subtitle: "For scaling teams", buttons: [{ text: "Contact Sales", onClick: handleAuthAction }], features: ["Team collaboration", "Custom integrations", "SSO & security", "Priority support"] },
       ]}
       title="Start your journey today"
       description="Transparent pricing for builders of all levels."
@@ -163,34 +134,9 @@ export default function LandingPage() {
   <div id="footer" data-section="footer">
       <FooterSimple
       columns={[
-        {
-          title: "Platform",          items: [
-            {
-              label: "Features",              href: "#features"},
-            {
-              label: "Pricing",              href: "#pricing"},
-            {
-              label: "Updates",              href: "#"},
-          ],
-        },
-        {
-          title: "Company",          items: [
-            {
-              label: "About",              href: "#"},
-            {
-              label: "Blog",              href: "#"},
-            {
-              label: "Contact",              href: "#"},
-          ],
-        },
-        {
-          title: "Legal",          items: [
-            {
-              label: "Privacy",              href: "#"},
-            {
-              label: "Terms",              href: "#"},
-          ],
-        },
+        { title: "Platform", items: [{ label: "Features", href: "#features" }, { label: "Pricing", href: "#pricing" }, { label: "Updates", href: "#" }] },
+        { title: "Company", items: [{ label: "About", href: "#" }, { label: "Blog", href: "#" }, { label: "Contact", href: "#" }] },
+        { title: "Legal", items: [{ label: "Privacy", href: "#" }, { label: "Terms", href: "#" }] },
       ]}
       bottomLeftText="© 2024 Lovable Dev. All rights reserved."
       bottomRightText="Crafted with AI"

src/app/services/page.tsx

@@ -0,0 +1,25 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function ServicesPage() {
+  return (
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "About", id: "/about"}, {name: "Contact", id: "/contact"}, {name: "Services", id: "/services"}, {name: "Documentation", id: "/documentation"}]} brandName="Lovable" />
+        </div>
+        <div className="pt-32 pb-20 px-8">
+           <h1 className="text-4xl font-bold mb-8">Our Services</h1>
+           <p>We provide enterprise-grade AI solutions for modern startups.</p>
+        </div>
+        <div id="footer" data-section="footer">
+          <FooterSimple columns={[{ title: "Platform", items: [{ label: "Features", href: "/#features" }, { label: "Pricing", href: "/pricing" }] }, { title: "Company", items: [{ label: "About", href: "/about" }, { label: "Contact", href: "/contact" }] }]} bottomLeftText="© 2024 Lovable Dev." bottomRightText="" />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}