"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import { Award, Target, TrendingUp } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="medium"
        sizing="large"
        background="blurBottom"
        cardStyle="gradient-bordered"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="glass"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "Stratégie",
          id: "#hero",
        },
        {
          name: "Expertise",
          id: "#features",
        },
        {
          name: "Résultats",
          id: "#testimonials",
        },
        {
          name: "Contact",
          id: "#contact",
        },
      ]}
      brandName="Agence42"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroOverlay
      title="Strategic Digital Communication That Wins"
      description="Agence42 partners with ambitious businesses across Charente to build communication strategies that drive real results. From startups to established companies, we deliver expert guidance with a personal touch."
      buttons={[
        {
          text: "Découvrez Notre Stratégie",
          href: "#contact",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/future-visions-business-technology-concept_23-2151893455.jpg"
      imageAlt="Strategic growth and communication concept"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/smiley-women-break-time_23-2149308479.jpg",
          alt: "Team member",
        },
        {
          src: "http://img.b2bpic.net/free-photo/happy-businesswoman-celebrating-major-project-milestone_482257-123650.jpg",
          alt: "Team member",
        },
        {
          src: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-work_23-2149871315.jpg",
          alt: "Team member",
        },
        {
          src: "http://img.b2bpic.net/free-photo/excited-asian-manager-showing-blonde-secretary-documents-indoor-portrait-fair-haired-female-student-sitting-with-laptop-talking-with-chinese-friend-glasses_197531-3806.jpg",
          alt: "Team member",
        },
        {
          src: "http://img.b2bpic.net/free-photo/portrait-smiling-mature-businessman-looking-away_23-2147955371.jpg",
          alt: "Team member",
        },
      ]}
      avatarText="Trusted by over 150+ partners"
    />
  </div>

  <div id="metrics" data-section="metrics">
      <AboutMetric
      useInvertedBackground={false}
      title="Impact In Numbers"
      metrics={[
        {
          icon: Target,
          label: "Strategies Launched",
          value: "150+",
        },
        {
          icon: Award,
          label: "Client Satisfaction",
          value: "5★",
        },
        {
          icon: TrendingUp,
          label: "Growth Generated",
          value: "40%",
        },
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentySix
      textboxLayout="default"
      useInvertedBackground={true}
      features={[
        {
          title: "Brand Strategy",
          description: "Defining your unique voice in a crowded market.",
          imageSrc: "http://img.b2bpic.net/free-vector/influencer-marketing-infographic-design_23-2147689977.jpg",
          buttonIcon: "PenTool",
        },
        {
          title: "Digital Communication",
          description: "Engaging storytelling for every digital platform.",
          imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-studio_23-2151320692.jpg",
          buttonIcon: "Megaphone",
        },
        {
          title: "Growth Marketing",
          description: "Data-driven tactics to scale your operations.",
          imageSrc: "http://img.b2bpic.net/free-photo/manager-watches-tablet-with-greenscreen_482257-76577.jpg",
          buttonIcon: "TrendingUp",
        },
        {
          title: "Content Creation",
          description: "High-impact visual and textual assets.",
          imageSrc: "http://img.b2bpic.net/free-photo/planner-calendar-schedule-date-concept_53876-121073.jpg",
          buttonIcon: "Camera",
        },
      ]}
      title="Our Areas of Expertise"
      description="We craft bespoke digital strategies that resonate with your target audience and amplify your market presence."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTwelve
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",
          name: "Sophie Martin",
          imageSrc: "http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg",
        },
        {
          id: "2",
          name: "Julien Dubois",
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-confident-businessman-wearing-glasses_158595-5355.jpg",
        },
        {
          id: "3",
          name: "Claire Lefevre",
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-working-office-sitting-table-with-laptop-girl-programmer-coding-coworking_1258-195359.jpg",
        },
        {
          id: "4",
          name: "Thomas Bernard",
          imageSrc: "http://img.b2bpic.net/free-photo/blond-man-surprised_1194-2853.jpg",
        },
        {
          id: "5",
          name: "Marie Roux",
          imageSrc: "http://img.b2bpic.net/free-photo/people-job-occupation-hobby-creativity-concept-picture-positive-red-haired-young-woman-creative-profession-wearing-apron-striped-top_273609-922.jpg",
        },
      ]}
      cardTitle="What Our Partners Say"
      cardTag="Testimonials"
      cardAnimation="slide-up"
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "TechInnovate",
        "EcoSolutions",
        "GrowthPartner",
        "DigitalPulse",
        "StartupHub",
        "CreativeVentures",
        "ModernBrand",
      ]}
      title="Trusted By Industry Leaders"
      description="We are proud to collaborate with innovative businesses across France."
    />
  </div>

  <div id="services" data-section="services">
      <PricingCardEight
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      plans={[
        {
          id: "start",
          badge: "Essential",
          price: "€1,500/mo",
          subtitle: "For new growth",
          buttons: [
            {
              text: "Get Started",
              href: "#contact",
            },
          ],
          features: [
            "Brand Audit",
            "Social Media Monthly",
            "Email Strategy",
          ],
        },
        {
          id: "pro",
          badge: "Advanced",
          price: "€3,000/mo",
          subtitle: "For scaling brands",
          buttons: [
            {
              text: "Get Started",
              href: "#contact",
            },
          ],
          features: [
            "All Essential",
            "Paid Advertising",
            "Content Production",
          ],
        },
      ]}
      title="Transparent Partnership Packages"
      description="Choose a model that aligns with your growth trajectory."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="default"
      useInvertedBackground={true}
      faqs={[
        {
          id: "1",
          title: "How do you start a strategy?",
          content: "We begin with a discovery session to understand your business goals.",
        },
        {
          id: "2",
          title: "Can you handle local businesses?",
          content: "Yes, we specialize in SMEs in the Angoulême and Cognac regions.",
        },
        {
          id: "3",
          title: "What makes your agency different?",
          content: "Our personal approach and focus on actionable results rather than generic solutions.",
        },
      ]}
      title="Frequently Asked Questions"
      description="Common questions regarding our process and agency approach."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplit
      useInvertedBackground={false}
      background={{
        variant: "radial-gradient",
      }}
      tag="Contact"
      title="Ready to Start Your Strategy?"
      description="Get in touch for a personalized consultation today."
      imageSrc="http://img.b2bpic.net/free-photo/group-diverse-doctors-are-having-discussion_53876-14357.jpg"
      mediaAnimation="slide-up"
      buttonText="Send Message"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      columns={[
        {
          items: [
            {
              label: "About",
              href: "#hero",
            },
            {
              label: "Services",
              href: "#services",
            },
          ],
        },
        {
          items: [
            {
              label: "Contact",
              href: "#contact",
            },
            {
              label: "Podcast",
              href: "#",
            },
          ],
        },
        {
          items: [
            {
              label: "Legal",
              href: "#",
            },
            {
              label: "Privacy",
              href: "#",
            },
          ],
        },
      ]}
      logoText="Agence42"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
