"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import { Leaf, Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="background-highlight"
        borderRadius="rounded"
        contentWidth="mediumLarge"
        sizing="largeSmall"
        background="circleGradient"
        cardStyle="glass-depth"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="glass"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",          id: "hero"},
        {
          name: "About",          id: "about"},
        {
          name: "Options",          id: "product"},
        {
          name: "Contact",          id: "contact"},
      ]}
      brandName="ArchStudio"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardTestimonial
      useInvertedBackground={true}
      background={{
        variant: "plain"}}
      title="Crafting Spaces for Living"
      description="Expert architectural design for bespoke residential projects. Choose your vision from single to three-floor designs."
      testimonials={[
        {
          name: "Marcus V.",          handle: "Client",          testimonial: "Exceptional vision and execution.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/senior-couple-dancing-home_23-2149891223.jpg"},
        {
          name: "Elena P.",          handle: "Client",          testimonial: "They turned our dream into reality.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/new-employee-need-some-help-work_329181-15139.jpg"},
        {
          name: "Julian D.",          handle: "Client",          testimonial: "Professional and creative.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/famous-parasol-structure-sevilla_268835-15564.jpg"},
        {
          name: "Sarah W.",          handle: "Client",          testimonial: "Absolutely beautiful home design.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/hands-young-businessman-sitting-table-with-notepad-white-modern-office-interior-background_176420-55240.jpg"},
        {
          name: "Robert B.",          handle: "Client",          testimonial: "Seamless architectural process.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/middle-age-couple-standing-together-doing-ok-gesture-with-hand-smiling-eye-looking-through-fingers-with-happy-face_839833-32832.jpg"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/urban-adult-architect-inspecting-design-plan-workplace_482257-8114.jpg"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/young-businesswoman-standing-balcony-holding-cellphone-disposable-coffee-cup_23-2147941542.jpg",          alt: "Client profile 1"},
        {
          src: "http://img.b2bpic.net/free-photo/young-activists-taking-action_23-2149502779.jpg",          alt: "Client profile 2"},
        {
          src: "http://img.b2bpic.net/free-photo/cheerful-man-virtual-glasses-front-new-house_493343-29857.jpg",          alt: "Client profile 3"},
        {
          src: "http://img.b2bpic.net/free-photo/blissful-tanned-woman-pajama-waving-hand-with-smile-amazing-caucasian-female-model-standing-balcony_197531-20975.jpg",          alt: "Client profile 4"},
        {
          src: "http://img.b2bpic.net/free-photo/two-smiling-architects-sit-table-discuss-new-project-modern-office-blue-print_482257-31149.jpg",          alt: "Client profile 5"},
      ]}
      avatarText="Trusted by over 500+ happy homeowners"
      marqueeItems={[
        {
          type: "text",          text: "Sustainable Design"},
        {
          type: "text-icon",          text: "Luxury Finishes",          icon: Sparkles,
        },
        {
          type: "text",          text: "Modern Living"},
        {
          type: "text-icon",          text: "Eco-Friendly",          icon: Leaf,
        },
        {
          type: "text",          text: "Custom Architectural"},
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={false}
      title="Our Architectural Philosophy"
      description="We believe architecture is about connection — between people, space, and nature. Every project starts with understanding your unique story and lifestyle needs."
      imageSrc="http://img.b2bpic.net/free-photo/male-analyst-looking-his-wristwatch_482257-115129.jpg"
    />
  </div>

  <div id="product" data-section="product">
      <ProductCardOne
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={true}
      products={[
        {
          id: "p1",          name: "1 Floor Design",          price: "Custom Pricing",          imageSrc: "http://img.b2bpic.net/free-photo/minimalist-architectural-building-details_23-2151870845.jpg"},
        {
          id: "p2",          name: "2 Floors Design",          price: "Custom Pricing",          imageSrc: "http://img.b2bpic.net/free-photo/facade-modern-new-building_23-2147694757.jpg"},
        {
          id: "p3",          name: "3 Floors Design",          price: "Custom Pricing",          imageSrc: "http://img.b2bpic.net/free-photo/neo-brutalism-inspired-building_23-2151004694.jpg"},
        {
          id: "p4",          name: "Urban Compact",          price: "Custom Pricing",          imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-modern-architectural-structure-with-glass-facade_181624-7458.jpg"},
        {
          id: "p5",          name: "Townhome Facade",          price: "Custom Pricing",          imageSrc: "http://img.b2bpic.net/free-photo/analog-city-landscape-with-buildings_23-2149661416.jpg"},
        {
          id: "p6",          name: "Custom Villa",          price: "Custom Pricing",          imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-building-munich-daytime_181624-22949.jpg"},
      ]}
      title="Choose Your Floor Plan"
      description="Select the building scale that fits your vision."
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyFour
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          id: "f1",          title: "Sustainable Design",          author: "Eco-Focus",          description: "We prioritize energy efficiency and natural light integration.",          tags: [
            "Sustainable",            "Green"],
          imageSrc: "http://img.b2bpic.net/free-photo/3d-model-residential-building_23-2150761200.jpg"},
        {
          id: "f2",          title: "Bespoke Details",          author: "Artisan Craft",          description: "Curating every material and finish for a unique home.",          tags: [
            "Custom",            "Detail"],
          imageSrc: "http://img.b2bpic.net/free-photo/architect-showing-miniature-projects_23-2148242924.jpg"},
        {
          id: "f3",          title: "Space Optimization",          author: "Smart Layout",          description: "Maximize functionality without sacrificing aesthetics.",          tags: [
            "Efficiency",            "Smart"],
          imageSrc: "http://img.b2bpic.net/free-photo/building-house-with-digital-tools_1048-2861.jpg"},
      ]}
      title="Design Principles"
      description="Our core approach to delivering high-quality architectural solutions."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardSeven
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={true}
      metrics={[
        {
          id: "m1",          value: "150+",          title: "Projects Completed",          items: [
            "Residential",            "Commercial"],
        },
        {
          id: "m2",          value: "12",          title: "Years Experience",          items: [
            "Design",            "Build"],
        },
        {
          id: "m3",          value: "98%",          title: "Client Satisfaction",          items: [
            "High",            "Rating"],
        },
      ]}
      title="Our Impact"
      description="Proven experience in delivering residential projects."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTwo
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",          name: "Client 1",          role: "Homeowner",          testimonial: "Professional and high-quality results.",          imageSrc: "http://img.b2bpic.net/free-photo/two-architects-working-together-looking-tablet-with-blueprints-sitting-desk-modern-architectural-office-project-engineers-doing-teamwork-using-digital-device-table-with-scale-model_482257-37779.jpg"},
        {
          id: "2",          name: "Client 2",          role: "Homeowner",          testimonial: "Seamless project management.",          imageSrc: "http://img.b2bpic.net/free-photo/real-estate-office-scene_23-2147653306.jpg"},
        {
          id: "3",          name: "Client 3",          role: "Homeowner",          testimonial: "Excellent creative vision.",          imageSrc: "http://img.b2bpic.net/free-photo/having-short-rest-with-coffee_1098-17055.jpg"},
        {
          id: "4",          name: "Client 4",          role: "Homeowner",          testimonial: "They listened to our needs perfectly.",          imageSrc: "http://img.b2bpic.net/free-photo/lovely-woman-smiling-medium-shot_23-2148329361.jpg"},
        {
          id: "5",          name: "Client 5",          role: "Homeowner",          testimonial: "Beautiful design, delivered on time.",          imageSrc: "http://img.b2bpic.net/free-photo/senior-couple-dancing-home_23-2149891092.jpg"},
      ]}
      title="Client Stories"
      description="What our clients are saying about their homes."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="split"
      useInvertedBackground={true}
      faqs={[
        {
          id: "q1",          title: "How long is the design phase?",          content: "Typically 3-6 months depending on project scope."},
        {
          id: "q2",          title: "Can you handle permits?",          content: "Yes, we handle all municipal permitting requirements."},
        {
          id: "q3",          title: "What's the first step?",          content: "Schedule an initial discovery consultation with us."},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/hands-engineer-working-blueprint-construction-concept-engineering-tools-vintage-tone-retro-filter-effect-soft-focus-selective-focus_1418-481.jpg"
      mediaAnimation="slide-up"
      title="Common Questions"
      description="Everything you need to know about our process."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      text="Ready to design your dream project?"
      buttons={[
        {
          text: "Consult Today",          href: "#"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      imageSrc="http://img.b2bpic.net/free-photo/modern-skyscraper-with-blank-billboard-mockup_9975-133602.jpg"
      logoText="ArchStudio"
      columns={[
        {
          title: "Links",          items: [
            {
              label: "About",              href: "#about"},
            {
              label: "Projects",              href: "#product"},
          ],
        },
        {
          title: "Legal",          items: [
            {
              label: "Privacy",              href: "#"},
            {
              label: "Terms",              href: "#"},
          ],
        },
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
