"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import { Linkedin, Shield, Sparkles, Twitter, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="icon-arrow"
        defaultTextAnimation="entrance-slide"
        borderRadius="soft"
        contentWidth="mediumSmall"
        sizing="mediumLargeSizeLargeTitles"
        background="none"
        cardStyle="glass-elevated"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="glass"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "About",          id: "about"},
        {
          name: "Services",          id: "features"},
        {
          name: "Testimonials",          id: "testimonials"},
        {
          name: "Contact",          id: "contact"},
      ]}
      brandName="MoonValley AI"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardGallery
      background={{
        variant: "radial-gradient"}}
      title="Architecting the Future of Intelligence"
      description="MoonValley AI bridges the gap between raw data and actionable intelligence through premium, bespoke AI solutions."
      buttons={[
        {
          text: "Get Started",          href: "#contact"},
      ]}
      mediaItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-cyber-network-visualization-design_1048-17445.jpg",          imageAlt: "Neural network abstract"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/double-exposure-caucasian-man-virtual-reality-vr-headset-is-presumably-gamer-hacker-cracking-code-into-secure-network-server-with-lines-code_146671-18938.jpg",          imageAlt: "AI Code UI"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/artificial-intelligence-concept_23-2151977505.jpg",          imageAlt: "Holographic AI interface"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/futuristic-geometric-shapes-connect-modern-abstract-design-generated-by-ai_188544-26829.jpg",          imageAlt: "Futuristic geometric shapes connect for modern abstract design"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/abstract-blurred-colorful-light-spots_23-2148241279.jpg",          imageAlt: "Abstract blurred colorful light spots"},
      ]}
      mediaAnimation="blur-reveal"
    />
  </div>

  <div id="about" data-section="about">
      <InlineImageSplitTextAbout
      useInvertedBackground={false}
      heading={[
        {
          type: "text",          content: "Redefining "},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/software-developer-pioneering-technology-startup-using-green-screen-pc_482257-118829.jpg",          alt: "AI Studio"},
        {
          type: "text",          content: " Enterprise AI"},
      ]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyFive
      animationType="depth-3d"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          title: "Neural Analytics",          description: "Harnessing deep learning to uncover hidden patterns.",          icon: Zap,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/3d-data-technology-background-with-flowing-particles_1048-18065.jpg",              imageAlt: "data flow visualization"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/person-using-ar-technology-perform-their-occupation_23-2151137474.jpg",              imageAlt: "data flow visualization"},
          ],
        },
        {
          title: "Model Training",          description: "Scalable model fine-tuning for your unique data sets.",          icon: Shield,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/abstract-digital-grid-black-background_53876-97647.jpg",              imageAlt: "data flow visualization"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/dark-illustration-background_181624-11581.jpg",              imageAlt: "data flow visualization"},
          ],
        },
        {
          title: "Automated Pipelines",          description: "Seamless integration into your existing tech stack.",          icon: Sparkles,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/3d-render-digital-particles-techno-background_1048-14519.jpg",              imageAlt: "data flow visualization"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-futuristic-landscape-with-extruding-cubes_1048-12319.jpg",              imageAlt: "data flow visualization"},
          ],
        },
      ]}
      title="Tailored AI Services"
      description="Custom models designed to solve your most complex operational challenges."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardFourteen
      useInvertedBackground={false}
      title="Impact Driven Outcomes"
      tag="Trusted Metrics"
      metrics={[
        {
          id: "m1",          value: "99.8%",          description: "Accuracy across models"},
        {
          id: "m2",          value: "40%",          description: "Efficiency boost average"},
        {
          id: "m3",          value: "50+",          description: "Enterprise projects"},
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",          name: "Alex Rivier",          date: "Oct 2023",          title: "CTO",          quote: "MoonValley AI completely transformed our data output.",          tag: "AI Implementation",          avatarSrc: "http://img.b2bpic.net/free-photo/pov-businessman-attending-videocall-meeting-office-using-online-videoconference-talk-consultant-about-financial-strategy-company-employee-chatting-remote-teleconference-close-up_482257-40929.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-cyber-network-visualization-design_1048-17445.jpg",          imageAlt: "tech executive portrait"},
        {
          id: "t2",          name: "Sarah Chen",          date: "Jan 2024",          title: "Lead Dev",          quote: "Seamless integration, incredible accuracy.",          tag: "SaaS Growth",          avatarSrc: "http://img.b2bpic.net/free-photo/corporate-employee-posing-office_23-2148804484.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/double-exposure-caucasian-man-virtual-reality-vr-headset-is-presumably-gamer-hacker-cracking-code-into-secure-network-server-with-lines-code_146671-18938.jpg",          imageAlt: "tech executive portrait"},
        {
          id: "t3",          name: "David Kim",          date: "Feb 2024",          title: "Director",          quote: "Their models are best in class for finance.",          tag: "Finance Tech",          avatarSrc: "http://img.b2bpic.net/free-photo/man-working-call-center-office_23-2149256097.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/artificial-intelligence-concept_23-2151977505.jpg",          imageAlt: "tech executive portrait"},
        {
          id: "t4",          name: "Maria Garcia",          date: "Mar 2024",          title: "Product VP",          quote: "A true strategic partner in AI innovation.",          tag: "Product Design",          avatarSrc: "http://img.b2bpic.net/free-photo/front-view-elegant-mature-male-holding-tablet_23-2148673422.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/software-developer-pioneering-technology-startup-using-green-screen-pc_482257-118829.jpg",          imageAlt: "tech executive portrait"},
        {
          id: "t5",          name: "James Watt",          date: "Apr 2024",          title: "Engineer",          quote: "Fast, reliable, and incredibly scalable.",          tag: "Enterprise AI",          avatarSrc: "http://img.b2bpic.net/free-photo/modern-young-stylish-smiling-man-co-working-office-startup-freelancer-holding-using-tablet_285396-1777.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/3d-data-technology-background-with-flowing-particles_1048-18065.jpg",          imageAlt: "tech executive portrait"},
      ]}
      title="Industry Leaders Trust Us"
      description="Partnering with the world's most innovative companies."
    />
  </div>

  <div id="socialproof" data-section="socialproof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "Google",        "Microsoft",        "OpenAI",        "Nvidia",        "AWS",        "Salesforce",        "IBM"]}
      title="Powered by Partners"
      description="We collaborate with the world's leading technology infrastructures."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="split"
      useInvertedBackground={false}
      faqs={[
        {
          id: "f1",          title: "How long for an AI implementation?",          content: "Typical projects range from 4-12 weeks."},
        {
          id: "f2",          title: "Do you own the models?",          content: "You retain full IP rights to your custom solutions."},
        {
          id: "f3",          title: "How do we scale?",          content: "Our modular architecture allows for easy scalability."},
      ]}
      title="Common Inquiries"
      description="Answers to the most frequent questions about our AI agency."
      faqsAnimation="blur-reveal"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCTA
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      tag="Let's Talk"
      title="Ready to Transform Your Business?"
      description="Connect with our AI strategy team to discuss your next innovation project."
      buttons={[
        {
          text: "Contact Agency"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterCard
      logoText="MoonValley AI"
      copyrightText="© 2025 MoonValley AI Agency. All rights reserved."
      socialLinks={[
        {
          icon: Twitter,
          href: "https://twitter.com",          ariaLabel: "Twitter"},
        {
          icon: Linkedin,
          href: "https://linkedin.com",          ariaLabel: "LinkedIn"},
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
