"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 FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="bounce-effect"
        defaultTextAnimation="reveal-blur"
        borderRadius="soft"
        contentWidth="compact"
        sizing="mediumLarge"
        background="noise"
        cardStyle="soft-shadow"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="glass"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",          id: "hero"},
        {
          name: "About",          id: "about"},
        {
          name: "Work",          id: "work"},
        {
          name: "Contact",          id: "contact"},
      ]}
      brandName="Mahdiyar Kavosi"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplit
      background={{
        variant: "rotated-rays-static"}}
      title="Mahdiyar Kavosi: Crafting Intuitive Digital Experiences"
      description="Professional UI/UX Designer dedicated to merging aesthetics with functional clarity. I transform complex business goals into seamless, human-centric design solutions."
      buttons={[
        {
          text: "View Projects",          href: "#work"},
        {
          text: "Contact Me",          href: "#contact"},
      ]}
      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUHkBzmRH9JJegWRVCDEk52nZ8/uploaded-1778329984159-c01kfan8.jpg?_wi=1"
      imageAlt="Mahdiyar Kavosi Professional Portrait"
      mediaAnimation="slide-up"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/businesswoman-happy-be-back-work_23-2148727621.jpg",          alt: "Client 1"},
        {
          src: "http://img.b2bpic.net/free-photo/confident-entrepreneur-looking-camera-with-arms-folded-smiling_1098-18840.jpg",          alt: "Client 2"},
        {
          src: "http://img.b2bpic.net/free-photo/portrait-smiling-man-white-shirt_23-2152009539.jpg",          alt: "Client 3"},
        {
          src: "http://img.b2bpic.net/free-photo/business-man-banner-concept-with-copy-space_23-2149601461.jpg",          alt: "Client 4"},
        {
          src: "http://img.b2bpic.net/free-photo/closeup-portrait-successful-confident-young-woman-start-career-look-determined-get-job-waiting-interview-lean-glass-wall-business-center-smiling-looking-away-satisfied_197531-30572.jpg",          alt: "Client 5"},
      ]}
      avatarText="Trusted by 150+ global clients"
      marqueeItems={[
        {
          type: "text",          text: "User Experience Design"},
        {
          type: "text",          text: "Product Strategy"},
        {
          type: "text",          text: "Design Systems"},
        {
          type: "text",          text: "Accessibility Audit"},
        {
          type: "text",          text: "Prototyping"},
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={true}
      title="Designing for the Future"
      description="With a keen eye for detail and user behavior, I specialize in end-to-end design solutions. From initial research to high-fidelity prototyping, my process is rooted in accessibility and performance. I believe good design is invisible."
      imageSrc="http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443520.jpg?_wi=1"
      imageAlt="Professional UI UX Workspace"
    />
  </div>

  <div id="work" data-section="work">
      <FeatureCardSix
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          title: "Fintech Platform Redesign",          description: "Boosted retention by 35% via fintech platform redesign, streamlining navigation for optimal user engagement.",          imageSrc: "http://img.b2bpic.net/free-photo/fashion-designer-working-design_53876-144822.jpg?_wi=1",          imageAlt: "Fintech UI"},
        {
          title: "SaaS Dashboard Systems",          description: "Increased operational efficiency by 25% through scalable design systems that ensure brand consistency and seamless developer workflows.",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-asian-woman-student-park-sits-bench-with-digital-tablet-pen-thinking-looking_1258-151492.jpg?_wi=1",          imageAlt: "SaaS Dashboard"},
        {
          title: "Mobile App Accessibility",          description: "Achieved 100% WCAG compliance by auditing and redesigning inclusive mobile experiences to serve a global, diverse user base.",          imageSrc: "http://img.b2bvector/electronic-accessibility-abstract-concept-vector-illustration-accessibility-websites-electronic-device-disabled-people-communication-technology-adjustable-web-pages-abstract-metaphor_335657-1917.jpg?_wi=1",          imageAlt: "Mobile Accessibility"},
      ]}
      title="Portfolio Highlights"
      description="A curated selection of my work across various industries, showcasing rigorous user research, iterative prototyping, and aesthetic design systems."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardEleven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      metrics={[
        {
          id: "m1",          value: "150+",          title: "Projects Completed",          description: "End-to-end designs delivered",          imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-optical-illusion_23-2150854147.jpg"},
        {
          id: "m2",          value: "40%",          title: "Conversion Boost",          description: "Average increase across apps",          imageSrc: "http://img.b2bpic.net/free-photo/business-corporate-people-working-concept_53876-167075.jpg"},
        {
          id: "m3",          value: "5M+",          title: "Users Reached",          description: "Global scale applications",          imageSrc: "http://img.b2bpic.net/free-photo/geometric-abstract-background-technology-concept-connecting-dots-design_53876-153353.jpg"},
      ]}
      title="Impact by Numbers"
      description="Measurable results delivered through strategic design interventions."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",          name: "Sarah Chen",          date: "2024",          title: "CEO, TechFlow",          quote: "Mahdiyar's ability to simplify complex systems is unparalleled.",          tag: "Expert",          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-man-white-shirt_23-2152009542.jpg",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUHkBzmRH9JJegWRVCDEk52nZ8/uploaded-1778329984159-c01kfan8.jpg?_wi=2",          imageAlt: "professional portrait man"},
        {
          id: "t2",          name: "Marcus Thorne",          date: "2023",          title: "Product Lead, Innovate",          quote: "A true professional who understands user needs deeply.",          tag: "Collaborator",          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-sensual-blonde-business-woman-dressed-formal-suit-blue-shirt-standing-with-crossed-arms-studio-isolated-dark-background_613910-6353.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443520.jpg?_wi=2",          imageAlt: "professional portrait man"},
        {
          id: "t3",          name: "Elena Ross",          date: "2024",          title: "Design Director",          quote: "The cleanest design system work I have ever encountered.",          tag: "Lead",          avatarSrc: "http://img.b2bpic.net/free-photo/business-man-curly-cute-handsome-guy-black-suit-red-tie-glasses-with-crossed-hands_140725-162616.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/fashion-designer-working-design_53876-144822.jpg?_wi=2",          imageAlt: "professional portrait man"},
        {
          id: "t4",          name: "David Kim",          date: "2023",          title: "Founder, StartupXYZ",          quote: "Increased our mobile engagement rates significantly.",          tag: "Partner",          avatarSrc: "http://img.b2bpic.net/free-photo/young-woman-suit-standing-by-scooter_1303-11932.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-asian-woman-student-park-sits-bench-with-digital-tablet-pen-thinking-looking_1258-151492.jpg?_wi=2",          imageAlt: "professional portrait man"},
        {
          id: "t5",          name: "Julia V.",          date: "2024",          title: "Operations",          quote: "Mahdiyar is a master of accessibility-first design.",          tag: "Client",          avatarSrc: "http://img.b2bpic.net/free-photo/handsome-business-man-wearing-suit-looking-camera-smiling-broadly-with-happy-face-standing-white-background_141793-54115.jpg",          imageSrc: "http://img.b2bvector/electronic-accessibility-abstract-concept-vector-illustration-accessibility-websites-electronic-device-disabled-people-communication-technology-adjustable-web-pages-abstract-metaphor_335657-1917.jpg?_wi=2",          imageAlt: "professional portrait man"},
      ]}
      title="Client Feedback"
      description="Don't just take my word for it—hear from the partners I've collaborated with."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="split"
      useInvertedBackground={true}
      faqs={[
        {
          id: "q1",          title: "What is your primary design tool?",          content: "I primarily work with Figma for high-fidelity prototyping and design systems."},
        {
          id: "q2",          title: "Do you work remotely?",          content: "Yes, I am fully equipped for global remote collaboration via Zoom and Slack."},
        {
          id: "q3",          title: "What's your typical process?",          content: "Discovery -> Research -> Wireframing -> Prototyping -> Testing -> Handoff."},
      ]}
      title="Frequently Asked"
      description="Common questions regarding my design process and collaboration styles."
      faqsAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/high-angle-measuring-tools-desk_23-2150440915.jpg"
      imageAlt="Design tools"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{
        variant: "sparkles-gradient"}}
      text="Ready to transform your digital presence? Let's talk design."
      buttons={[
        {
          text: "Start Your Project Today",          href: "mailto:hello@mahdiyarkavosi.com"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      columns={[
        {
          items: [
            {
              label: "Portfolio",              href: "#work"},
            {
              label: "About",              href: "#about"},
          ],
        },
        {
          items: [
            {
              label: "Contact",              href: "#contact"},
            {
              label: "Privacy Policy",              href: "#"},
          ],
        },
      ]}
      logoText="MK"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}