"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 FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import { Globe, Star, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-magnetic"
        defaultTextAnimation="background-highlight"
        borderRadius="rounded"
        contentWidth="small"
        sizing="largeSizeMediumTitles"
        background="noise"
        cardStyle="gradient-mesh"
        primaryButtonStyle="flat"
        secondaryButtonStyle="layered"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Services",
          id: "#services",
        },
        {
          name: "Expertise",
          id: "#expertise",
        },
        {
          name: "Contact",
          id: "#contact",
        },
      ]}
      brandName="MAXORA"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroCarouselLogo
      logoText="MAXORA"
      description="Nous créons des écosystèmes digitaux de prestige pour propulser votre business vers de nouveaux sommets."
      buttons={[
        {
          text: "Lancer mon projet",
          href: "#contact",
        },
        {
          text: "Voir nos réalisations",
          href: "#services",
        },
      ]}
      slides={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/minimal-home-desk-design_23-2148991424.jpg?_wi=1",
          imageAlt: "Hero slide 1",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/smart-medical-lab-workstation-background-with-digital-apps-computer-screen_482257-124525.jpg",
          imageAlt: "Hero slide 2",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/laptop-dark-night-desktop_169016-53733.jpg",
          imageAlt: "Hero slide 3",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-adult-male-working-from-home-night_23-2148499673.jpg",
          imageAlt: "Hero slide 4",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/computer-keyboard-cup-tea-wooden-table-night_169016-50573.jpg",
          imageAlt: "Hero slide 5",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/business-person-looking-finance-graphs_23-2150461325.jpg",
          imageAlt: "Hero slide 6",
        },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={true}
      title="L'Excellence Digitale"
      description="MaxoraShop redéfinit les standards. Nous combinons design haute couture et expertise stratégique pour offrir une autorité numérique totale à nos partenaires."
      imageSrc="http://img.b2bpic.net/free-photo/professionals-present-financial-charts-meeting_482257-121150.jpg?_wi=1"
      imageAlt="Agence Digitale"
    />
  </div>

  <div id="services" data-section="services">
      <FeatureBorderGlow
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          icon: Globe,
          title: "Web Design",
          description: "Sites rapides et élégants conçus pour convertir vos visiteurs.",
        },
        {
          icon: Star,
          title: "Avis Google",
          description: "Stratégie d'optimisation pour maximiser votre visibilité locale.",
        },
        {
          icon: Zap,
          title: "Stratégie SEO",
          description: "Dominance des résultats de recherche grâce à notre expertise.",
        },
      ]}
      title="Nos Services"
      description="Des solutions sur-mesure pour une croissance durable."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardTwo
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="bento-grid"
      useInvertedBackground={true}
      metrics={[
        {
          id: "m1",
          value: "150+",
          description: "Projets livrés avec succès",
        },
        {
          id: "m2",
          value: "200%",
          description: "Croissance moyenne du trafic",
        },
        {
          id: "m3",
          value: "4.9/5",
          description: "Note moyenne de satisfaction",
        },
      ]}
      title="Impact Réel"
      description="Nous mesurons notre succès à travers vos résultats."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",
          name: "Sarah L.",
          date: "2023",
          title: "Directrice Marketing",
          quote: "Un travail exceptionnel, notre visibilité a triplé.",
          tag: "Luxe",
          avatarSrc: "http://img.b2bpic.net/free-photo/business-woman-green-suit-using-phone-outside-street_1303-29546.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/minimal-home-desk-design_23-2148991424.jpg?_wi=2",
          imageAlt: "smiling business professional portrait",
        },
        {
          id: "t2",
          name: "Marc P.",
          date: "2024",
          title: "Fondateur",
          quote: "Enfin une agence qui comprend les enjeux de demain.",
          tag: "Tech",
          avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-sitting-with-cup_23-2149242586.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/professionals-present-financial-charts-meeting_482257-121150.jpg?_wi=2",
          imageAlt: "smiling business professional portrait",
        },
        {
          id: "t3",
          name: "Claire B.",
          date: "2023",
          title: "CEO",
          quote: "Le design est impeccable, le ROI suit immédiatement.",
          tag: "Mode",
          avatarSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-working-as-interior-designer_23-2150346510.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/minimalist-office-interior-design_23-2151826293.jpg?_wi=1",
          imageAlt: "smiling business professional portrait",
        },
        {
          id: "t4",
          name: "Julien T.",
          date: "2024",
          title: "Startup Lead",
          quote: "Très réactifs, un service client exemplaire.",
          tag: "Startup",
          avatarSrc: "http://img.b2bpic.net/free-photo/businessman-with-hands-pockets-standing-bedroom_23-2148112193.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/elevated-view-diary-digital-tablet-pen-keyboard-coffee-cup-desk_23-2148061557.jpg",
          imageAlt: "smiling business professional portrait",
        },
        {
          id: "t5",
          name: "Elise R.",
          date: "2024",
          title: "Gérante",
          quote: "MaxoraShop a transformé notre présence digitale.",
          tag: "Retail",
          avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=jryvc5",
          imageSrc: "http://img.b2bpic.net/free-vector/gradient-corporate-technology-futuristic-icon-set_53876-120537.jpg",
          imageAlt: "smiling business professional portrait",
        },
      ]}
      title="Ils nous font confiance"
      description="L'excellence au service de nos clients."
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "Microsoft",
        "Google",
        "Apple",
        "Salesforce",
        "HubSpot",
        "Adobe",
        "Stripe",
      ]}
      title="Nos partenaires"
      description="Collaborations stratégiques avec des leaders du marché."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="split"
      useInvertedBackground={false}
      faqs={[
        {
          id: "f1",
          title: "Combien de temps prend un projet ?",
          content: "En moyenne 4 à 8 semaines selon la complexité.",
        },
        {
          id: "f2",
          title: "Offrez-vous un suivi SEO ?",
          content: "Oui, nous proposons des forfaits d'optimisation continue.",
        },
        {
          id: "f3",
          title: "Est-ce que je garde le contrôle ?",
          content: "Absolument, vous restez propriétaire de votre plateforme.",
        },
      ]}
      title="Questions Fréquentes"
      description="Besoin d'informations supplémentaires ?"
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplit
      useInvertedBackground={true}
      background={{
        variant: "gradient-bars",
      }}
      tag="Contact"
      title="Prêt à transformer votre business ?"
      description="Parlons de votre projet dès aujourd'hui."
      imageSrc="http://img.b2bpic.net/free-photo/minimalist-office-interior-design_23-2151826293.jpg?_wi=2"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterCard
      logoText="MAXORA"
      copyrightText="© 2026 | MaxoraShop"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
