"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
import TextAbout from "@/components/sections/about/TextAbout";
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen";
import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
import ContactText from "@/components/sections/contact/ContactText";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Zap, TrendingUp, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="medium"
      sizing="medium"
      background="aurora"
      cardStyle="layered-gradient"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          navItems={[
            { name: "Hero", id: "hero" },
            { name: "Video", id: "video" },
            { name: "Testimonials", id: "testimonials" }
          ]}
          brandName="Nouxel AI"
          button={{ text: "Book My Free Demo", href: "#cta-final" }}
          animateOnLoad={true}
          className="fixed top-0 left-0 right-0 z-50 bg-white/80 backdrop-blur-md"
          buttonClassName="bg-gradient-to-r from-[#0b07ff] to-[#5f3eff] hover:from-[#0905cc] hover:to-[#4c31cc] text-white px-6 py-2 rounded-full font-semibold transition-all duration-300 shadow-lg hover:shadow-xl"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitKpi
          title="YOU'RE LOSING JOBS EVERY NIGHT AFTER 5PM."
          description="Nouxel AI answers every call, follows up every lead, and books jobs directly into your CRM — 24/7, zero extra staff."
          background={{ variant: "plain" }}
          tag="For Home Service Businesses in the USA"
          tagIcon={Zap}
          tagAnimation="slide-up"
          kpis={[
            { value: "+24%", label: "More booked jobs" },
            { value: "3 sec", label: "Response time" },
            { value: "10×", label: "Concurrent AI calls" }
          ]}
          enableKpiAnimation={true}
          avatars={[
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/professional-headshot-of-a-confident-hom-1772489756703-fba3111e.png", alt: "Business owner 1" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/female-home-service-entrepreneur-portrai-1772489756807-d7e92f9b.png", alt: "Business owner 2" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/hvac-technician-business-owner-portrait--1772489756400-7376de9c.png", alt: "Business owner 3" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/construction-business-owner-portrait-hom-1772489756473-7be00dcc.png", alt: "Business owner 4" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/roofing-company-owner-portrait-experienc-1772489756826-6304e560.png", alt: "Business owner 5" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/home-service-business-manager-portrait-d-1772489756038-aab9492f.png", alt: "Business owner 6" }
          ]}
          avatarText="Joined by 200+ home service businesses"
          buttons={[{ text: "Book My Free Demo", href: "#cta-primary" }]}
          buttonAnimation="slide-up"
          mediaAnimation="opacity"
          className="relative overflow-hidden"
          titleClassName="text-5xl md:text-7xl font-bold leading-tight tracking-tight"
          descriptionClassName="text-lg md:text-xl text-gray-700 max-w-2xl mx-auto"
          tagClassName="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-gradient-to-r from-[#93b7ff] to-[#a8bae8] text-[#0c1325] font-semibold text-sm"
        />
      </div>

      <div id="video" data-section="video">
        <TextAbout
          title="Video Player Section - 🔊 Turn sound on — this is a real AI call."
          useInvertedBackground={false}
          buttons={[{ text: "Watch Demo", href: "#" }]}
          containerClassName="py-20 px-4 bg-white"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardOne
          metrics={[
            { id: "1", value: "24", title: "% More Jobs", description: "Booked automatically through Nouxel AI", icon: TrendingUp },
            { id: "2", value: "3", title: "Seconds Response", description: "AI answers every call instantly", icon: Zap },
            { id: "3", value: "10", title: "× More Capacity", description: "Concurrent AI calls 24/7", icon: Users }
          ]}
          title="The Numbers Speak"
          description="⭐⭐⭐⭐⭐ Trusted by roofing & solar companies across the US"
          gridVariant="uniform-all-items-equal"
          textboxLayout="default"
          animationType="scale-rotate"
          useInvertedBackground={false}
          containerClassName="py-16 bg-gradient-to-b from-white to-[#f7f6f7]"
        />
      </div>

      <div id="pain-points" data-section="pain-points">
        <FeatureCardNineteen
          title="The Problems You Face Every Single Day"
          description="Nouxel AI fixes all three. Right now. Without hiring anyone."
          features={[
            {
              id: 1,
              tag: "Lost Leads",              title: "Calls After 5PM Go Unanswered",              subtitle: "Your competitor answers. You lose.",              description: "Lead calls after 5pm. No one answers. They Google the next roofer and call them instead. You never knew they existed."
            },
            {
              id: 2,
              tag: "Zero Follow-Up",              title: "Estimates Sit. Jobs Get Away.",              subtitle: "First callback wins.",              description: "Estimate sent. No follow-up. The homeowner goes with whoever called them back first. Job gone."
            },
            {
              id: 3,
              tag: "Dead Database",              title: "Your Old Leads Are Worth Nothing",              subtitle: "Time decay kills commission.",              description: "Your old lead list is sitting in your CRM from the past year. Hundreds of contacts. No one has time to call them all. So no one does."
            }
          ]}
          textboxLayout="default"
          useInvertedBackground={true}
          containerClassName="py-20 bg-[#0c1325] text-white"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          testimonials={[
            {
              id: "1",              name: "Marcus Johnson, Owner of Johnson Roofing",              date: "Date: 15 November 2024",              title: "We booked 18 jobs in the first month.",              quote: "I was skeptical at first. We'd been burned by automation tools before. But Nouxel AI took calls at 9pm, qualified leads, and followed up on every estimate. We went from losing 40% of after-hours calls to losing zero. That's real money.",              tag: "Roofing",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/professional-headshot-of-a-confident-hom-1772489756703-fba3111e.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/professional-photo-of-a-roofing-company--1772489756907-e42c06a3.png"
            },
            {
              id: "2",              name: "Sarah Chen, Solar Solutions CEO",              date: "Date: 12 November 2024",              title: "The lead follow-up is automatic now.",              quote: "Our salespeople used to spend hours on the phone following up. Now Nouxel handles it. We close 3x faster. Our team focuses on closing, not chasing. This is exactly what we needed.",              tag: "Solar",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/female-home-service-entrepreneur-portrai-1772489756807-d7e92f9b.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/female-solar-company-owner-in-field-sett-1772489756241-b913ce88.png"
            },
            {
              id: "3",              name: "David Rodriguez, HVAC Services Manager",              date: "Date: 8 November 2024",              title: "24/7 answering machine that actually books jobs.",              quote: "We're in the service business. After-hours calls are crucial. Nouxel answers every one. It's like hiring three full-time people, but way smarter. No salary, no benefits, no drama.",              tag: "HVAC",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/hvac-technician-business-owner-portrait--1772489756400-7376de9c.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/hvac-contractor-in-service-uniform-profe-1772489756060-61162352.png"
            },
            {
              id: "4",              name: "Angela Martinez, Home Services Entrepreneur",              date: "Date: 5 November 2024",              title: "It works exactly like they said it would.",              quote: "I've been in home services for 12 years. I've seen every gimmick. Nouxel is different. It's not hype. It answers calls. It books jobs. It goes straight into my CRM. I wish I'd had this five years ago.",              tag: "Home Services",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/construction-business-owner-portrait-hom-1772489756473-7be00dcc.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/home-service-business-owner-holding-tabl-1772489756602-bc391881.png"
            },
            {
              id: "5",              name: "Tom Williams, Roofing Contractor",              date: "Date: 2 November 2024",              title: "Best ROI in my business right now.",              quote: "I run a tight ship. Every dollar has to count. Nouxel is paying for itself in the first week of every month. The rest is profit. Simple as that.",              tag: "Roofing",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/roofing-company-owner-portrait-experienc-1772489756826-6304e560.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/roofing-crew-supervisor-in-branded-shirt-1772489756774-5443144c.png"
            },
            {
              id: "6",              name: "Lisa Park, Facilities Management",              date: "Date: 1 November 2024",              title: "Our lead database came alive.",              quote: "We had 400 old leads gathering dust. Nouxel re-engaged them. 22% booked jobs. We didn't know what we had. Now we do.",              tag: "Facilities",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/home-service-business-manager-portrait-d-1772489756038-aab9492f.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APMKWssU69hTQsqKKZsrshO58M/hvac-service-business-owner-portrait-in--1772489756447-700ca044.png"
            }
          ]}
          title="REAL BUSINESSES. REAL RESULTS."
          description="Don't take our word for it. Hear from roofing, solar, and HVAC companies already winning with Nouxel AI."
          tag="Proven Track Record"
          textboxLayout="default"
          useInvertedBackground={false}
          containerClassName="py-20 bg-white"
        />
      </div>

      <div id="cta-final" data-section="cta-final">
        <ContactText
          text="STOP LOSING JOBS TO COMPETITORS WHO MOVE FASTER. Every hour without Nouxel AI is an hour a competitor is answering your leads. Book your free 30-minute demo today."
          animationType="entrance-slide"
          buttons={[{ text: "Book My Free Demo", href: "#" }]}
          background={{ variant: "plain" }}
          useInvertedBackground={true}
          containerClassName="py-24 bg-gradient-to-b from-[#0c1325] to-black text-white relative overflow-hidden"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Nouxel AI"
          copyrightText="© 2025 Nouxel AI. All rights reserved."
          ariaLabel="Site footer"
          containerClassName="py-16 bg-black"
        />
      </div>
    </ThemeProvider>
  );
}
