"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="bounce-effect"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="mediumSmall"
        sizing="mediumLargeSizeLargeTitles"
        background="blurBottom"
        cardStyle="gradient-mesh"
        primaryButtonStyle="shadow"
        secondaryButtonStyle="solid"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",          id: "#hero"},
        {
          name: "About",          id: "#about"},
        {
          name: "Features",          id: "#features"},
        {
          name: "Success",          id: "#metrics"},
        {
          name: "Testimonials",          id: "#testimonials"},
        {
          name: "FAQ",          id: "#faq"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      brandName="YouTube Guide"
      button={{
        text: "Begin Channel",        href: "#contact"}}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitDoubleCarousel
      background={{
        variant: "animated-grid"}}
      title="Start Your YouTube Journey Today—Simplified"
      description="Learn everything beginners need to launch a channel, create engaging content, and build an audience. From setup to strategy, we guide you step by step."
      leftCarouselItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/confident-happy-female-speaker-greeting-colleagues-video-call-discussion_482257-120280.jpg",          imageAlt: "Modern YouTube studio setup"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/top-view-coffee-cups-with-notebook_23-2148267899.jpg",          imageAlt: "Overhead view of content planning"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/programmer-typing-computer-fix-software-vulnerabilities-close-up_482257-116542.jpg",          imageAlt: "Hands typing for content creation"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/male-teacher-doing-english-lesson-online-his-students_23-2148963022.jpg",          imageAlt: "Camera with smiling creator"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/multimedia-entertainment-communication-technology-icon_53876-13805.jpg",          imageAlt: "Tablet showing YouTube tutorial"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/3d-cinema-glasses-isolated-white-background_23-2148188109.jpg",          imageAlt: "Abstract digital growth illustration"},
      ]}
      rightCarouselItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/blogger_23-2148349544.jpg",          imageAlt: "Content creator with camera"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-taking-picture-with-camera-phone_158595-1501.jpg",          imageAlt: "Laptop with YouTube stream and editing"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/blogger-journalist-young-cute-blonde-girl-recording-video-computer-office-trying-hear_140725-166048.jpg",          imageAlt: "Close-up of microphone in studio"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/famous-young-vlogger-recording-review-book-subscribers-vlogger-lifestyle_482257-25175.jpg",          imageAlt: "Whiteboard with video ideas"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/awesome-free-passion-soulful-inspire-graphics_53876-64918.jpg",          imageAlt: "Smartphone showing YouTube growth"},
        {
          imageSrc: "http://img.b2bpic.net/free-vector/infographic-about-communication-social-networks_23-2147572950.jpg",          imageAlt: "Network graphic for audience connection"},
      ]}
      buttons={[
        {
          text: "Begin Your Channel",          href: "#contact"},
      ]}
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/celebration-labour-day-with-3d-cartoon-portrait-working-woman_23-2151306555.jpg",          alt: "Creator Sarah"},
        {
          src: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2738.jpg",          alt: "Business Owner Mark"},
        {
          src: "http://img.b2bpic.net/free-photo/young-students-classroom_329181-13009.jpg",          alt: "Educator Emily"},
        {
          src: "http://img.b2bpic.net/free-photo/african-american-person-texting-messages-smartphone-app-sofa-finishing-tasks-before_482257-132216.jpg",          alt: "Student David"},
        {
          src: "http://img.b2bpic.net/free-photo/group-business-executives-holding-plastic-containers_1170-776.jpg",          alt: "Strategist Olivia"},
      ]}
      avatarText="Trusted by thousands of creators"
      marqueeItems={[
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/smiling-media-star-doing-technology-review-wireless-portable-speaker_482257-116468.jpg",          alt: "Smiling media star doing technology review of wireless portable speaker"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/remote-employee-talking-videoconference-call-with-supervisor-showing-graphs_482257-118519.jpg",          alt: "Remote employee talking in videoconference call with supervisor showing graphs"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/content-creator-using-production-camera-gear-film-motivational-type-video_482257-108484.jpg",          alt: "Content creator using production camera gear to film motivational type video"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/male-freelancer-calling-financial-expert-home-discuss-about-funds_482257-126245.jpg",          alt: "Male freelancer calling financial expert at home to discuss about funds"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/high-angle-office-with-electronic-devices_23-2148339328.jpg",          alt: "High angle office with electronic devices"},
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={true}
      title="Demystifying YouTube: Your Comprehensive Beginner's Guide"
      description="Navigating the world of YouTube can be daunting. Our guide breaks down complex topics into easy-to-understand steps, covering channel setup, content creation, audience engagement, and monetization strategies. We empower you to turn your passion into a thriving online presence without the overwhelm."
      imageSrc="http://img.b2bpic.net/free-photo/analyzing-business-strategy-process-development_53876-125042.jpg"
      imageAlt="YouTube journey infographic"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwelve
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          id: "f1",          label: "Module 1",          title: "Channel Setup: Step-by-Step",          items: [
            "Create and optimize your Google account",            "Design a professional channel banner & icon",            "Understand YouTube Studio basics",            "Verify your channel for advanced features"],
          buttons: [
            {
              text: "Start Setup Guide",              href: "#"},
          ],
        },
        {
          id: "f2",          label: "Module 2",          title: "Content Strategy & Scripting",          items: [
            "Identify your niche and target audience",            "Brainstorm engaging video ideas",            "Write compelling scripts that keep viewers hooked",            "Optimize titles, descriptions, and tags for discoverability"],
          buttons: [
            {
              text: "Master Content Strategy",              href: "#"},
          ],
        },
        {
          id: "f3",          label: "Module 3",          title: "Growth Hacks & Monetization",          items: [
            "Strategies for audience engagement & retention",            "Leverage YouTube Shorts for rapid growth",            "Understand ad revenue, sponsorships, and merchandise",            "Best practices for sustained channel growth"],
          buttons: [
            {
              text: "Maximize Growth & Earnings",              href: "#"},
          ],
        },
      ]}
      title="Unlock Your YouTube Potential with Expert Guidance"
      description="Our program offers structured lessons designed for clarity and impact, ensuring you grasp every aspect of YouTube success."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardFourteen
      useInvertedBackground={true}
      title="Proven Results from Our Community"
      tag="Achieve Success"
      metrics={[
        {
          id: "m1",          value: "50,000+",          description: "Channels Launched"},
        {
          id: "m2",          value: "2M+",          description: "Subscribers Gained"},
        {
          id: "m3",          value: "92%",          description: "Satisfaction Rate"},
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",          name: "Sarah J.",          date: "March 2023",          title: "My Channel Skyrocketed!",          quote: "This guide made starting my YouTube channel incredibly easy. The content strategy modules were a game-changer, and my subscriber count has exploded!",          tag: "Creator",          avatarSrc: "http://img.b2bpic.net/free-photo/attractive-happy-young-bearded-man-trendy-hat-texting-messages-via-social-networks-browsing-internet-using-free-wifi-his-electronic-device-coffee-break-restaurant_273609-1934.jpg",          avatarAlt: "Sarah J. Avatar",          imageSrc: "http://img.b2bpic.net/free-photo/student-home-taking-notes-while-watching-presentation-closeup_482257-118737.jpg",          imageAlt: "YouTube analytics screenshot"},
        {
          id: "t2",          name: "Mark L.",          date: "February 2023",          title: "Perfect for Small Businesses",          quote: "As a small business owner, I needed a simple way to leverage video marketing. This guide provided the tools and confidence to grow our brand's YouTube presence.",          tag: "Business Owner",          avatarSrc: "http://img.b2bpic.net/free-photo/man-wearing-red-bow-tie-looking-crazy_1298-304.jpg",          avatarAlt: "Mark L. Avatar",          imageSrc: "http://img.b2bpic.net/free-photo/enjoyment-activities-festivities-movies-pastime_53876-21360.jpg",          imageAlt: "YouTube comment section"},
        {
          id: "t3",          name: "Emily R.",          date: "April 2023",          title: "Empowering Educators",          quote: "I'm an educator and was overwhelmed by YouTube. This platform clarified everything, helping me launch an effective channel for my online courses. Highly recommend!",          tag: "Educator",          avatarSrc: "http://img.b2bpic.net/free-photo/smiling-teacher-reading-book_1098-861.jpg",          avatarAlt: "Emily R. Avatar",          imageSrc: "http://img.b2bpic.net/free-photo/happy-woman-with-play-icon-taking-selfie-from-mobile-phone_23-2147842242.jpg",          imageAlt: "Mobile YouTube tutorial"},
        {
          id: "t4",          name: "David K.",          date: "January 2023",          title: "From Zero to Thriving Community",          quote: "I started with zero experience, and now I have a growing community thanks to the engagement strategies in this guide. It truly simplified the process!",          tag: "New Creator",          avatarSrc: "http://img.b2bpic.net/free-photo/young-hispanic-man-sitting-art-studio-with-laptop-late-night-showing-pointing-up-with-fingers-number-two-while-smiling-confident-happy_839833-7512.jpg",          avatarAlt: "David K. Avatar",          imageSrc: "http://img.b2bpic.net/free-photo/3d-view-yellow-emoji_23-2150473695.jpg",          imageAlt: "Audience engagement graph"},
        {
          id: "t5",          name: "Olivia M.",          date: "May 2023",          title: "Strategic & Actionable Advice",          quote: "The guide's strategic insights are gold. It's not just about 'how to click here', but deep understanding of why certain strategies work. Fantastic resource!",          tag: "Content Strategist",          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-businessman-cartoon-style_23-2151134328.jpg",          avatarAlt: "Olivia M. Avatar",          imageSrc: "http://img.b2bpic.net/free-photo/excited-proud-player-winning-video-games-online-tournament_482257-121929.jpg",          imageAlt: "Before and after YouTube channel"},
      ]}
      title="Hear From Our Successful Creators"
      description="Real stories from individuals and businesses who transformed their YouTube presence with our guidance."
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "Creative Minds",        "Video Gurus",        "BizTube Ventures",        "Educate & Inspire",        "Digital Visionaries",        "Content Catalysts",        "Streamline Studio"]}
      title="Trusted by Aspiring Creators & Businesses"
      description="Our methods are validated by a diverse community, from individual content creators to growing brands."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "q1",          title: "How do I start a YouTube channel from scratch?",          content: "Our guide provides a detailed, step-by-step walkthrough covering everything from Google account setup to channel verification and basic branding. You'll have your channel ready in no time!"},
        {
          id: "q2",          title: "What kind of content should I create to attract viewers?",          content: "We help you identify your niche, brainstorm engaging video ideas, and develop a content strategy that resonates with your target audience. Learn to create videos that captivate and convert."},
        {
          id: "q3",          title: "Can I monetize my YouTube channel as a beginner?",          content: "Yes! Our guide explains the various ways to monetize your channel, including YouTube Partner Program requirements, ad revenue, sponsorships, and merchandise. We show you how to build a sustainable income stream."},
        {
          id: "q4",          title: "How often should I upload videos to grow my channel?",          content: "Consistency is key. We discuss optimal upload schedules based on your niche and audience, balancing quality with quantity to keep your viewers engaged and YouTube's algorithm happy."},
        {
          id: "q5",          title: "What tools do I need for video editing and production?",          content: "Our guide covers essential tools for beginners, from free editing software to affordable gear recommendations. Learn to produce high-quality videos without breaking the bank."},
      ]}
      title="Frequently Asked Questions"
      description="Find quick answers to common questions about starting your YouTube journey."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplit
      useInvertedBackground={true}
      background={{
        variant: "plain"}}
      tag="Ready to Launch?"
      title="Get Started with Your YouTube Success"
      description="Join our community of aspiring creators and receive exclusive tips, guides, and updates directly to your inbox. Take the first step towards building your influential YouTube presence today."
      imageSrc="http://img.b2bpic.net/free-photo/man-using-his-laptop-with-digital-assistant-home_23-2149107965.jpg"
      imageAlt="Person typing on laptop with YouTube interface"
      mediaAnimation="slide-up"
      inputPlaceholder="Enter your email"
      buttonText="Sign Up Now"
      termsText="By clicking Sign Up you're confirming that you agree with our Terms and Conditions."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoReveal
      logoText="YouTube Guide"
      leftLink={{
        text: "Privacy Policy",        href: "#"}}
      rightLink={{
        text: "Terms of Service",        href: "#"}}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
