Update src/app/upload-timing-optimization/page.tsx

Merge version_3 into main

src/app/competitor-gap-finder/page.tsx

@@ -0,0 +1,114 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
+
+export default function CompetitorGapFinderPage() {
+  const navItems = [
+    { name: "Home", id: "/#home" },
+    { name: "Discovery", id: "/#discovery" },
+    { name: "Creation Lab", id: "/#creation-lab" },
+    { name: "Thumbnail Guide", id: "/thumbnail-psychology-guide" },
+    { name: "Competitor Finder", id: "/competitor-gap-finder" },
+    { name: "Advanced Audit", id: "/#advanced-audit" },
+    { name: "FAQ", id: "/#faq" }
+  ];
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="background-highlight"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmall"
+      background="aurora"
+      cardStyle="solid"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            navItems={navItems}
+            brandName="Yt Mugi"
+            button={{ text: "Reset / Change API Key", href: "#" }}
+          />
+        </div>
+
+        <div id="competitor-finder-hero" data-section="competitor-finder-hero">
+          <FeatureCardSeven
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={true}
+            title="Identify & Exploit Competitor Gaps"
+            description="Our AI-powered tool analyzes your competitors' strategies to pinpoint weaknesses and unmet audience needs you can capitalize on. Gain a strategic advantage."
+            tag="Competitive Edge"
+            tagAnimation="opacity"
+            features={[
+              {
+                title: "Content Overlap Analysis",                description: "Discover topics where competitors have weak coverage or outdated content.",                imageSrc: "http://img.b2bpic.net/free-photo/competitive-analysis-and-digital-marketing_53876-43090.jpg?_wi=1",                imageAlt: "Content Overlap Analysis"
+              },
+              {
+                title: "Audience Engagement Discrepancies",                description: "Identify where competitors fail to engage their audience effectively, revealing opportunities.",                imageSrc: "http://img.b2bpic.net/free-photo/social-media-concept-with-tablet-mobile-phone_23-2148008851.jpg?_wi=1",                imageAlt: "Audience Engagement Discrepancies"
+              },
+              {
+                title: "Keyword Gaps",                description: "Uncover high-value keywords that your rivals are missing in their SEO strategy.",                imageSrc: "http://img.b2bpic.net/free-photo/marketing-seo-website-research-concept_53876-133544.jpg?_wi=1",                imageAlt: "Keyword Gaps"
+              },
+              {
+                title: "Thumbnail & Title Weaknesses",                description: "Analyze competitor thumbnails and titles for areas where your content can outperform.",                imageSrc: "http://img.b2bpic.net/free-photo/market-research-statistics-analysis-concept_53876-133544.jpg?_wi=1",                imageAlt: "Thumbnail & Title Weaknesses"
+              },
+              {
+                title: "Upload Schedule Analysis",                description: "Detect optimal upload times by evaluating competitor publishing patterns.",                imageSrc: "http://img.b2bpic.net/free-photo/digital-data-processing-chart_23-2148796850.jpg?_wi=1",                imageAlt: "Upload Schedule Analysis"
+              },
+              {
+                title: "Monetization Strategy Review",                description: "Examine competitor monetization methods to find underserved ad or product placement opportunities.",                imageSrc: "http://img.b2bpic.net/free-photo/social-media-marketing-online-advertising-business_53876-13764.jpg?_wi=1",                imageAlt: "Monetization Strategy Review"
+              }
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterMedia
+            imageSrc="http://img.b2bpic.net/free-photo/3d-network-data-communications-background-with-plexus-design_1048-17880.jpg"
+            imageAlt="Abstract tech background"
+            logoText="Yt Mugi"
+            columns={[
+              {
+                title: "Product",                items: [
+                  { label: "Discovery", href: "/#discovery" },
+                  { label: "Creation Lab", href: "/#creation-lab" },
+                  { label: "Thumbnail Guide", href: "/thumbnail-psychology-guide" },
+                  { label: "Competitor Finder", href: "/competitor-gap-finder" }
+                ]
+              },
+              {
+                title: "Company",                items: [
+                  { label: "About Us", href: "/#about" },
+                  { label: "Contact", href: "#" }
+                ]
+              },
+              {
+                title: "Resources",                items: [
+                  { label: "Blog", href: "#blog" },
+                  { label: "Support", href: "#" },
+                  { label: "Help Center", href: "/#faq" }
+                ]
+              },
+              {
+                title: "Legal",                items: [
+                  { label: "Privacy Policy", href: "#" },
+                  { label: "Terms of Service", href: "#" }
+                ]
+              }
+            ]}
+            copyrightText="© 2025 | Yt Mugi. All rights reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/dashboard/page.tsx

@@ -0,0 +1,135 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import { LayoutDashboard, Settings, BarChart, CalendarDays, Search as SearchIcon } from "lucide-react";
+
+export default function DashboardPage() {
+  const navItemsForDashboard = [
+    { name: "Home", id: "/" },
+    { name: "Features", id: "/#features" },
+    { name: "Tools", id: "/#tools" },
+    { name: "Insights", id: "/#insights" },
+    { name: "FAQ", id: "/#faq" },
+    { name: "Dashboard", id: "/dashboard" }
+  ];
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="background-highlight"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmall"
+      background="aurora"
+      cardStyle="solid"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            navItems={navItemsForDashboard}
+            brandName="Yt Mugi"
+            button={{ text: "Reset / Change API Key", href: "#" }}
+          />
+        </div>
+
+        <div className="min-h-screen bg-background-accent p-4 md:p-6 lg:p-8">
+          {/* Dashboard Header */}
+          <header className="bg-card shadow-sm rounded-lg p-4 mb-4 flex items-center justify-between">
+            <h1 className="text-2xl font-bold text-foreground">
+              <LayoutDashboard className="inline-block mr-3 text-primary-cta" size={28} />
+              Dashboard Overview
+            </h1>
+            {/* Additional header elements like user menu, notifications */}
+            <div className="flex items-center space-x-4">
+              <span className="text-sm text-foreground hidden sm:block">Welcome, Creator!</span>
+              {/* User Avatar Placeholder */}
+              <div className="w-10 h-10 rounded-full bg-primary-cta flex items-center justify-center text-white text-lg font-semibold">
+                YC
+              </div>
+            </div>
+          </header>
+
+          {/* Main Grid: Sidebar + Content */}
+          <div className="grid grid-cols-1 lg:grid-cols-[250px_1fr] gap-6"> { /* Increased gap for better separation */}
+            {/* Sidebar */}
+            <aside className="bg-card shadow-sm rounded-lg p-4">
+              <h2 className="text-xl font-semibold text-foreground mb-4">Navigation</h2>
+              <nav>
+                <ul className="space-y-2">
+                  <li>
+                    <a href="/dashboard" className="flex items-center text-primary-cta hover:text-accent p-3 rounded-md transition-colors duration-200">
+                      <LayoutDashboard size={20} className="mr-2" />
+                      Home
+                    </a>
+                  </li>
+                  <li>
+                    <a href="#" className="flex items-center text-foreground hover:text-primary-cta p-3 rounded-md transition-colors duration-200">
+                      <BarChart size={20} className="mr-2" />
+                      Analytics
+                    </a>
+                  </li>
+                  <li>
+                    <a href="#" className="flex items-center text-foreground hover:text-primary-cta p-3 rounded-md transition-colors duration-200">
+                      <CalendarDays size={20} className="mr-2" />
+                      Content Planner
+                    </a>
+                  </li>
+                  <li>
+                    <a href="#" className="flex items-center text-foreground hover:text-primary-cta p-3 rounded-md transition-colors duration-200">
+                      <SearchIcon size={20} className="mr-2" />
+                      SEO Tools
+                    </a>
+                  </li>
+                  <li>
+                    <a href="#" className="flex items-center text-foreground hover:text-primary-cta p-3 rounded-md transition-colors duration-200">
+                      <Settings size={20} className="mr-2" />
+                      Settings
+                    </a>
+                  </li>
+                </ul>
+              </nav>
+            </aside>
+
+            {/* Main Content Area */}
+            <main className="bg-card shadow-sm rounded-lg p-6">
+              <h2 className="text-2xl font-bold text-foreground mb-6">Main Content Area</h2>
+              <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4">
+                {/* Placeholder Cards */}
+                <div className="bg-background-accent p-5 rounded-lg text-foreground shadow-inner">
+                  <h3 className="font-semibold text-lg mb-2">Metric Card</h3>
+                  <p className="text-3xl font-extrabold text-primary-cta">12.5K</p>
+                  <p className="text-sm mt-1">Total Views this Month</p>
+                </div>
+                <div className="bg-background-accent p-5 rounded-lg text-foreground shadow-inner">
+                  <h3 className="font-semibold text-lg mb-2">Engagement Rate</h3>
+                  <p className="text-3xl font-extrabold text-accent">7.2%</p>
+                  <p className="text-sm mt-1">Up 1.2% from last week</p>
+                </div>
+                <div className="bg-background-accent p-5 rounded-lg text-foreground shadow-inner">
+                  <h3 className="font-semibold text-lg mb-2">Subscribers</h3>
+                  <p className="text-3xl font-extrabold text-primary-cta">+850</p>
+                  <p className="text-sm mt-1">New subscribers this month</p>
+                </div>
+                <div className="bg-background-accent p-5 rounded-lg text-foreground shadow-inner">
+                  <h3 className="font-semibold text-lg mb-2">Top Video</h3>
+                  <p className="text-base font-medium text-foreground truncate">"My Secret to Viral Content"</p>
+                  <p className="text-sm mt-1 text-gray-500">250K views</p>
+                </div>
+              </div>
+              <p className="mt-8 text-foreground leading-relaxed">
+                This responsive grid system provides a flexible foundation for various dashboard widgets and data visualizations.
+                It adapts seamlessly to different screen sizes, ensuring an optimal user experience whether on a desktop, tablet, or mobile device.
+                Future components will fill these content areas.
+              </p>
+            </main>
+          </div>
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/layout.tsx

@@ -11,8 +11,8 @@ import { Mulish } from "next/font/google";
 
 
 export const metadata: Metadata = {
-  title: 'YouTube Content Creation & SEO Suite | AI-Powered Growth',
-  description: 'Unlock your YouTube potential with our AI-powered suite for content creation, SEO optimization, keyword research, and channel growth strategies. Streamline your workflow.',
+  title: 'Yt Mugi | AI-Powered Growth',
+  description: 'Unlock your YouTube potential with Yt Mugi, an AI-powered suite for content creation, SEO optimization, keyword research, and channel growth strategies. Streamline your workflow.',
   keywords: ["YouTube SEO, Content Creation Suite, AI YouTube Tools, Keyword Research, Video Optimization, Channel Growth, Scripting Engine, Niche Analyzer, Video Marketing"],
   openGraph: {
     "title": "YouTube Content Creation & SEO Suite",

src/app/niche-analyzer/page.tsx

@@ -0,0 +1,99 @@
+"use client";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
+import TextBox from '@/components/Textbox';
+import Textarea from '@/components/form/Textarea';
+import ButtonHoverMagnetic from '@/components/button/ButtonHoverMagnetic/ButtonHoverMagnetic';
+import { useState } from 'react';
+import { Search } from "lucide-react";
+
+export default function NicheAnalyzerPage() {
+  const [nicheInput, setNicheInput] = useState('');
+  const handleAnalyze = () => {
+    console.log("Analyzing niche:", nicheInput);
+    // Placeholder for API call or data processing
+  };
+
+  const navItems = [
+    { name: "Home", id: "/" },
+    { name: "Features", id: "#features" },
+    { name: "Niche Analyzer", id: "/niche-analyzer" },
+    { name: "Low Competition Topics", id: "/low-competition-topics" },
+    { name: "Insights", id: "#insights" },
+    { name: "FAQ", id: "#faq" },
+  ];
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="background-highlight"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="largeSmall"
+        background="aurora"
+        cardStyle="solid"
+        primaryButtonStyle="primary-glow"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            navItems={navItems}
+            brandName="Yt Mugi"
+            button={{ text: "Reset / Change API Key", href: "#" }}
+          />
+        </div>
+
+        <div className="min-h-screen flex flex-col justify-center items-center py-20 px-4">
+          <div className="max-w-3xl w-full text-center">
+            <TextBox
+              title="Niche Analyzer"
+              description="Enter a broad topic or keyword, and our AI will identify profitable and underserved niches within it, complete with competition analysis and audience potential."
+              textboxLayout="default"
+              tag="AI-Powered Discovery"
+              tagIcon={Search}
+            />
+            <div className="mt-8 flex flex-col items-center gap-4">
+              <Textarea
+                value={nicheInput}
+                onChange={setNicheInput}
+                placeholder="e.g., 'gaming', 'cooking', 'finance for beginners'"
+                rows={5}
+                className="w-full max-w-lg"
+              />
+              <ButtonHoverMagnetic
+                text="Analyze Niche"
+                onClick={handleAnalyze}
+                className="mt-4"
+              />
+            </div>
+            <div className="mt-12 p-6 bg-card rounded-lg shadow-lg">
+              <h3 className="text-2xl font-semibold mb-4">Analysis Results (Placeholder)</h3>
+              <p className="text-foreground/80">
+                Detailed insights on market demand, competition levels, and potential content angles will appear here after analysis.
+              </p>
+            </div>
+          </div>
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterMedia
+            imageSrc="http://img.b2bpic.net/free-photo/3d-network-data-communications-background-with-plexus-design_1048-17880.jpg"
+            imageAlt="Abstract tech background"
+            logoText="Yt Mugi"
+            columns={[
+              { title: "Product", items: [{ label: "Features", href: "#features" }, { label: "Pricing", href: "#pricing" }, { label: "Integrations", href: "#" }] },
+              { title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "Careers", href: "#" }, { label: "Contact", href: "#" }] },
+              { title: "Resources", items: [{ label: "Blog", href: "#blog" }, { label: "Support", href: "#" }, { label: "Help Center", href: "#faq" }] },
+              { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
+            ]}
+            copyrightText="© 2025 | Yt Mugi. All rights reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -5,7 +5,7 @@ import ReactLenis from "lenis/react";
 import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
 import FooterMedia from '@/components/sections/footer/FooterMedia';
-import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
+import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
 import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
 import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
@@ -33,26 +33,24 @@ export default function LandingPage() {
       <NavbarLayoutFloatingOverlay
       navItems={[
         {
-          name: "Home",          id: "#home"},
+          name: "Home",          id: "/"},
         {
           name: "Features",          id: "#features"},
         {
-          name: "Tools",          id: "#tools"},
+          name: "Tools",          id: "/upload-timing-optimization"},
         {
           name: "Insights",          id: "#insights"},
         {
           name: "FAQ",          id: "#faq"},
       ]}
-      brandName="YouTube SEO Suite"
+      brandName="Yt Mugi"
       button={{
         text: "Reset / Change API Key",        href: "#"}}
     />
   </div>
 
   <div id="home" data-section="home">
-      <HeroSplitDualMedia
-      background={{
-        variant: "plain"}}
+      <HeroOverlayTestimonial
       title="Unlock Your YouTube Growth Potential"
       description="The ultimate AI-powered suite for content creation, SEO optimization, and channel growth strategy. Revolutionize your YouTube presence."
       tag="Next-Gen AI"
@@ -64,22 +62,38 @@ export default function LandingPage() {
           text: "Learn More",          href: "#features"},
       ]}
       buttonAnimation="opacity"
-      mediaItems={[
+      imageSrc="http://img.b2bpic.net/free-photo/develop-coding-web-design-coding-web-template_53876-132245.jpg"
+      imageAlt="AI-powered content creation dashboard"
+      testimonials={[
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/develop-coding-web-design-coding-web-template_53876-132245.jpg",          imageAlt: "AI-powered content creation dashboard"},
+          name: "Sarah J.",          handle: "@CreativeFlow",          testimonial: "Yt Mugi transformed my channel! My views are up 300%!",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/default-avatar-woman-1.jpg"
+        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-working-laptop-office_53876-94923.jpg",          imageAlt: "User interacting with YouTube SEO tablet"}
+          name: "Mark T.",          handle: "@TechInsights",          testimonial: "The keyword planner is a game-changer for SEO. Highly recommend!",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/default-avatar-man-1.jpg"
+        },
+        {
+          name: "Emily R.",          handle: "@GamingGal",          testimonial: "Found new niches and exploded my subscriber count. Thank you, Yt Mugi!",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/default-avatar-woman-2.jpg"
+        }
       ]}
-      mediaAnimation="slide-up"
-      rating={5}
-      ratingText="Trusted by 10K+ Creators"
+      avatars={[
+        { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/default-avatar-woman-1.jpg", alt: "Avatar of Sarah J." },
+        { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/default-avatar-man-1.jpg", alt: "Avatar of Mark T." },
+        { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/default-avatar-woman-2.jpg", alt: "Avatar of Emily R." }
+      ]}
+      avatarText="Trusted by 10K+ Creators"
+      showDimOverlay={true}
+      showBlur={true}
+      textPosition="bottom"
     />
   </div>
 
   <div id="about" data-section="about">
       <MetricSplitMediaAbout
       useInvertedBackground={true}
-      title="About the YouTube SEO Suite"
+      title="About the Yt Mugi Suite"
       description="Our powerful suite empowers creators to streamline their workflow, discover winning topics, and optimize every video for maximum reach and engagement. Built for scale and efficiency, our AI analyzes trends and provides actionable insights."
       metrics={[
         {
@@ -139,6 +153,10 @@ export default function LandingPage() {
       ]}
       title="Creation Lab"
       description="Craft compelling scripts, engaging hooks, and creative content with our advanced AI-powered engine."
+      buttons={[
+        { text: "View All Tools", href: "/upload-timing-optimization" }
+      ]}
+      buttonAnimation="opacity"
     />
   </div>
 
@@ -195,6 +213,10 @@ export default function LandingPage() {
       ]}
       title="Advanced Audit & Insights"
       description="Gain a definitive competitive edge with in-depth analysis and strategic recommendations from our AI to inform your next moves."
+      buttons={[
+        { text: "View All Tools", href: "/upload-timing-optimization" }
+      ]}
+      buttonAnimation="opacity"
     />
   </div>
 
@@ -205,7 +227,7 @@ export default function LandingPage() {
       names={[
         "YouTube Creators",        "Digital Agencies",        "Marketing Teams",        "Influencers",        "Brands",        "Educators",        "Small Businesses"]}
       title="Trusted by Top Content Creators"
-      description="Join thousands of successful creators and businesses leveraging our AI to scale their YouTube presence and impact."
+      description="Join thousands of successful creators and businesses leveraging Yt Mugi to scale their YouTube presence and impact."
       tag="Our Community"
       tagAnimation="opacity"
       speed={35}
@@ -230,7 +252,7 @@ export default function LandingPage() {
       mediaAnimation="slide-up"
       mediaPosition="right"
       title="Frequently Asked Questions"
-      description="Find quick answers to the most common questions about the YouTube SEO Suite and how it can supercharge your content strategy."
+      description="Find quick answers to the most common questions about Yt Mugi and how it can supercharge your content strategy."
       faqsAnimation="slide-up"
     />
   </div>
@@ -239,7 +261,7 @@ export default function LandingPage() {
       <FooterMedia
       imageSrc="http://img.b2bpic.net/free-photo/3d-network-data-communications-background-with-plexus-design_1048-17880.jpg"
       imageAlt="Abstract tech background"
-      logoText="YT SEO Suite"
+      logoText="Yt Mugi"
       columns={[
         {
           title: "Product",          items: [
@@ -280,10 +302,10 @@ export default function LandingPage() {
           ],
         },
       ]}
-      copyrightText="© 2025 | YouTube SEO Suite. All rights reserved."
+      copyrightText="© 2025 | Yt Mugi. All rights reserved."
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/retention-hook-generator/page.tsx

@@ -0,0 +1,103 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
+import { Bot, LineChart, TestTube } from "lucide-react";
+
+export default function RetentionHookGeneratorPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="background-highlight"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="largeSmall"
+        background="aurora"
+        cardStyle="solid"
+        primaryButtonStyle="primary-glow"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            navItems={[
+              { name: "Home", id: "#home" },
+              { name: "Features", id: "#discovery" },
+              { name: "Retention Hook Generator", id: "/retention-hook-generator" },
+              { name: "Scripting Engine", id: "/scripting-engine" },
+              { name: "SEO Asset Optimizer", id: "/seo-asset-optimizer" },
+              { name: "Insights", id: "#insights" },
+              { name: "FAQ", id: "#faq" },
+            ]}
+            brandName="Yt Mugi"
+            button={{ text: "Reset / Change API Key", href: "#" }}
+          />
+        </div>
+
+        <div id="retention-hook-generator" data-section="retention-hook-generator">
+          <FeatureCardThree
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="uniform-all-items-equal"
+            useInvertedBackground={true}
+            title="Retention Hook Generator"
+            description="Craft irresistible intros that captivate your audience and keep them watching. Our AI analyzes top-performing hooks to generate bespoke suggestions for your content."
+            features={[
+              {
+                title: "AI-Powered Hook Suggestions",                description: "Generate unique and engaging hooks tailored to your video topic and target audience.",                imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-flat-design-gathering-data-business-concept_23-2149149294.jpg",                imageAlt: "AI-powered suggestions icon"
+              },
+              {
+                title: "Engagement Analytics Integration",                description: "See how generated hooks are predicted to perform based on historical data and audience behavior.",                imageSrc: "http://img.b2bpic.net/free-photo/diverse-team-people-analyzing-data-charts-report-digital-tablet-using-online-networking-information-plan-business-project-colelagues-looking-diagrams-infographics-close-up_482257-50696.jpg",                imageAlt: "Analytics dashboard icon"
+              },
+              {
+                title: "A/B Testing Support",                description: "Test different hooks to find what resonates most with your viewers for maximum retention.",                imageSrc: "http://img.b2bpic.net/free-photo/high-angle-laptop-desk-post-its_23-2149386365.jpg",                imageAlt: "A/B testing icon"
+              }
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterMedia
+            imageSrc="http://img.b2bpic.net/free-photo/3d-network-data-communications-background-with-plexus-design_1048-17880.jpg"
+            imageAlt="Abstract tech background"
+            logoText="Yt Mugi"
+            columns={[
+              {
+                title: "Product",                items: [
+                  { label: "Features", href: "#features" },
+                  { label: "Pricing", href: "#pricing" },
+                  { label: "Integrations", href: "#" },
+                ],
+              },
+              {
+                title: "Company",                items: [
+                  { label: "About Us", href: "#about" },
+                  { label: "Careers", href: "#" },
+                  { label: "Contact", href: "#" },
+                ],
+              },
+              {
+                title: "Resources",                items: [
+                  { label: "Blog", href: "#blog" },
+                  { label: "Support", href: "#" },
+                  { label: "Help Center", href: "#faq" },
+                ],
+              },
+              {
+                title: "Legal",                items: [
+                  { label: "Privacy Policy", href: "#" },
+                  { label: "Terms of Service", href: "#" },
+                ],
+              },
+            ]}
+            copyrightText="© 2025 | Yt Mugi. All rights reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/scripting-engine/page.tsx

@@ -0,0 +1,103 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
+import { Book, Globe, LayoutTemplate } from "lucide-react";
+
+export default function ScriptingEnginePage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="background-highlight"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="largeSmall"
+        background="aurora"
+        cardStyle="solid"
+        primaryButtonStyle="primary-glow"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            navItems={[
+              { name: "Home", id: "#home" },
+              { name: "Features", id: "#discovery" },
+              { name: "Retention Hook Generator", id: "/retention-hook-generator" },
+              { name: "Scripting Engine", id: "/scripting-engine" },
+              { name: "SEO Asset Optimizer", id: "/seo-asset-optimizer" },
+              { name: "Insights", id: "#insights" },
+              { name: "FAQ", id: "#faq" },
+            ]}
+            brandName="Yt Mugi"
+            button={{ text: "Reset / Change API Key", href: "#" }}
+          />
+        </div>
+
+        <div id="scripting-engine" data-section="scripting-engine">
+          <FeatureCardThree
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="uniform-all-items-equal"
+            useInvertedBackground={true}
+            title="Scripting Engine"
+            description="Generate full video scripts, outlines, and talking points in minutes. Our AI assists in structuring your narrative, optimizing for flow and viewer retention."
+            features={[
+              {
+                title: "Automated Script Generation",                description: "Input your topic and key points, and our AI will draft a complete video script for you.",                imageSrc: "http://img.b2bpic.net/free-photo/website-design-content-layout-graphic_53876-13764.jpg",                imageAlt: "Script generation icon"
+              },
+              {
+                title: "Storytelling Frameworks",                description: "Utilize proven narrative structures to keep your audience engaged from start to finish.",                imageSrc: "http://img.b2bpic.net/free-vector/marketing-content-stickers-part-3_534985-182.jpg",                imageAlt: "Storytelling icon"
+              },
+              {
+                title: "Multi-language Support",                description: "Create scripts in various languages to reach a global audience effortlessly.",                imageSrc: "http://img.b2bpic.net/free-photo/zoom-out-right-side_187299-45685.jpg",                imageAlt: "Multi-language icon"
+              }
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterMedia
+            imageSrc="http://img.b2bpic.net/free-photo/3d-network-data-communications-background-with-plexus-design_1048-17880.jpg"
+            imageAlt="Abstract tech background"
+            logoText="Yt Mugi"
+            columns={[
+              {
+                title: "Product",                items: [
+                  { label: "Features", href: "#features" },
+                  { label: "Pricing", href: "#pricing" },
+                  { label: "Integrations", href: "#" },
+                ],
+              },
+              {
+                title: "Company",                items: [
+                  { label: "About Us", href: "#about" },
+                  { label: "Careers", href: "#" },
+                  { label: "Contact", href: "#" },
+                ],
+              },
+              {
+                title: "Resources",                items: [
+                  { label: "Blog", href: "#blog" },
+                  { label: "Support", href: "#" },
+                  { label: "Help Center", href: "#faq" },
+                ],
+              },
+              {
+                title: "Legal",                items: [
+                  { label: "Privacy Policy", href: "#" },
+                  { label: "Terms of Service", href: "#" },
+                ],
+              },
+            ]}
+            copyrightText="© 2025 | Yt Mugi. All rights reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/thumbnail-psychology-guide/page.tsx

@@ -0,0 +1,114 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
+
+export default function ThumbnailPsychologyGuidePage() {
+  const navItems = [
+    { name: "Home", id: "/#home" },
+    { name: "Discovery", id: "/#discovery" },
+    { name: "Creation Lab", id: "/#creation-lab" },
+    { name: "Thumbnail Guide", id: "/thumbnail-psychology-guide" },
+    { name: "Competitor Finder", id: "/competitor-gap-finder" },
+    { name: "Advanced Audit", id: "/#advanced-audit" },
+    { name: "FAQ", id: "/#faq" }
+  ];
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="background-highlight"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmall"
+      background="aurora"
+      cardStyle="solid"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            navItems={navItems}
+            brandName="Yt Mugi"
+            button={{ text: "Reset / Change API Key", href: "#" }}
+          />
+        </div>
+
+        <div id="thumbnail-guide-hero" data-section="thumbnail-guide-hero">
+          <FeatureCardSeven
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            title="Master Thumbnail Psychology"
+            description="Learn the science behind captivating thumbnails that drive clicks and engagement. Our guide breaks down key psychological principles and design best practices."
+            tag="Maximize CTR"
+            tagAnimation="opacity"
+            features={[
+              {
+                title: "Emotional Triggers",                description: "Understand how to evoke curiosity, excitement, or urgency with specific visual cues.",                imageSrc: "http://img.b2bpic.net/free-photo/emotion-concept-illustration_114360-1282.jpg?_wi=1",                imageAlt: "Emotional Triggers"
+              },
+              {
+                title: "Color Theory Impact",                description: "Discover the psychological effects of colors and how to use them to your advantage.",                imageSrc: "http://img.b2bpic.net/free-photo/geometric-design-poster-pastel-tone_53876-87981.jpg?_wi=1",                imageAlt: "Color Theory Impact"
+              },
+              {
+                title: "Font & Text Hierarchy",                description: "Learn to choose fonts and structure text to convey clear messages instantly.",                imageSrc: "http://img.b2bpic.net/free-photo/geometric-typography-elements-design_23-2148777176.jpg?_wi=1",                imageAlt: "Font & Text Hierarchy"
+              },
+              {
+                title: "Composition & Framing",                description: "Apply principles of visual composition to create balanced and eye-catching thumbnails.",                imageSrc: "http://img.b2bpic.net/free-photo/creative-composition-with-geometrical-shapes_23-2148682024.jpg?_wi=1",                imageAlt: "Composition & Framing"
+              },
+              {
+                title: "Audience Segmentation",                description: "Tailor your thumbnail designs to resonate with specific audience demographics.",                imageSrc: "http://img.b2bpic.net/free-photo/digital-marketing-agency-concept-illustration_114360-6395.jpg?_wi=1",                imageAlt: "Audience Segmentation"
+              },
+              {
+                title: "A/B Testing Strategies",                description: "Implement effective A/B testing to continuously improve your thumbnail performance.",                imageSrc: "http://img.b2bpic.net/free-photo/ab-testing-concept-illustration_114360-1014.jpg?_wi=1",                imageAlt: "A/B Testing Strategies"
+              }
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterMedia
+            imageSrc="http://img.b2bpic.net/free-photo/3d-network-data-communications-background-with-plexus-design_1048-17880.jpg"
+            imageAlt="Abstract tech background"
+            logoText="Yt Mugi"
+            columns={[
+              {
+                title: "Product",                items: [
+                  { label: "Discovery", href: "/#discovery" },
+                  { label: "Creation Lab", href: "/#creation-lab" },
+                  { label: "Thumbnail Guide", href: "/thumbnail-psychology-guide" },
+                  { label: "Competitor Finder", href: "/competitor-gap-finder" }
+                ]
+              },
+              {
+                title: "Company",                items: [
+                  { label: "About Us", href: "/#about" },
+                  { label: "Contact", href: "#" }
+                ]
+              },
+              {
+                title: "Resources",                items: [
+                  { label: "Blog", href: "#blog" },
+                  { label: "Support", href: "#" },
+                  { label: "Help Center", href: "/#faq" }
+                ]
+              },
+              {
+                title: "Legal",                items: [
+                  { label: "Privacy Policy", href: "#" },
+                  { label: "Terms of Service", href: "#" }
+                ]
+              }
+            ]}
+            copyrightText="© 2025 | Yt Mugi. All rights reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/upload-timing-optimization/page.tsx

@@ -0,0 +1,58 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+// Fix for Line 8, Column 10: Correcting the import statement for ButtonExpandHover
+import ButtonExpandHover from "@/components/button/ButtonExpandHover"; 
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+
+export default function UploadTimingOptimizationPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="background-highlight"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="largeSmall"
+        background="aurora"
+        cardStyle="solid"
+        primaryButtonStyle="primary-glow"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            navItems={[
+              {
+                name: "Home",          id: "/"}, // Fix for Line 28, Column 31: 'href' changed to 'id'
+              {
+                name: "Features",          id: "#features"},
+              {
+                name: "Tools",          id: "/upload-timing-optimization"}, // Fix for Line 30, Column 32: 'href' changed to 'id'
+              {
+                name: "Insights",          id: "#insights"},
+              {
+                name: "FAQ",          id: "#faq"},
+            ]}
+            brandName="Yt Mugi"
+            button={{
+              text: "Reset / Change API Key",              href: "#"
+            }}
+          />
+        </div>
+
+        {/* Content for Upload Timing Optimization Page */}
+        <div id="upload-timing-optimization-section" data-section="upload-timing-optimization-section" className="py-20 px-4 text-center">
+            <h1 className="text-4xl md:text-5xl font-bold mb-4 text-foreground">
+                Upload Timing Optimization
+            </h1>
+            <p className="text-lg md:text-xl text-muted-foreground max-w-2xl mx-auto mb-8">
+                Optimize your YouTube upload schedule for maximum reach and engagement using AI-driven insights.
+            </p>
+            <ButtonExpandHover text="Back to Tools" href="/" className="px-6 py-3" />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}