"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import { Award, Target, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="mediumSmall"
        sizing="mediumLargeSizeLargeTitles"
        background="blurBottom"
        cardStyle="gradient-radial"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="solid"
        headingFontWeight="light"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
          <NavbarStyleCentered
            navItems={[
              { name: "Home", id: "hero" },
              { name: "Services", id: "features" },
              { name: "Results", id: "metrics" },
              { name: "Contact", id: "contact" },
            ]}
            brandName="ELITE"
          />
        </div>

        <div id="hero" data-section="hero">
          <HeroSplitTestimonial
            useInvertedBackground={false}
            background={{ variant: "radial-gradient" }}
            title="We Build Brands That Dominate Online."
            description="Exclusive digital solutions for industry leaders seeking market supremacy through precision design and high-velocity growth strategies."
            testimonials={[
              { name: "Elena Vance", handle: "@evance", testimonial: "Elite agency transformed our revenue trajectory.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/senior-businessman-walking-outside-modern-office-building_1139-1079.jpg" },
              { name: "Marcus Thorne", handle: "@mthorne", testimonial: "Precision design that actually converts.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/confident-successful-middle-aged-business-leader_1262-4872.jpg" },
              { name: "Sarah Jenkins", handle: "@sjenkins", testimonial: "Growth velocity beyond expectations.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg" },
              { name: "Leo Sterling", handle: "@lsterling", testimonial: "Absolute market supremacy, achieved.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/positive-shaved-head-male-dressed-grey-suit-dark-grey-background_613910-11352.jpg" },
              { name: "Nina Rossi", handle: "@nrossi", testimonial: "Flawless execution of our digital vision.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg" }
            ]}
            imageSrc="http://img.b2bpic.net/free-photo/empty-conference-room-within-corporation-designed-productivity_482257-124018.jpg?_wi=1"
            mediaAnimation="blur-reveal"
            avatars={[
              { src: "http://img.b2bpic.net/free-photo/confident-successful-middle-aged-business-leader_1262-4872.jpg", alt: "Portrait 1" },
              { src: "http://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg", alt: "Portrait 2" },
              { src: "http://img.b2bpic.net/free-photo/cheerful-young-businesswoman-wearing-eyeglasses_1262-4761.jpg", alt: "Portrait 3" },
              { src: "http://img.b2bpic.net/free-photo/empty-conference-room-within-corporation-designed-productivity_482257-124018.jpg", alt: "Portrait 4" },
              { src: "http://img.b2bpic.net/free-photo/portrait-businessman-with-folded-arms-looking-camera_23-2147955314.jpg", alt: "Portrait 5" }
            ]}
            marqueeItems={[
              { type: "text", text: "Strategic Branding" },
              { type: "text", text: "Performance Ads" },
              { type: "text", text: "High-End Design" },
              { type: "text", text: "Market Dominance" },
              { type: "text", text: "Revenue Scaling" }
            ]}
          />
        </div>

        <div id="social-proof" data-section="social-proof">
          <SocialProofOne
            textboxLayout="default"
            useInvertedBackground={true}
            names={["Nexus", "Aura", "Vantage", "Zenith", "Flux", "Core", "Prime"]}
            title="Partnering With The Best"
            description="Trusted by visionary brands worldwide."
          />
        </div>

        <div id="about" data-section="about">
          <AboutMetric
            useInvertedBackground={false}
            title="Our Mission of Supremacy"
            metrics={[
              { icon: Target, label: "Retention Rate", value: "98%" },
              { icon: Zap, label: "Project Velocity", value: "4x" },
              { icon: Award, label: "Awards Won", value: "24+" }
            ]}
            metricsAnimation="slide-up"
          />
        </div>

        <div id="features" data-section="features">
          <FeatureCardThree
            animationType="slide-up"
            textboxLayout="split"
            gridVariant="asymmetric-60-wide-40-narrow"
            useInvertedBackground={true}
            features={[
              { title: "Brand Identity", description: "Crafting visual identities that leave a mark.", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-studio_23-2151320706.jpg?_wi=1" },
              { title: "Web Design", description: "High-conversion web platforms.", imageSrc: "http://img.b2bpic.net/free-photo/empty-home-office-setup-showing-documents-financial-reports-laptop_482257-90893.jpg?_wi=1" },
              { title: "Paid Advertising", description: "Dominating market share via data.", imageSrc: "http://img.b2bpic.net/free-photo/diverse-team-workmates-discussing-business-growth-pointing-financial-statistics-graphs-startup-office-people-analyzing-management-information-presentation-boardroom_482257-33948.jpg?_wi=1" },
              { title: "Content Strategy", description: "Authority-building narrative.", imageSrc: "http://img.b2bpic.net/free-photo/tulip-eyeglasses-laptop-with-stationeries-wooden-backdrop_23-2147923282.jpg?_wi=1" },
              { title: "AI Automation", description: "Scaling efficiency with intelligence.", imageSrc: "http://img.b2bpic.net/free-photo/manager-meeting-with-client-data-center-review-files-doing-handshake_482257-120905.jpg" }
            ]}
            title="Premium Services"
            description="Comprehensive digital transformation solutions."
          />
        </div>

        <div id="metrics" data-section="metrics">
          <MetricCardEleven
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
            metrics={[
              { id: "m1", value: "$10M+", title: "Revenue Generated", description: "Total value delivered.", imageSrc: "http://img.b2bpic.net/free-photo/increasing-plain-white-graph-with-arrow-black-backdrop_23-2147840418.jpg" },
              { id: "m2", value: "340%", title: "Conversion Lift", description: "Average improvement.", imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-bed-with-laptop-phone_23-2148751554.jpg" },
              { id: "m3", value: "12x", title: "ROI Ratio", description: "Median return.", imageSrc: "http://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg" }
            ]}
            title="Growth Results"
            description="Data-backed ROI for every campaign."
          />
        </div>

        <div id="testimonials" data-section="testimonials">
          <TestimonialCardFive
            textboxLayout="default"
            useInvertedBackground={true}
            testimonials={[
              { id: "1", name: "James Bond", date: "Jan 2025", title: "CEO", quote: "The absolute pinnacle of digital marketing.", tag: "Strategy", avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-transgender-wearing-shells-necklace_23-2149105401.jpg", imageSrc: "http://img.b2bpic.net/free-photo/empty-conference-room-within-corporation-designed-productivity_482257-124018.jpg?_wi=2", imageAlt: "professional business portrait" },
              { id: "2", name: "Sarah Miller", date: "Dec 2024", title: "Founder", quote: "Strategic genius combined with flawless execution.", tag: "Web Design", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-successful-young-businessman-with-his-arms-crossed-looking-camera_23-2148176207.jpg", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-studio_23-2151320706.jpg?_wi=2", imageAlt: "professional business portrait" },
              { id: "3", name: "Mike Ross", date: "Nov 2024", title: "Director", quote: "ROI beyond expectations. Truly elite.", tag: "Growth", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-grey-haired-businessman-standing_74855-10324.jpg", imageSrc: "http://img.b2bpic.net/free-photo/empty-home-office-setup-showing-documents-financial-reports-laptop_482257-90893.jpg?_wi=2", imageAlt: "professional business portrait" },
              { id: "4", name: "Anna Stone", date: "Oct 2024", title: "VP", quote: "Automation processes were game-changing.", tag: "AI", avatarSrc: "http://img.b2bpic.net/free-photo/bearded-young-man-casual-shirt-standing-with-laptop-hands_93675-134479.jpg", imageSrc: "http://img.b2bpic.net/free-photo/diverse-team-workmates-discussing-business-growth-pointing-financial-statistics-graphs-startup-office-people-analyzing-management-information-presentation-boardroom_482257-33948.jpg?_wi=2", imageAlt: "professional business portrait" },
              { id: "5", name: "David Kim", date: "Sep 2024", title: "Owner", quote: "Luxury service at scale. Worth every penny.", tag: "Branding", avatarSrc: "http://img.b2bpic.net/free-photo/bearded-black-man-wearing-suit-felt-hat_613910-1878.jpg", imageSrc: "http://img.b2bpic.net/free-photo/tulip-eyeglasses-laptop-with-stationeries-wooden-backdrop_23-2147923282.jpg?_wi=2", imageAlt: "professional business portrait" }
            ]}
            title="Client Success"
            description="Elite feedback from our partners."
          />
        </div>

        <div id="pricing" data-section="pricing">
          <PricingCardEight
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
            plans={[
              { id: "tier-1", badge: "Growth", price: "$5,000", subtitle: "Core essentials for scale", features: ["Full Audit", "Social Ads", "Email Sequence"], buttons: [{ text: "Get Started", href: "#" }] },
              { id: "tier-2", badge: "Elite", price: "$12,000", subtitle: "Full authority dominance", features: ["Growth Plan", "Custom Design", "SEO Suite", "Ads Management"], buttons: [{ text: "Choose Elite", href: "#" }] },
              { id: "tier-3", badge: "Partner", price: "$25,000", subtitle: "Total market acquisition", features: ["Full Stack", "AI Automation", "Dedicated Team", "Priority Support"], buttons: [{ text: "Partner With Us", href: "#" }] }
            ]}
            title="Elite Tiers"
            description="Choose your level of market dominance."
          />
        </div>

        <div id="faq" data-section="faq">
          <FaqSplitText
            useInvertedBackground={true}
            faqs={[
              { id: "q1", title: "How does pricing work?", content: "Customized to your scale." },
              { id: "q2", title: "What is the process?", content: "Consult, Strategy, Design, Execute." },
              { id: "q3", title: "Is it fully managed?", content: "We handle everything end-to-end." }
            ]}
            sideTitle="Questions?"
            faqsAnimation="blur-reveal"
          />
        </div>

        <div id="contact" data-section="contact">
          <ContactSplitForm
            useInvertedBackground={false}
            title="Book Your Strategy Call"
            description="Let's discuss how we can scale your brand to elite status."
            inputs={[
              { name: "name", type: "text", placeholder: "Your Name", required: true },
              { name: "email", type: "email", placeholder: "Your Email", required: true }
            ]}
            textarea={{ name: "message", placeholder: "Your Goals", rows: 4 }}
            imageSrc="http://img.b2bpic.net/free-photo/empty-conference-room-within-corporation-designed-productivity_482257-124018.jpg?_wi=3"
          />
        </div>

        <div id="footer" data-section="footer">
          <FooterMedia
            imageSrc="http://img.b2bpic.net/free-photo/dramatic-black-white-sea-landscape_23-2150037719.jpg"
            logoText="ELITE"
            columns={[
              { title: "Services", items: [{ label: "Branding", href: "#" }, { label: "Web Design", href: "#" }] },
              { title: "Agency", items: [{ label: "Story", href: "#" }, { label: "Contact", href: "#" }] }
            ]}
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
