"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Sparkles, Award, Zap, Target, Palette, TrendingUp, Megaphone, BarChart3, Users, Briefcase, Heart, HelpCircle, Rocket } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="medium"
      sizing="large"
      background="floatingGradient"
      cardStyle="gradient-bordered"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="AgencyPro"
          navItems={[
            { name: "Services", id: "services" },
            { name: "Portfolio", id: "portfolio" },
            { name: "About", id: "about" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact-cta" }
          ]}
          button={{
            text: "Start Project",            href: "contact-cta"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardGallery
          title="Transform Your Brand Into Market Leadership"
          description="We craft cutting-edge marketing strategies that drive real results. From digital campaigns to brand transformation, we help ambitious companies scale."
          tag="Marketing Excellence"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          background={{ variant: "radial-gradient" }}
          buttons={[
            { text: "Start Your Journey", href: "contact-cta" },
            { text: "View Our Work", href: "portfolio" }
          ]}
          buttonAnimation="slide-up"
          mediaItems={[
            { imageSrc: "http://img.b2bpic.net/free-photo/people-stand-high-five-office_482257-119247.jpg", imageAlt: "Marketing strategy session" },
            { imageSrc: "http://img.b2bpic.net/free-photo/designer-desk-architectural-tools-notebook-working-place-concept_53876-123770.jpg", imageAlt: "Creative design workspace" },
            { imageSrc: "http://img.b2bpic.net/free-photo/empty-startup-office-displays-statistics_482257-119484.jpg", imageAlt: "Digital marketing analytics" },
            { imageSrc: "http://img.b2bpic.net/free-photo/business-associates-reviewing-key-performance-indicators-within-enterprise_482257-122792.jpg", imageAlt: "Team collaboration meeting" },
            { imageSrc: "http://img.b2bpic.net/free-photo/close-up-accounting-sales-statistics-computer-display_482257-122982.jpg?_wi=1", imageAlt: "Analytics dashboard overview" }
          ]}
          mediaAnimation="slide-up"
          ariaLabel="Marketing agency hero section"
        />
      </div>

      <div id="about" data-section="about">
        <MetricSplitMediaAbout
          tag="Who We Are"
          tagIcon={Award}
          tagAnimation="slide-up"
          title="Partnering with brands to unlock their full potential"
          description="For over a decade, we've helped companies across industries transform their marketing approach. Our team combines strategic thinking with creative excellence to deliver measurable results that matter to your business."
          metrics={[
            { value: "200+", title: "Projects Delivered" },
            { value: "95%", title: "Client Retention Rate" }
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/happy-young-colleagues-office-coworking_171337-17719.jpg"
          imageAlt="AgencyPro team collaborating"
          mediaAnimation="slide-up"
          metricsAnimation="slide-up"
          useInvertedBackground={false}
          ariaLabel="About the agency section"
        />
      </div>

      <div id="services" data-section="services">
        <FeatureHoverPattern
          title="Our Core Services"
          description="End-to-end marketing solutions designed for ambitious brands ready to scale."
          tag="Services"
          tagIcon={Zap}
          tagAnimation="slide-up"
          features={[
            {
              icon: Target,
              title: "Brand Strategy",              description: "Develop compelling brand narratives and positioning that resonate with your target audience and differentiate you from competitors."
            },
            {
              icon: Palette,
              title: "Creative Design",              description: "Transform concepts into stunning visual identities through web design, branding, packaging, and multimedia experiences."
            },
            {
              icon: TrendingUp,
              title: "Digital Marketing",              description: "Drive measurable growth with data-driven campaigns across social media, SEO, content marketing, and paid advertising."
            },
            {
              icon: Megaphone,
              title: "Content Marketing",              description: "Create engaging, relevant content that attracts, engages, and converts your ideal customers into loyal brand advocates."
            },
            {
              icon: BarChart3,
              title: "Analytics & Growth",              description: "Track, analyze, and optimize every aspect of your marketing performance to maximize ROI and sustainable growth."
            },
            {
              icon: Users,
              title: "Community Building",              description: "Foster engaged communities around your brand through strategic social management and authentic audience connections."
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          ariaLabel="Our marketing services"
        />
      </div>

      <div id="portfolio" data-section="portfolio">
        <ProductCardOne
          title="Case Studies & Portfolio"
          description="Real results from real clients. Explore our latest projects showcasing strategic thinking and creative execution."
          tag="Portfolio"
          tagIcon={Briefcase}
          tagAnimation="slide-up"
          products={[
            {
              id: "case-1",              name: "TechFlow Brand Transformation",              price: "$250K+ in new revenue",              imageSrc: "http://img.b2bpic.net/free-vector/coffee-shop-stationery-collection_23-2147540898.jpg",              imageAlt: "TechFlow branding case study"
            },
            {
              id: "case-2",              name: "RetailCo Digital Campaign",              price: "300% ROI increase",              imageSrc: "http://img.b2bpic.net/free-vector/making-new-memories-travel-mobile-app_23-2148497898.jpg",              imageAlt: "RetailCo digital marketing success"
            },
            {
              id: "case-3",              name: "StartupX Growth Strategy",              price: "5M impressions/month",              imageSrc: "http://img.b2bpic.net/free-psd/digital-marketing-agency-collaborate-your-project_505751-8222.jpg",              imageAlt: "StartupX growth achievement"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="Portfolio and case studies section"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve
          testimonials={[
            {
              id: "1",              name: "Sarah Chen",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1",              imageAlt: "Sarah Chen CEO"
            },
            {
              id: "2",              name: "Michael Rodriguez",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2",              imageAlt: "Michael Rodriguez COO"
            },
            {
              id: "3",              name: "Jessica Thompson",              imageSrc: "http://img.b2bpic.net/free-photo/confident-beautiful-young-businesswoman-looking-camera-head-shot-portrait_1163-4928.jpg?_wi=1",              imageAlt: "Jessica Thompson CMO"
            },
            {
              id: "4",              name: "David Kim",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3",              imageAlt: "David Kim Founder"
            },
            {
              id: "5",              name: "Emma Watson",              imageSrc: "http://img.b2bpic.net/free-photo/confident-beautiful-young-businesswoman-looking-camera-head-shot-portrait_1163-4928.jpg?_wi=2",              imageAlt: "Emma Watson Marketing Director"
            },
            {
              id: "6",              name: "Alex Johnson",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=4",              imageAlt: "Alex Johnson VP Sales"
            }
          ]}
          cardTitle="Trusted by 500+ brands and market leaders to accelerate their growth"
          cardTag="Client Success Stories"
          cardTagIcon={Heart}
          cardAnimation="slide-up"
          useInvertedBackground={false}
          ariaLabel="Client testimonials and social proof"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardEleven
          title="Proven Results That Matter"
          description="Our data-driven approach consistently delivers exceptional outcomes for our clients."
          tag="Impact"
          tagIcon={Zap}
          tagAnimation="slide-up"
          metrics={[
            {
              id: "1",              value: "3.5x",              title: "Average ROI Growth",              description: "Across all client campaigns in 2024",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-accounting-sales-statistics-computer-display_482257-122982.jpg?_wi=2",              imageAlt: "Analytics dashboard showing growth"
            },
            {
              id: "2",              value: "87%",              title: "Conversion Rate Improvement",              description: "Through optimized marketing funnels",              imageSrc: "http://img.b2bpic.net/free-photo/analyzing-business-chart_1098-19461.jpg",              imageAlt: "Success metrics visualization"
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          ariaLabel="Key performance metrics"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          title="Common Questions"
          description="Everything you need to know about working with our agency."
          tag="FAQ"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-photo/sales-assistant-being-employed-customer-care-support-job-working-telemarketing-call-center-helpdesk-female-receptionist-with-helpline-service-helping-clients-remote-communication_482257-43021.jpg"
          imageAlt="Customer support team"
          mediaAnimation="slide-up"
          mediaPosition="left"
          textboxLayout="default"
          useInvertedBackground={false}
          faqs={[
            {
              id: "1",              title: "How do you determine pricing for projects?",              content: "We offer flexible pricing models based on project scope, complexity, and deliverables. We provide detailed proposals and work with your budget to create custom solutions that maximize value."
            },
            {
              id: "2",              title: "What's your typical project timeline?",              content: "Project timelines vary based on scope. Most brand strategy projects take 6-12 weeks, while digital campaigns can launch within 2-4 weeks. We provide clear timelines and milestones in our project proposals."
            },
            {
              id: "3",              title: "Do you work with startups and small businesses?",              content: "Absolutely! We work with companies of all sizes, from ambitious startups to established enterprises. We tailor our services and pricing to fit different business stages and growth trajectories."
            },
            {
              id: "4",              title: "How do you measure campaign success?",              content: "We establish clear KPIs and metrics aligned with your business goals. We provide regular reporting, analytics dashboards, and transparent communication about campaign performance and ROI."
            },
            {
              id: "5",              title: "Can you help with ongoing marketing management?",              content: "Yes! We offer ongoing retainer services for continuous marketing management, optimization, and strategy refinement. Many clients benefit from our long-term partnership approach."
            }
          ]}
          faqsAnimation="slide-up"
          animationType="smooth"
          ariaLabel="Frequently asked questions"
        />
      </div>

      <div id="contact-cta" data-section="contact-cta">
        <ContactCTA
          tag="Let's Work Together"
          tagIcon={Rocket}
          tagAnimation="slide-up"
          title="Ready to Transform Your Marketing?"
          description="Join hundreds of brands that have elevated their market position with our strategic approach. Let's discuss how we can help you achieve your business goals."
          buttons={[
            { text: "Schedule Consultation", href: "https://calendly.com" },
            { text: "Send Us a Message", href: "mailto:hello@agencypro.com" }
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "radial-gradient" }}
          useInvertedBackground={false}
          ariaLabel="Contact call-to-action section"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="AgencyPro"
          columns={[
            {
              title: "Services",              items: [
                { label: "Brand Strategy", href: "#services" },
                { label: "Creative Design", href: "#services" },
                { label: "Digital Marketing", href: "#services" },
                { label: "Content Marketing", href: "#services" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Our Work", href: "#portfolio" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Contact Us", href: "#contact-cta" },
                { label: "LinkedIn", href: "https://linkedin.com" },
                { label: "Twitter", href: "https://twitter.com" },
                { label: "Instagram", href: "https://instagram.com" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Case Studies", href: "#portfolio" },
                { label: "Templates", href: "#" },
                { label: "Guides", href: "#" },
                { label: "Tools", href: "#" }
              ]
            }
          ]}
          copyrightText="© 2025 AgencyPro. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}
