"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Brush, Hammer, Droplet, Layout, Heart, Award } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="small"
      sizing="largeSmallSizeMediumTitles"
      background="fluid"
      cardStyle="subtle-shadow"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="GreenScape Designs"
          navItems={[
            { name: "Home", id: "#home" },
            { name: "About", id: "#about" },
            { name: "Services", id: "#services" },
            { name: "Portfolio", id: "#portfolio" },
            { name: "Testimonials", id: "#testimonials" },
            { name: "FAQ", id: "#faq" },
            { name: "Contact", id: "#contact" }
          ]}
          button={{
            text: "Get a Quote",            href: "#contact"
          }}
        />
      </div>
      <div id="home" data-section="home">
        <HeroBillboardGallery
          title="Your Vision, Our Landscape Expertise"
          description="Transforming outdoor spaces into breathtaking havens of beauty and functionality. Let's create your dream garden."
          background={{
            variant: "plain"
          }}
          buttons={[
            { text: "Explore Services", href: "#services" },
            { text: "Get a Free Quote", href: "#contact" }
          ]}
          mediaItems={[
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EdYnn8XEUI1Sk0pCjZw28lC9Td/uploaded-1780510268768-01ztemdd.jpg", imageAlt: "Paved backyard area" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EdYnn8XEUI1Sk0pCjZw28lC9Td/uploaded-1780510268768-vrghs2cn.jpg", imageAlt: "Outdoor patio under construction" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EdYnn8XEUI1Sk0pCjZw28lC9Td/uploaded-1780510268768-qciec46z.jpg", imageAlt: "Landscape project overview" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EdYnn8XEUI1Sk0pCjZw28lC9Td/uploaded-1780510268768-jfmyudit.jpg", imageAlt: "Side pathway paving" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EdYnn8XEUI1Sk0pCjZw28lC9Td/uploaded-1780510268768-7wg873fb.jpg", imageAlt: "Front yard paving and hedge" },
            { imageSrc: "http://img.b2bpic.net/free-photo/stone-path-with-grass-growing-up_1137-86.jpg", imageAlt: "Modern patio design" }
          ]}
          mediaAnimation="slide-up"
          tagAnimation="none"
          buttonAnimation="none"
        />
      </div>
      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            { type: "text", content: "Crafting Unique Outdoor Experiences" }
          ]}
          useInvertedBackground={true}
          buttons={[
            { text: "Learn More About Us", href: "#" }
          ]}
          buttonAnimation="none"
        />
      </div>
      <div id="services" data-section="services">
        <FeatureCardTwentyFive
          animationType="slide-up"
          title="Our Specialized Landscape Services"
          description="From initial concept to meticulous execution, we offer a full spectrum of services to bring your outdoor vision to life."
          textboxLayout="default"
          useInvertedBackground={false}
          features={[
            { title: "Innovative Garden Design", description: "Creating custom garden layouts that reflect your personal style and enhance your property's aesthetic and value.", icon: Brush, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/anime-style-house-structure_23-2151064746.jpg", imageAlt: "3D rendering of a modern garden design" }, { imageSrc: "http://img.b2bpic.net/free-photo/plus-sign-made-green-grass-flower-isolated_169016-57358.jpg", imageAlt: "Overhead layout plan of a garden" }] },
            { title: "Expert Hardscaping & Paving", description: "Designing and installing beautiful, durable patios, walkways, and retaining walls using premium materials.", icon: Hammer, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/beautiful-stone-path-walk-run-garden_74190-8974.jpg", imageAlt: "Modern patio with interlock pavers" }, { imageSrc: "http://img.b2bpic.net/free-photo/stone-path-way-garden_74190-3631.jpg", imageAlt: "Curved garden pathway with natural stone" }] },
            { title: "Tranquil Water Features", description: "Integrating stunning water elements like ponds, fountains, and waterfalls to create serene and captivating focal points.", icon: Droplet, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/fountains-garden_1361-140.jpg", imageAlt: "Serene koi pond with lush greenery" }, { imageSrc: "http://img.b2bpic.net/free-photo/beautiful-landscape_8327-110.jpg", imageAlt: "Modern garden fountain with flowing water" }] }
          ]}
          tagAnimation="none"
          buttonAnimation="none"
        />
      </div>
      <div id="portfolio" data-section="portfolio">
        <ProductCardTwo
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          title="Discover Our Signature Landscape Projects"
          description="Explore a selection of our completed projects, showcasing diverse styles and innovative solutions for every client."
          textboxLayout="default"
          useInvertedBackground={true}
          products={[
            { id: "project-1", brand: "Project Showcase", name: "Contemporary Garden Oasis", price: "Custom Quote", rating: 5, reviewCount: "12 reviews", imageSrc: "http://img.b2bpic.net/free-photo/young-female-ballerina-dancing-indoors-botanical-garden_23-2149344147.jpg", imageAlt: "Sleek contemporary garden with minimalist design" },
            { id: "project-2", brand: "Project Showcase", name: "Classic Traditional Landscape", price: "Custom Quote", rating: 5, reviewCount: "8 reviews", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-stone-building-with-lovely-yard-blue-sky-punta-de-lobos-chile_181624-13685.jpg", imageAlt: "Elegant traditional garden with formal hedges" },
            { id: "project-3", brand: "Project Showcase", name: "Sustainable Xeriscape Design", price: "Custom Quote", rating: 5, reviewCount: "15 reviews", imageSrc: "http://img.b2bpic.net/free-photo/flowerpots-old-suitcase_23-2147997133.jpg", imageAlt: "Drought-tolerant garden with desert plants" },
            { id: "project-4", brand: "Project Showcase", name: "Urban Rooftop Oasis", price: "Custom Quote", rating: 5, reviewCount: "10 reviews", imageSrc: "http://img.b2bpic.net/free-photo/bird-s-eye-view-shanghai_1127-4006.jpg", imageAlt: "Green rooftop garden with city views" },
            { id: "project-5", brand: "Project Showcase", name: "Playful Children's Garden", price: "Custom Quote", rating: 5, reviewCount: "7 reviews", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-plants-flowers_23-2151936171.jpg", imageAlt: "Colorful and engaging children's play garden" },
            { id: "project-6", brand: "Project Showcase", name: "Serene Zen Retreat", price: "Custom Quote", rating: 5, reviewCount: "9 reviews", imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-spa-stones-shells-outdoors_23-2148268413.jpg", imageAlt: "Peaceful Japanese zen garden with raked sand" }
          ]}
          tagAnimation="none"
          buttonAnimation="none"
        />
      </div>
      <div id="metrics" data-section="metrics">
        <MetricCardOne
          metrics={[
            { id: "m1", value: "150+", title: "Projects Completed", description: "Successfully transforming outdoor spaces for a diverse clientele.", icon: Layout },
            { id: "m2", value: "98%", title: "Client Satisfaction", description: "Our commitment to excellence ensures every client is thrilled with their new landscape.", icon: Heart },
            { id: "m3", value: "10+", title: "Years of Experience", description: "Bringing a decade of expertise and passion to every design and installation.", icon: Award }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          title="Achievements & Client Satisfaction"
          description="Proudly delivering exceptional landscape solutions, reflected in our growing portfolio and happy clients."
          textboxLayout="default"
          useInvertedBackground={false}
          tagAnimation="none"
          buttonAnimation="none"
        />
      </div>
      <div id="team" data-section="team">
        <TeamCardOne
          members={[
            { id: "t1", name: "Elara Vance", role: "Lead Landscape Designer", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-woman-working_23-2149721891.jpg", imageAlt: "Portrait of Elara Vance" },
            { id: "t2", name: "Marcus Thorne", role: "Horticultural Specialist", imageSrc: "http://img.b2bpic.net/free-photo/senior-man-working-field-with-plants_329181-12484.jpg", imageAlt: "Portrait of Marcus Thorne" },
            { id: "t3", name: "Sophia Chen", role: "Project Manager", imageSrc: "http://img.b2bpic.net/free-photo/image-cute-young-woman-park_197531-33359.jpg", imageAlt: "Portrait of Sophia Chen" }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          title="Meet Our Talented Landscape Team"
          description="Our dedicated professionals bring passion, creativity, and expertise to every project, ensuring stunning and sustainable results."
          textboxLayout="default"
          useInvertedBackground={true}
          tagAnimation="none"
          buttonAnimation="none"
        />
      </div>
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTen
          testimonials={[
            { id: "test-1", title: "A Dream Garden Brought to Life", quote: "GreenScape Designs transformed our chaotic backyard into a tranquil oasis. Their attention to detail and creative vision exceeded all our expectations. We spend every evening on our new patio!", name: "Sarah & Tom H.", role: "Homeowners, Suburbia", imageSrc: "http://img.b2bpic.net/free-photo/adorable-senior-couple-having-picnic-outdoors_23-2149109380.jpg", imageAlt: "Happy senior couple in their garden" },
            { id: "test-2", title: "Outstanding Professionalism", quote: "The team at GreenScape Designs was incredibly professional from start to finish. They listened to our ideas, offered insightful suggestions, and delivered a stunning, child-friendly garden.", name: "Emily R.", role: "Busy Parent, Cityville", imageSrc: "http://img.b2bpic.net/free-photo/family-with-little-son-autumn-park_1157-36432.jpg", imageAlt: "Young family playing in their garden" },
            { id: "test-3", title: "Enhanced Our Commercial Property", quote: "Our office complex desperately needed a landscape refresh. GreenScape Designs delivered a contemporary, low-maintenance solution that truly elevated our property's curb appeal. Highly recommended!", name: "David L.", role: "Property Manager, Business Park", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-holding-digital-tablet-standing-outdoor_23-2147862770.jpg", imageAlt: "Business owner standing in front of commercial garden" },
            { id: "test-4", title: "Beyond My Wildest Dreams", quote: "I had a vague idea of what I wanted, but GreenScape Designs took it and created something beyond my wildest dreams. Every plant, every stone, perfectly placed. It's truly a work of art.", name: "Jessica M.", role: "Enthusiastic Gardener", imageSrc: "http://img.b2bpic.net/free-photo/rustic-patio-furniture-house-deck-with-vegetation_23-2150698290.jpg", imageAlt: "Woman smiling in her beautiful garden" },
            { id: "test-5", title: "Efficient and Beautiful Results", quote: "The entire process was smooth and efficient. The team was respectful of our space and timeline, and the final result is simply gorgeous. Our neighbors can't stop complimenting our new yard!", name: "Michael S.", role: "Homeowner, Lakeside", imageSrc: "http://img.b2bpic.net/free-photo/pretty-woman-cute-clothes-reaching-plants-greenhouse_197531-12331.jpg", imageAlt: "Man relaxing on modern patio" }
          ]}
          title="What Our Clients Say"
          description="Hear from homeowners and businesses who have transformed their outdoor spaces with GreenScape Designs."
          textboxLayout="default"
          useInvertedBackground={false}
          tagAnimation="none"
          buttonAnimation="none"
        />
      </div>
      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          names={[
            "EcoBuild Developments",            "Urban Oasis Corp",            "Serenity Hotels",            "TerraForm Industries",            "GreenThumb Nurseries",            "Habitat Solutions",            "Bloomfield Estates"
          ]}
          title="Trusted by Leading Brands & Homeowners"
          description="Our commitment to excellence in landscape design has earned us the trust of a diverse clientele and respected partners."
          textboxLayout="default"
          useInvertedBackground={true}
          tagAnimation="none"
          buttonAnimation="none"
        />
      </div>
      <div id="faq" data-section="faq">
        <FaqSplitMedia
          faqs={[
            { id: "faq-1", title: "What is your landscape design process?", content: "Our process begins with an initial consultation to understand your vision, followed by site analysis, conceptual design, detailed planning, and finally, professional installation and ongoing care recommendations." },
            { id: "faq-2", title: "How long does a typical project take?", content: "Project timelines vary greatly depending on the scope and complexity. Small projects might take a few weeks, while larger, custom designs could span several months. We provide a detailed timeline during the planning phase." },
            { id: "faq-3", title: "Do you offer maintenance services?", content: "While our primary focus is design and installation, we can connect you with trusted partners for ongoing garden and landscape maintenance to ensure your outdoor space remains beautiful year-round." },
            { id: "faq-4", title: "What is the cost of landscape design?", content: "Costs depend on many factors including project size, materials chosen, and design complexity. We offer transparent pricing and provide a detailed quote after the initial consultation and conceptual design phase." }
          ]}
          mediaAnimation="slide-up"
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          title="Frequently Asked Questions"
          description="Find answers to common questions about our landscape design process, services, and commitment to creating beautiful outdoor spaces."
          imageSrc="http://img.b2bpic.net/free-photo/young-couple-celebrating-engagement_23-2149401309.jpg"
          imageAlt="Person reviewing landscape design plans"
          tagAnimation="none"
          buttonAnimation="none"
        />
      </div>
      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Get Started"
          title="Start Your Landscape Transformation Today"
          description="Ready to discuss your outdoor project? Get in touch with our design team for a personalized consultation and let's bring your dream garden to life."
          background={{
            variant: "plain"
          }}
          useInvertedBackground={true}
          mediaAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-photo/people-working-tech-brand-together_23-2150966144.jpg"
          imageAlt="Landscape designer meeting with a client outdoors"
          inputPlaceholder="Enter your email"
          buttonText="Send Inquiry"
          termsText="By sending an inquiry, you agree to our Terms and Conditions and Privacy Policy."
          mediaPosition="right"
          tagAnimation="none"
        />
      </div>
      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="http://img.b2bpic.net/free-photo/hotel-pool-resort_74190-1648.jpg"
          imageAlt="Aerial view of a beautifully landscaped garden"
          logoText="GreenScape Designs"
          columns={[
            { title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "Our Team", href: "#team" }, { label: "Careers", href: "#" }] },
            { title: "Services", items: [{ label: "Garden Design", href: "#services" }, { label: "Hardscaping", href: "#services" }, { label: "Water Features", href: "#services" }] },
            { title: "Resources", items: [{ label: "FAQ", href: "#faq" }, { label: "Blog", href: "#" }, { label: "Testimonials", href: "#testimonials" }] },
            { title: "Contact", items: [{ label: "Get a Quote", href: "#contact" }, { label: "Email Us", href: "mailto:info@greenscapedesigns.com" }, { label: "Call Us", href: "tel:+1234567890" }] }
          ]}
          copyrightText="© 2024 GreenScape Designs. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}