Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -34,20 +34,22 @@ export default function LandingPage() {
       <NavbarStyleCentered
       navItems={[
         {
-          name: "Home",          id: "#home"},
+          name: "Home",          id: "/"},
         {
-          name: "Features",          id: "#features"},
+          name: "Features",          id: "/#features"},
         {
-          name: "How It Works",          id: "#about"},
+          name: "How It Works",          id: "/#about"},
         {
-          name: "Pricing",          id: "#pricing"},
+          name: "YouTube Tools",          id: "/youtube"},
         {
-          name: "Testimonials",          id: "#testimonials"},
+          name: "Pricing",          id: "/#pricing"},
         {
-          name: "Contact",          id: "#contact"},
+          name: "Testimonials",          id: "/#testimonials"},
+        {
+          name: "Contact",          id: "/#contact"},
       ]}
       button={{
-        text: "Get Started Free",        href: "#contact"}}
+        text: "Get Started Free",        href: "/#contact"}}
       brandName="AI Video Pro"
     />
   </div>
@@ -70,9 +72,9 @@ export default function LandingPage() {
       enableKpiAnimation={true}
       buttons={[
         {
-          text: "Start Free Trial",          href: "#pricing"},
+          text: "Start Free Trial",          href: "/#pricing"},
         {
-          text: "Watch Demo",          href: "#about"},
+          text: "Watch Demo",          href: "/#about"},
       ]}
       avatars={[
         {
@@ -277,12 +279,12 @@ export default function LandingPage() {
       <FooterLogoReveal
       logoText="AI Video Pro"
       leftLink={{
-        text: "Privacy Policy",        href: "#"}}
+        text: "Privacy Policy",        href: "/#"}}
       rightLink={{
-        text: "Terms of Service",        href: "#"}}
+        text: "Terms of Service",        href: "/#"}}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/youtube/page.tsx

@@ -0,0 +1,69 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import ContactCenter from '@/components/sections/contact/ContactCenter';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+
+export default function YouTubeIntegrationPage() {
+  const handleUrlSubmit = (url: string) => {
+    // This would be where a backend API call is made.
+    // For now, it's a placeholder.
+    alert(`Received YouTube URL: ${url}\n(Video processing logic would go here)`);
+  };
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="icon-arrow"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="largeSmallSizeMediumTitles"
+        background="fluid"
+        cardStyle="soft-shadow"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+            <NavbarStyleCentered
+            navItems={[
+              {
+                name: "Home",          id: "/"},
+              {
+                name: "Features",          id: "/#features"},
+              {
+                name: "How It Works",          id: "/#about"},
+              {
+                name: "YouTube Tools",          id: "/youtube"},
+              {
+                name: "Pricing",          id: "/#pricing"},
+              {
+                name: "Testimonials",          id: "/#testimonials"},
+              {
+                name: "Contact",          id: "/#contact"},
+            ]}
+            button={{
+              text: "Get Started Free",        href: "/#contact"}}
+            brandName="AI Video Pro"
+          />
+        </div>
+
+        <div id="youtube-integration" data-section="youtube-integration">
+          <ContactCenter
+            useInvertedBackground={false}
+            background={{ variant: "sparkles-gradient" }}
+            tag="YouTube Integration"
+            title="Transform Your YouTube Videos"
+            description="Enter a YouTube video URL below and let our AI generate viral shorts and optimized content. Get ready to boost your engagement!"
+            inputPlaceholder="Paste YouTube Video URL here..."
+            buttonText="Generate Shorts Now"
+            onSubmit={handleUrlSubmit}
+            termsText="By clicking 'Generate Shorts Now', you agree to our terms of service and grant AI Video Pro permission to process your video content."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}