"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import MediaAbout from '@/components/sections/about/MediaAbout';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Crown, Eye, Feather, Heart, Infinity, Layers, Mail, Shield, Sparkles, Zap, Rocket, Palette, Lightbulb } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="compact"
      sizing="large"
      background="floatingGradient"
      cardStyle="inset"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="INFINIVIS"
          navItems={[
            { name: "SHOP", id: "products" },
            { name: "VISION", id: "features" },
            { name: "ABOUT", id: "about" },
            { name: "CONTACT", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardScroll
          title="BEYOND THE FRAME"
          description="Infinite Craft. Visionary Wear. DROP 01: THE ARCHITECTURAL SERIES. LIMITED QUANTITIES."
          background={{ variant: "plain" }}
          tag="IV-2026"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o0xyz6"
          imageAlt="Architectural Fashion Collection"
          buttons={[
            { text: "JOIN THE WAITLIST", href: "#contact" }
          ]}
          buttonAnimation="blur-reveal"
          ariaLabel="Infinivis Hero Section"
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="THE VISIONARY LABEL"
          description="Infinivis represents the convergence of precision engineering and artistic vision. Each garment is meticulously crafted using premium materials and innovative construction techniques. We believe that clothing should transcend trend—it should be timeless, architectural, and unapologetically bold. Our commitment to excellence extends beyond design into sustainable practices and ethical production."
          tag="PHILOSOPHY"
          tagIcon={Infinity}
          tagAnimation="opacity"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xru9b8"
          imageAlt="Detailed Craftsmanship"
          useInvertedBackground={false}
          buttons={[
            { text: "DISCOVER OUR STORY", href: "#features" }
          ]}
          buttonAnimation="slide-up"
          ariaLabel="About Infinivis"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardFour
          title="SIGNATURE COLLECTION"
          description="Explore our curated selection of architectural garments designed for the discerning eye. Each piece represents our commitment to precision, quality, and timeless elegance."
          tag="LIMITED EDITION"
          tagIcon={Crown}
          tagAnimation="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="asymmetric-60-wide-40-narrow"
          animationType="scale-rotate"
          products={[
            {
              id: "sculpted-coat",              name: "Sculpted Coat",              price: "$850",              variant: "Obsidian Matte",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7e1nru",              imageAlt: "Sculpted Architectural Coat"
            },
            {
              id: "raw-silk-pant",              name: "Raw Silk Pant",              price: "$420",              variant: "Pearl White",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6tdl9l",              imageAlt: "Premium Raw Silk Pants"
            },
            {
              id: "geometric-vest",              name: "Geometric Vest",              price: "$380",              variant: "Mercury Silver",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=fi4yq9",              imageAlt: "Geometric Structured Vest"
            }
          ]}
          buttons={[
            { text: "SHOP COLLECTION", href: "#contact" }
          ]}
          buttonAnimation="slide-up"
          ariaLabel="Product Collection"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureHoverPattern
          title="WHY INFINIVIS"
          description="Crafted with precision. Designed for the visionary. Every element of Infinivis embodies our core values and commitment to excellence."
          tag="EXCELLENCE"
          tagIcon={Zap}
          tagAnimation="slide-up"
          features={[
            {
              icon: Layers,
              title: "Architectural Precision",              description: "Every seam, every fold, every silhouette is engineered for perfection. Our garments are built to last generations."
            },
            {
              icon: Feather,
              title: "Premium Materials",              description: "Sourced from the finest suppliers worldwide. Raw silk, organic cotton, and innovative synthetics combine seamlessly."
            },
            {
              icon: Eye,
              title: "Visionary Design",              description: "Bold, forward-thinking aesthetics that challenge conventional fashion. Timeless meets cutting-edge."
            },
            {
              icon: Shield,
              title: "Ethical Craftsmanship",              description: "Sustainable practices and fair labor standards ensure every piece carries integrity and responsibility."
            },
            {
              icon: Infinity,
              title: "Limited Editions",              description: "Exclusivity by design. Each drop is carefully curated and produced in limited quantities for discerning collectors."
            },
            {
              icon: Sparkles,
              title: "Lifetime Support",              description: "Join the Infinivis circle. Lifetime repairs, exclusive previews, and access to our inner collection."
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          carouselMode="buttons"
          buttons={[
            { text: "LEARN MORE", href: "#testimonials" }
          ]}
          buttonAnimation="blur-reveal"
          ariaLabel="Features Section"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTen
          title="WORN BY VISIONARIES"
          description="Discover what our most discerning clients say about their Infinivis experience. Real stories from people who appreciate true craftsmanship."
          textboxLayout="default"
          useInvertedBackground={false}
          tag="TESTIMONIALS"
          tagIcon={Heart}
          tagAnimation="opacity"
          testimonials={[
            {
              id: "1",              title: "Pure Excellence",              quote: "Infinivis isn't just clothing—it's a philosophy. Each piece feels like wearing architecture. The attention to detail is unparalleled.",              name: "Sarah Chen",              role: "Creative Director",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xoo63p",              imageAlt: "professional portrait creative director woman confident"
            },
            {
              id: "2",              title: "Transformative Experience",              quote: "I've owned high-end fashion for decades. This is the first brand that genuinely surprised me. Every garment is a masterpiece.",              name: "Marcus Wellington",              role: "Art Collector",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7s08e5",              imageAlt: "professional portrait man art collector sophisticated"
            },
            {
              id: "3",              title: "Future of Fashion",              quote: "Infinivis represents what I believe fashion should be: timeless, innovative, and unapologetically bold. Absolutely captivating.",              name: "Elena Rodriguez",              role: "Fashion Critic",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ulixxl",              imageAlt: "professional portrait fashion critic woman confident"
            },
            {
              id: "4",              title: "Investment Pieces",              quote: "These pieces only get better with time. The craftsmanship justifies every penny. I've become a devoted collector.",              name: "James Mitchell",              role: "Entrepreneur",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qffp09",              imageAlt: "professional portrait entrepreneur businessman confident"
            },
            {
              id: "5",              title: "Architectural Beauty",              quote: "The geometric precision combined with luxurious materials creates something truly special. Infinivis is revolutionizing fashion.",              name: "Victoria Laurent",              role: "Architect",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9shk9h",              imageAlt: "professional portrait architect woman confident modern"
            },
            {
              id: "6",              title: "Beyond Expectations",              quote: "From the packaging to the fit, everything speaks luxury. This is what premium craftsmanship feels like in the modern era.",              name: "David Park",              role: "Luxury Consultant",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=0n1db6",              imageAlt: "professional portrait luxury consultant man confident"
            }
          ]}
          ariaLabel="Testimonials Section"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardNine
          title="ENTER THE CIRCLE"
          description="Choose how you engage with the Infinivis vision. Every tier unlocks exclusive access and unparalleled benefits."
          textboxLayout="default"
          useInvertedBackground={false}
          tag="MEMBERSHIP"
          tagIcon={Crown}
          tagAnimation="slide-up"
          animationType="scale-rotate"
          plans={[
            {
              id: "collector",              title: "Collector",              price: "FREE",              period: "forever",              features: [
                "Access to public collections",                "Pre-sale announcements",                "Newsletter & updates",                "Community forum access"
              ],
              button: {
                text: "JOIN NOW",                href: "#contact"
              },
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=1w0uao",              imageAlt: "luxury membership tier collector level fashion"
            },
            {
              id: "visionary",              title: "Visionary",              price: "$199",              period: "annually",              features: [
                "Everything in Collector",                "48-hour early access to drops",                "Exclusive color previews",                "Priority customer support",                "VIP event invitations"
              ],
              button: {
                text: "BECOME VISIONARY",                href: "#contact"
              },
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=r0wyxw",              imageAlt: "luxury premium membership visionary tier exclusive"
            },
            {
              id: "architect",              title: "Architect",              price: "$599",              period: "annually",              features: [
                "Everything in Visionary",                "72-hour early access",                "Custom commission consultations",                "Free lifetime repairs",                "Private showroom tours",                "Invitation-only drops"
              ],
              button: {
                text: "BECOME ARCHITECT",                href: "#contact"
              },
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=nhivnq",              imageAlt: "elite luxury membership architect highest tier"
            }
          ]}
          buttons={[
            { text: "VIEW ALL BENEFITS", href: "#contact" }
          ]}
          buttonAnimation="blur-reveal"
          ariaLabel="Pricing & Membership"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="JOIN THE WAITLIST"
          ctaDescription="Enter the Infinivis circle for early access to DROP 01. Only 500 founding members will be invited. Secure your exclusive spot today."
          ctaButton={{
            text: "SECURE YOUR SPOT",            href: "#"
          }}
          ctaIcon={Mail}
          useInvertedBackground={false}
          animationType="slide-up"
          accordionAnimationType="smooth"
          showCard={true}
          faqs={[
            {
              id: "1",              title: "What makes Infinivis different?",              content: "Infinivis combines architectural precision with visionary design. Every piece is engineered for timelessness, not trend. We prioritize quality over quantity, ethical production, and exclusivity. Our approach redefines what luxury fashion can be."
            },
            {
              id: "2",              title: "How do you ensure quality?",              content: "Every garment undergoes rigorous quality control. We source premium materials from trusted suppliers and employ master craftspeople. Our average production time per piece is 3-4 weeks to ensure perfection. Each item is inspected multiple times before shipping."
            },
            {
              id: "3",              title: "What is a 'Drop'?",              content: "Drops are limited-edition collections released on a seasonal or bi-annual schedule. Each drop is carefully curated with a specific theme or story. DROP 01 focuses on architectural silhouettes and raw materials. Every drop is designed to be collectible."
            },
            {
              id: "4",              title: "Do you offer custom commissions?",              content: "Custom commissions are exclusively available to our Architect tier members. Contact us to discuss your vision, and our design team will create a bespoke piece tailored to your specifications. We bring your unique aesthetic to life."
            },
            {
              id: "5",              title: "What is your return policy?",              content: "We offer a 60-day return window for all pieces in original condition. Infinivis members receive lifetime free repairs and exchanges for any defects in craftsmanship. We stand behind every piece we create."
            },
            {
              id: "6",              title: "How can I stay updated?",              content: "Join our waitlist to receive exclusive previews, early drop access, and founding member benefits. Subscribers are notified 48 hours before public availability. You'll be part of an exclusive community of visionaries."
            }
          ]}
          ariaLabel="Contact and FAQ"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=j8mqea"
          imageAlt="Infinivis Craftsmanship"
          logoText="INFINIVIS"
          copyrightText="© 2026 | INFINIVIS | INFINITE CRAFT. VISIONARY WEAR."
          columns={[
            {
              title: "SHOP",              items: [
                { label: "Collections", href: "#products" },
                { label: "Drops", href: "#" },
                { label: "Archive", href: "#" },
                { label: "Waitlist", href: "#contact" }
              ]
            },
            {
              title: "COMPANY",              items: [
                { label: "About Us", href: "#about" },
                { label: "Philosophy", href: "#features" },
                { label: "Sustainability", href: "#" },
                { label: "Press", href: "#" }
              ]
            },
            {
              title: "SUPPORT",              items: [
                { label: "Contact Us", href: "#contact" },
                { label: "FAQ", href: "#contact" },
                { label: "Returns", href: "#" },
                { label: "Care Guide", href: "#" }
              ]
            },
            {
              title: "CIRCLE",              items: [
                { label: "Membership", href: "#pricing" },
                { label: "VIP Events", href: "#" },
                { label: "Community", href: "#" },
                { label: "Careers", href: "#" }
              ]
            }
          ]}
          ariaLabel="Site footer"
        />
      </div>
    </ThemeProvider>
  );
}