"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
import SplitAbout from "@/components/sections/about/SplitAbout";
import FeatureCardTwentyThree from "@/components/sections/feature/FeatureCardTwentyThree";
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import { Sparkles, Award, Target, Zap, TrendingUp, Palette, Briefcase, BarChart3, Users, MessageSquare, CreditCard, Rocket, Crown, MessageCircle } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="small"
      sizing="mediumLargeSizeLargeTitles"
      background="floatingGradient"
      cardStyle="layered-gradient"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Designstudio"
          navItems={[
            { name: "Work", id: "work" },
            { name: "About", id: "about" },
            { name: "Services", id: "services" },
            { name: "Pricing", id: "pricing" }
          ]}
          button={{ text: "Get Started", href: "contact" }}
          animateOnLoad={true}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitDoubleCarousel
          title="Design That Drives Real Business Results"
          description="We create beautiful, conversion-focused websites that help growing businesses attract customers and build trust online. See how we've transformed brands like yours."
          tag="Design Agency"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          buttons={[
            { text: "View Our Work", href: "work" },
            { text: "Schedule Demo", href: "contact" }
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "glowing-orb" }}
          leftCarouselItems={[
            { imageSrc: "http://img.b2bpic.net/free-psd/skincare-routine-website-template_23-2149234079.jpg", imageAlt: "Web design portfolio showcase" },
            { imageSrc: "http://img.b2bpic.net/free-vector/fitness-mobile-app-infographic-template-flat-style_23-2148217220.jpg", imageAlt: "Responsive website design" },
            { imageSrc: "http://img.b2bpic.net/free-photo/close-up-worker-with-laptop_1098-4085.jpg", imageAlt: "Minimalist web design aesthetic" },
            { imageSrc: "http://img.b2bpic.net/free-vector/minimal-geometric-landing-page-template_23-2148338567.jpg", imageAlt: "Contemporary website design" }
          ]}
          rightCarouselItems={[
            { imageSrc: "http://img.b2bpic.net/free-psd/simple-interiors-landing-page-template_23-2148818211.jpg", imageAlt: "Premium design showcase" },
            { imageSrc: "http://img.b2bpic.net/free-psd/e-commerce-furniture-landing-page_197582-336.jpg", imageAlt: "Ecommerce website layout" },
            { imageSrc: "http://img.b2bpic.net/free-vector/professional-dashboard-user-panel_23-2148359774.jpg", imageAlt: "SaaS platform interface" },
            { imageSrc: "http://img.b2bpic.net/free-photo/worker-office-talking-with-manager-videocall_482257-126637.jpg", imageAlt: "Brand redesign concept" }
          ]}
          carouselPosition="right"
        />
      </div>

      <div id="about" data-section="about">
        <SplitAbout
          title="Award-Winning Design for Growing Businesses"
          description="We partner with ambitious brands to create websites that don't just look beautiful—they drive measurable results. With 50+ successful projects and industry expertise across sectors, we know what converts."
          tag="About Us"
          tagIcon={Award}
          tagAnimation="slide-up"
          bulletPoints={[
            { title: "Conversion-Focused Design", description: "Every pixel is strategically placed to guide users toward your business goals. We combine aesthetics with behavioral psychology.", icon: Target },
            { title: "Technical Excellence", description: "Fast-loading, mobile-responsive, and SEO-optimized sites that rank and perform. Built with modern frameworks and best practices.", icon: Zap },
            { title: "Data-Driven Results", description: "We measure success through analytics. Expect transparent reporting on traffic, conversions, and ROI from day one.", icon: TrendingUp },
            { title: "Ongoing Partnership", description: "Your success doesn't end at launch. We provide maintenance, updates, and strategic recommendations to keep you ahead." }
          ]}
          imagePosition="right"
          textboxLayout="default"
          useInvertedBackground={false}
          mediaAnimation="slide-up"
          buttons={[{ text: "Learn Our Process", href: "#" }]}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardTwentyThree
          title="Our Services"
          description="Comprehensive web design solutions tailored to your business needs. From initial strategy through post-launch optimization."
          tag="What We Do"
          tagIcon={Palette}
          tagAnimation="slide-up"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          features={[
            { id: "1", title: "Website Redesign & Modernization", tags: ["Strategy", "Design", "Development"], imageSrc: "http://img.b2bpic.net/free-photo/authorized-guaranteed-certificate-approved-product_53876-127708.jpg", imageAlt: "Website redesign showcase" },
            { id: "2", title: "E-Commerce Platform Development", tags: ["Ecommerce", "Integration", "Security"], imageSrc: "http://img.b2bpic.net/free-vector/startup-anding-page_52683-5986.jpg", imageAlt: "E-commerce platform" },
            { id: "3", title: "Brand Web Presence Creation", tags: ["Branding", "Design", "Launch"], imageSrc: "http://img.b2bpic.net/free-photo/woman-using-digital-devices-cafe_53876-20920.jpg", imageAlt: "Brand web presence" }
          ]}
        />
      </div>

      <div id="work" data-section="work">
        <ProductCardOne
          title="Featured Case Studies"
          description="See how we've transformed websites for ambitious brands. Real results, real growth."
          tag="Portfolio"
          tagIcon={Briefcase}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          gridVariant="bento-grid"
          products={[
            { id: "1", name: "TechStartup Rebrand", price: "+340% Traffic", imageSrc: "http://img.b2bpic.net/free-photo/authorized-guaranteed-certificate-approved-product_53876-127708.jpg", imageAlt: "Tech startup website redesign" },
            { id: "2", name: "Ecommerce Transformation", price: "+215% Sales", imageSrc: "http://img.b2bpic.net/free-vector/startup-anding-page_52683-5986.jpg", imageAlt: "Ecommerce platform launch" },
            { id: "3", name: "Service Business Growth", price: "+180% Leads", imageSrc: "http://img.b2bpic.net/free-photo/woman-using-digital-devices-cafe_53876-20920.jpg", imageAlt: "Service business website launch" }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardThree
          title="Proven Agency Performance"
          description="Metrics that matter. Real impact on real businesses."
          tag="Our Track Record"
          tagIcon={BarChart3}
          tagAnimation="slide-up"
          animationType="scale-rotate"
          textboxLayout="default"
          useInvertedBackground={true}
          metrics={[
            { id: "1", icon: Briefcase, title: "Projects Completed", value: "50+" },
            { id: "2", icon: Users, title: "Happy Clients", value: "45+" },
            { id: "3", icon: TrendingUp, title: "Avg. Growth", value: "245%" },
            { id: "4", icon: Award, title: "Industry Awards", value: "12" }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSixteen
          title="What Our Clients Say"
          description="Trusted by business leaders and marketing teams across industries."
          tag="Testimonials"
          tagIcon={MessageSquare}
          tagAnimation="slide-up"
          animationType="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
          testimonials={[
            { id: "1", name: "Sarah Johnson", role: "CEO", company: "TechFlow Inc", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg", imageAlt: "Sarah Johnson" },
            { id: "2", name: "Michael Chen", role: "Marketing Director", company: "GrowthCo", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageAlt: "Michael Chen" },
            { id: "3", name: "Emily Rodriguez", role: "Founder", company: "Digital Ventures", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-labor-union-member_23-2150969909.jpg", imageAlt: "Emily Rodriguez" },
            { id: "4", name: "David Kim", role: "Operations Manager", company: "NextGen Services", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/cheerful-employee-with-crossed-arms_1098-3148.jpg", imageAlt: "David Kim" },
            { id: "5", name: "Jessica Martinez", role: "Business Owner", company: "Stellar Retail", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-posing-cv_23-2149927606.jpg", imageAlt: "Jessica Martinez" },
            { id: "6", name: "Thomas Anderson", role: "VP Marketing", company: "Premium Brands Co", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-middle-aged-businessman-posing-looking-camera_1163-4800.jpg", imageAlt: "Thomas Anderson" }
          ]}
          kpiItems={[
            { value: "98%", label: "Client Satisfaction Rate" },
            { value: "5x", label: "Avg ROI Within 6 Months" },
            { value: "7 yrs", label: "Industry Experience" }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardOne
          title="Transparent, Scalable Pricing"
          description="Choose the right package for your business. No hidden fees, no surprises."
          tag="Pricing"
          tagIcon={CreditCard}
          tagAnimation="slide-up"
          animationType="depth-3d"
          textboxLayout="default"
          useInvertedBackground={true}
          plans={[
            { id: "starter", badge: "Great for Startups", badgeIcon: Rocket, price: "$3,500", subtitle: "Perfect for first-time site builders", features: ["5-page website design", "Mobile responsive", "SEO optimization basics", "Contact form & analytics setup", "1 month support included"] },
            { id: "professional", badge: "Most Popular", badgeIcon: Sparkles, price: "$7,500", subtitle: "Best for growing businesses", features: ["Up to 15-page website", "Advanced SEO strategy", "Conversion optimization", "CRM & lead capture setup", "3 months maintenance included", "Monthly performance reports"] },
            { id: "enterprise", badge: "Custom Solutions", badgeIcon: Crown, price: "Custom", subtitle: "For complex, high-traffic sites", features: ["Unlimited pages & features", "E-commerce integration", "Custom integrations & APIs", "Priority 24/7 support", "6 months optimization", "Dedicated account manager"] }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Get Started Today"
          title="Ready to Transform Your Web Presence?"
          description="Let's discuss your vision and create a website that converts. Schedule a free 30-minute consultation call with our team."
          tagIcon={MessageCircle}
          tagAnimation="slide-up"
          background={{ variant: "sparkles-gradient" }}
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-photo/desk-office-with-objects_23-2147982320.jpg"
          imageAlt="Designer working on website project"
          mediaAnimation="slide-up"
          mediaPosition="right"
          inputPlaceholder="your@email.com"
          buttonText="Schedule Call"
          termsText="We respect your inbox. Unsubscribe anytime. We'll follow up within 24 hours."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={[
            { title: "Product", items: [{ label: "Services", href: "services" }, { label: "Pricing", href: "pricing" }, { label: "Case Studies", href: "work" }, { label: "Process", href: "#" }] },
            { title: "Company", items: [{ label: "About Us", href: "about" }, { label: "Team", href: "#" }, { label: "Blog", href: "#" }, { label: "Careers", href: "#" }] },
            { title: "Connect", items: [{ label: "Contact", href: "contact" }, { label: "Twitter", href: "https://twitter.com" }, { label: "LinkedIn", href: "https://linkedin.com" }, { label: "Instagram", href: "https://instagram.com" }] }
          ]}
          copyrightText="© 2025 Designstudio. All rights reserved. Crafted for ambitious brands."
        />
      </div>
    </ThemeProvider>
  );
}