"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import { CalendarDays } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="icon-arrow"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="medium"
        sizing="largeSizeMediumTitles"
        background="aurora"
        cardStyle="soft-shadow"
        primaryButtonStyle="shadow"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "About",          id: "#about"},
        {
          name: "Services",          id: "#services"},
        {
          name: "Work",          id: "#portfolio"},
        {
          name: "Results",          id: "#results"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      button={{
        text: "Book a Call",        href: "https://calendly.com/mjsn/30mins"}}
      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ez7srKw0Muaa70ZMY6lLLNlrAg/uploaded-1781169772954-vlkbzdzz.png"
      logoAlt="MJSN Agency Logo"
      brandName="MJSN"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroOverlayTestimonial
      title="We Scale Brands Across Egypt · GCC · Europe"
      description="Performance marketing agency powered by data, creativity, and AI-enhanced workflows."
      testimonials={[
        {
          name: "Strategic Insight",          handle: "Growth",          testimonial: "Expert analysis and innovative solutions for measurable growth.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-103638.jpg"},
        {
          name: "Creative Edge",          handle: "Innovation",          testimonial: "Captivating campaigns that resonate and convert across diverse markets.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/variety-gradient-forms-copy-space-surface-bubbles_23-2148290143.jpg"},
        {
          name: "AI-Powered",          handle: "Efficiency",          testimonial: "Advanced AI tools streamline workflows and maximize campaign performance.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/black-yellow-marble-textured_53876-94546.jpg"},
        {
          name: "Market Acumen",          handle: "Precision",          testimonial: "Targeted strategies with deep understanding of local and international nuances.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/abstract-brown-gradient-well-used-as-background-product-display_1258-88216.jpg"},
        {
          name: "Results Driven",          handle: "Impact",          testimonial: "Consistently delivering measurable ROI and substantial brand growth.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-concept_1194-617406.jpg"},
      ]}
      tag="Now Booking — 2026"
      tagIcon={CalendarDays}
      buttons={[
        {
          text: "Book a Strategy Call",          href: "https://calendly.com/mjsn/30mins"},
        {
          text: "View Our Work",          href: "#portfolio"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/abstract-neon-lights-background_1017-2666.jpg"
      imageAlt="Cinematic background of a data visualization hub for performance marketing"
      showDimOverlay={true}
      showBlur={true}
      textPosition="bottom"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/handsome-muscular-young-man-posing_158595-3045.jpg",          alt: "Satisfied client avatar 1"},
        {
          src: "http://img.b2bpic.net/free-photo/medium-shot-woman-working-as-lawyer_23-2151152058.jpg",          alt: "Satisfied client avatar 2"},
        {
          src: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background-glasses_158538-9601.jpg",          alt: "Satisfied client avatar 3"},
        {
          src: "http://img.b2bpic.net/free-photo/digital-art-portrait-person-listening-music-headphones_23-2151065048.jpg",          alt: "Satisfied client avatar 4"},
        {
          src: "http://img.b2bpic.net/free-photo/futuristic-fantasy-portrait-with-costume_23-2151159116.jpg",          alt: "Satisfied client avatar 5"},
      ]}
      avatarText="Join 150+ thriving brands"
    />
  </div>

  <div id="marquee" data-section="marquee">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "Paid Ads",        "SEO",        "Branding",        "Meta Ads",        "TikTok",        "AI Automation",        "Lead Gen",        "Web Dev",        "Content",        "GCC",        "Egypt",        "Europe"]}
      speed={60}
      showCard={false}
      title="" /* Added missing prop */
      description="" /* Added missing prop */
    />
  </div>

  <div id="about" data-section="about">
      <MetricSplitMediaAbout
      useInvertedBackground={true}
      title="Unlocking Your Global Potential"
      description="MJSN is a Cairo-based performance marketing agency with a global outlook. We combine deep Arabic-native content expertise with European-level execution standards, powered by AI-enhanced workflows. Our experience spans across diverse markets including the UAE, GCC, and broader Europe, ensuring your brand resonates with precision and impact."
      metrics={[
        {
          value: "Egypt",          title: "Home Market"},
        {
          value: "GCC",          title: "Key Expansion"},
        {
          value: "Europe",          title: "Global Reach"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/map-svalbard-jan-mayen-gold-glitter-map-dark-background_559531-10667.jpg"
      imageAlt="Stylized map connecting Egypt, GCC, and Europe"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="services" data-section="services">
      <FeatureCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      carouselMode="buttons"
      features={[
        {
          title: "Paid Advertising",          description: "Meta, Google, & TikTok ad campaigns optimized for maximum ROI.",          imageSrc: "http://img.b2bpic.net/free-photo/line-graph-data-analysis-icon_53876-20801.jpg"},
        {
          title: "Social Media Marketing",          description: "Engaging strategies to build community and amplify your brand voice.",          imageSrc: "http://img.b2bpic.net/free-photo/3d-render-hand-holding-gold-stars-business-concept_107791-15942.jpg"},
        {
          title: "SEO",          description: "Boost your organic visibility and rank higher in search results.",          imageSrc: "http://img.b2bpic.net/free-photo/3d-render-25th-years-anniversary-celebration-pen-tool-created-clipping-path-included-jpeg-easy-composite_460848-12250.jpg"},
        {
          title: "Web Development",          description: "Crafting high-performance websites and landing pages that convert.",          imageSrc: "http://img.b2bpic.net/free-vector/creative-web-design-25-line-filled-icon-pack-such-as-internet-computer-design-web-design_1142-23177.jpg"},
        {
          title: "Branding & Identity",          description: "Develop a distinct brand voice and visual identity that captivates.",          imageSrc: "http://img.b2bpic.net/free-photo/open-book-icon-symbol-yellow-background-education-bookstore-concept-3d-rendering_56104-1334.jpg"},
        {
          title: "Influencer Marketing",          description: "Connect with key opinion leaders to expand your market reach.",          imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-black-white-geometric-background_23-2150853661.jpg"},
        {
          title: "Content Creation",          description: "From captivating visuals to persuasive copy, we tell your story.",          imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-flat-design-bookstore-logo-template_23-2149336469.jpg"},
        {
          title: "AI Automation & Workflows",          description: "Streamline operations and enhance campaign efficiency with AI.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-data-center-worker-pointing-finger-ai-tech-pc-screen_482257-128444.jpg"},
        {
          title: "Lead Generation Funnels",          description: "Build high-converting funnels to capture and nurture valuable leads.",          imageSrc: "http://img.b2bpic.net/free-vector/cardano-blockchain-cryptocurrency-icon-vector-gold-open-source-finance-concept_53876-126028.jpg"},
      ]}
      title="Our Core Services"
      description="Comprehensive performance marketing solutions tailored to drive your brand's growth."
    />
  </div>

  <div id="results" data-section="results">
      <MetricCardFourteen
      useInvertedBackground={true}
      title="Our Impact at a Glance"
      tag="Proven Performance"
      metrics={[
        {
          id: "m1",          value: "30K+ AED",          description: "Ad Budgets Managed"},
        {
          id: "m2",          value: "22%",          description: "Lead-to-Sale Conversion Rate"},
        {
          id: "m3",          value: "18%",          description: "CPL Reduction QoQ"},
        {
          id: "m4",          value: "1.4M+",          description: "Social Media Views"},
        {
          id: "m5",          value: "Egypt · GCC · Europe",          description: "Markets Served"},
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="portfolio" data-section="portfolio">
      <ProductCardTwo
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="four-items-2x2-equal-grid"
      useInvertedBackground={false}
      carouselMode="buttons"
      products={[
        {
          id: "cs1",          brand: "QuickPlus + Ajman Free Zone",          name: "Lead Gen & Meta Ads",          price: "MENA Market",          rating: 5,
          reviewCount: "High Conversion",          imageSrc: "http://img.b2bpic.net/free-photo/woman-wearing-muslim-hijab-asking-union-holding-banner-with-united-stand-message-serious-face-thinking-about-question-very-confused-idea_839833-20662.jpg",          imageAlt: "QuickPlus Ajman Free Zone Case Study"},
        {
          id: "cs2",          brand: "Pink Musée",          name: "K-Beauty E-commerce Growth",          price: "Shopify, Social Media",          rating: 5,
          reviewCount: "Increased Engagement",          imageSrc: "http://img.b2bpic.net/free-photo/market-trends-concept-with-laptop_23-2150372444.jpg",          imageAlt: "Pink Musée K-Beauty E-commerce Case Study"},
        {
          id: "cs3",          brand: "Gold Avenue",          name: "Precious Metals Investment",          price: "Saudi Arabia, Bilingual Ads",          rating: 5,
          reviewCount: "Strong ROI",          imageSrc: "http://img.b2bpic.net/free-photo/3d-render-low-poly-plexus-design-shallow-depth-field-modern-communication_1048-12682.jpg",          imageAlt: "Gold Avenue Precious Metals Investment Case Study"},
        {
          id: "cs4",          brand: "Standexpo",          name: "Exhibition Stands B2B",          price: "Website + Branding",          rating: 5,
          reviewCount: "Enhanced Brand Presence",          imageSrc: "http://img.b2bpic.net/free-photo/mature-group-college-students-read-green-screen-device_482257-123157.jpg",          imageAlt: "Standexpo Exhibition Stands Case Study"},
      ]}
      title="Our Work & Case Studies"
      description="Explore how we’ve driven success for leading brands across diverse industries and markets."
    />
  </div>

  <div id="why-mjsn" data-section="why-mjsn">
      <FaqSplitMedia
      textboxLayout="default"
      useInvertedBackground={true}
      faqs={[
        {
          id: "faq1",          title: "Deep MENA Market Understanding",          content: "Leverage our profound insights into the Middle East & North Africa region, ensuring culturally resonant campaigns."},
        {
          id: "faq2",          title: "European-Level Execution Standards",          content: "Benefit from marketing strategies and creative outputs that meet the highest international benchmarks."},
        {
          id: "faq3",          title: "Arabic-Native Content & Creative",          content: "Access authentic, high-quality Arabic content and creative tailored for effective local engagement."},
        {
          id: "faq4",          title: "Data-Driven Campaign Optimization",          content: "Every campaign is backed by rigorous data analysis and continuous optimization for peak performance."},
        {
          id: "faq5",          title: "Fast Creative Turnaround",          content: "Our agile teams ensure quick development and deployment of high-impact creative assets."},
        {
          id: "faq6",          title: "AI-Enhanced Marketing Systems",          content: "Harness the power of Artificial Intelligence to streamline processes and elevate campaign effectiveness."},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/businesspeople-planning-glass-wall_53876-15196.jpg"
      imageAlt="Abstract illustration of strategic thinking and market understanding"
      mediaAnimation="slide-up"
      mediaPosition="right"
      title="Why Choose MJSN?"
      description="Our unique approach combines local market understanding with global execution standards."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardOne
      animationType="depth-3d"
      textboxLayout="default"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      carouselMode="buttons"
      testimonials={[
        {
          id: "t1",          name: "QuickPlus & Ajman Free Zone",          role: "Lead Generation Partner",          company: "Real Estate Development",          rating: 5,
          testimonial: "MJSN delivered exceptional lead generation and conversion results, significantly boosting our outreach.",          imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-arrangement-with-paint-containers-copy-space_23-2148391884.jpg",          imageAlt: "Testimonial from QuickPlus & Ajman Free Zone"},
        {
          id: "t2",          name: "Pink Musée",          role: "E-commerce Growth",          company: "K-Beauty Retailer",          rating: 5,
          testimonial: "Their social media strategies and content creation ignited our e-commerce growth and brand engagement.",          imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-99727.jpg",          imageAlt: "Testimonial from Pink Musée"},
        {
          id: "t3",          name: "Standexpo",          role: "Branding & Web Development",          company: "Exhibition Solutions",          rating: 5,
          testimonial: "MJSN transformed our online presence with stunning web development and cohesive branding.",          imageSrc: "http://img.b2bpic.net/free-photo/colored-ceramic-stones-abstract-smooth-brown-mosiac-texture-abstract-ceramic-mosaic-adorned-building-abstract-seamless-pattern_1258-72060.jpg",          imageAlt: "Testimonial from Standexpo"},
        {
          id: "t4",          name: "Global Retail Group",          role: "Performance Marketing Lead",          company: "International Retail",          rating: 5,
          testimonial: "Their data-driven approach consistently delivers measurable results and strong ROI for our diverse brands.",          imageSrc: "http://img.b2bpic.net/free-photo/map-colorado-gold-glitter-map-dark-background_559531-11073.jpg",          imageAlt: "Testimonial from Global Retail Group"},
        {
          id: "t5",          name: "MENA Tech Innovators",          role: "Digital Strategy Director",          company: "Technology Startup",          rating: 5,
          testimonial: "MJSN's AI-enhanced workflows and deep market insights have been crucial to our successful market entry.",          imageSrc: "http://img.b2bpic.net/free-photo/gold-marble-texture-dark-background_1409-1780.jpg",          imageAlt: "Testimonial from MENA Tech Innovators"},
      ]}
      title="What Our Clients Say"
      description="Hear directly from the brands we've helped scale to new heights."
    />
  </div>

  <div id="process" data-section="process">
      <PricingCardNine
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      plans={[
        {
          id: "p1",          title: "1. Discovery & Audit",          price: "Phase 1",          period: "Initial Assessment",          features: [
            "In-depth market research",            "Competitor analysis",            "Current strategy audit",            "Goal alignment workshop"],
          button: {
            text: "Learn More"},
          imageSrc: "http://img.b2bpic.net/free-photo/man-analyzing-stock-market-charts-financial-data-electronic-board_169016-14901.jpg",          imageAlt: "Discovery and Audit Stage"},
        {
          id: "p2",          title: "2. Strategy & Planning",          price: "Phase 2",          period: "Roadmap Creation",          features: [
            "Custom campaign strategy",            "Audience segmentation",            "Channel selection",            "Budget allocation"],
          button: {
            text: "Learn More"},
          imageSrc: "http://img.b2bpic.net/free-vector/illustration-business-target-icon_53876-5899.jpg",          imageAlt: "Strategy and Planning Stage"},
        {
          id: "p3",          title: "3. Creative Production",          price: "Phase 3",          period: "Asset Development",          features: [
            "Copywriting (EN/AR)",            "Graphic design",            "Video production",            "Ad creative concepts"],
          button: {
            text: "Learn More"},
          imageSrc: "http://img.b2bpic.net/free-photo/professional-video-camera-movie-set-with-lot-cables_1268-17213.jpg",          imageAlt: "Creative Production Stage"},
        {
          id: "p4",          title: "4. Campaign Launch",          price: "Phase 4",          period: "Go-Live",          features: [
            "Platform setup & integration",            "Initial campaign deployment",            "Tracking & analytics setup",            "Real-time monitoring"],
          button: {
            text: "Learn More"},
          imageSrc: "http://img.b2bpic.net/free-photo/minimalist-design-arrow-circle_23-2148445364.jpg",          imageAlt: "Campaign Launch Stage"},
        {
          id: "p5",          title: "5. Optimization & Scaling",          price: "Phase 5",          period: "Continuous Improvement",          features: [
            "A/B testing & iteration",            "Performance analysis",            "Budget re-allocation",            "Scaling successful campaigns"],
          button: {
            text: "Learn More"},
          imageSrc: "http://img.b2bpic.net/free-photo/target-aspiration-goal-mission-success-aim-concept_53876-13727.jpg",          imageAlt: "Optimization and Scaling Stage"},
        {
          id: "p6",          title: "6. Reporting & Growth",          price: "Phase 6",          period: "Partnership Review",          features: [
            "Detailed performance reports",            "Strategic recommendations",            "Market trend analysis",            "Future growth planning"],
          button: {
            text: "Learn More"},
          imageSrc: "http://img.b2bpic.net/free-photo/business-analysis-report-folder-icon_53876-14637.jpg",          imageAlt: "Reporting and Growth Stage"},
      ]}
      title="Our Proven Process"
      description="A streamlined, transparent workflow designed to deliver consistent, high-impact results."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Let's Scale Your Brand Across Egypt · GCC · Europe"
      description="Ready to elevate your performance marketing? Book a free strategy call or connect with us directly."
      inputs={[
        {
          name: "name",          type: "text",          placeholder: "Your Name",          required: true,
        },
        {
          name: "email",          type: "email",          placeholder: "Your Email",          required: true,
        },
      ]}
      textarea={{
        name: "message",        placeholder: "Your Message",        rows: 4,
        required: true,
      }}
      imageSrc="http://img.b2bpic.net/free-photo/network-concept-with-yellow-squares_23-2148999199.jpg"
      imageAlt="Abstract illustration of strategic communication and networking"
      mediaAnimation="slide-up"
      mediaPosition="left"
      buttonText="Send Message"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseReveal
      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ez7srKw0Muaa70ZMY6lLLNlrAg/uploaded-1781169772954-vlkbzdzz.png"
      logoAlt="MJSN Agency Logo"
      logoText="MJSN."
      columns={[
        {
          title: "Services",          items: [
            {
              label: "Paid Advertising",              href: "#services"},
            {
              label: "Social Media Marketing",              href: "#services"},
            {
              label: "SEO",              href: "#services"},
            {
              label: "Web Development",              href: "#services"},
            {
              label: "Branding & Identity",              href: "#services"},
          ],
        },
        {
          title: "Company",          items: [
            {
              label: "About Us",              href: "#about"},
            {
              label: "Our Work",              href: "#portfolio"},
            {
              label: "Results",              href: "#results"},
            {
              label: "Contact",              href: "#contact"},
          ],
        },
        {
          title: "Connect",          items: [
            {
              label: "Book a Call",              href: "https://calendly.com/mjsn/30mins"},
            {
              label: "WhatsApp: +20 105 500 0524",              href: "https://wa.me/201055000524"},
            {
              label: "Email: hello@mjsn.agency",              href: "mailto:hello@mjsn.agency"},
            {
              label: "LinkedIn",              href: "#"},
            {
              label: "Instagram",              href: "#"},
            {
              label: "TikTok",              href: "#"},
          ],
        },
      ]}
      copyrightText="© 2026 MJSN. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}