"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="smallMedium"
        sizing="mediumLargeSizeLargeTitles"
        background="noiseDiagonalGradient"
        cardStyle="soft-shadow"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="layered"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "Stories",
          id: "/stories",
        },
        {
          name: "Services",
          id: "/services",
        },
        {
          name: "About",
          id: "/about",
        },
        {
          name: "Contact",
          id: "/contact",
        },
      ]}
      brandName="DYSRVPT"
    />
  </div>

  <div id="services-overview" data-section="services-overview">
      <FeatureCardNine
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "Media Coverage",
          description: "Comprehensive on-ground and digital media coverage for events, artists, and cultural initiatives.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/grayscale-shot-drum-pad-machine-beats-sound-design-wooden-table_181624-58461.jpg",
            imageAlt: "Camera crew filming a live event",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/3d-glasses-popcorn-movies_23-2149558731.jpg",
            imageAlt: "Dynamic social media video",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/mardi-gras-celebration-new-orleans_23-2151083404.jpg",
          imageAlt: "media coverage live event",
        },
        {
          title: "Mobile-First Content Creation",
          description: "Agile production of high-impact, social-ready visuals optimized for immediate engagement across platforms.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/non-binary-person-sitting-table-outside_23-2148757523.jpg",
            imageAlt: "Phone displaying fast-paced content",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/male-musician-plays-guitar-home-workplace-near-computer_169016-20785.jpg",
            imageAlt: "Phone showing engaging mobile content",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-beautiful-happy-woman_23-2148778274.jpg",
          imageAlt: "media coverage live event",
        },
        {
          title: "Editorial Storytelling",
          description: "Crafting compelling long-form articles, in-depth interviews, and research-driven features that resonate.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/pretty-girl-blue-shirt-dreamily-using-tablet-while-recording-new-fashion-video-vlog_574295-5300.jpg",
            imageAlt: "Tablet displaying a feature article",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/woman-taking-photos-her-business-with-kitchenware_23-2149060805.jpg",
            imageAlt: "Tablet showing a cultural report",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-men-playing-drums_23-2149029454.jpg",
          imageAlt: "media coverage live event",
        },
        {
          title: "Talent Amplification",
          description: "Strategic positioning and promotion for artists, DJs, and cultural disruptors to elevate their presence.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/online-blog_53876-123696.jpg",
            imageAlt: "Phone showing artist promotion",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/music-equalizer-button-multimedia-icon_53876-21280.jpg",
            imageAlt: "Phone displaying a DJ's profile",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/excited-woman-sunglasses-getting-her-hair-done_107420-12126.jpg",
          imageAlt: "media coverage live event",
        },
      ]}
      showStepNumbers={false}
      title="OUR SERVICES"
      description="Partner with DYSRVPT to amplify your impact and authentically connect with the culture through bespoke media solutions."
    />
  </div>

  <div id="service-deliverables" data-section="service-deliverables">
      <FeatureCardNine
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      features={[
        {
          title: "High-Impact Visuals",
          description: "Stunning photography and cinematic videography that captures the essence of every moment.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/woman-developing-photos-darkroom-side-view_23-2149893807.jpg",
            imageAlt: "Phone displaying high-quality event photos",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/smiley-female-english-teacher-doing-online-lessons-her-smartphone_23-2149019758.jpg",
            imageAlt: "Phone showing dynamic video highlights",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/mardi-gras-celebration-new-orleans_23-2151083404.jpg",
          imageAlt: "high quality event photo gallery",
        },
        {
          title: "Authentic Narratives",
          description: "Compelling stories, interviews, and features that authentically represent the cultural landscape.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/man-with-coffee-newspaper-walking-city_171337-14822.jpg",
            imageAlt: "Phone displaying a published editorial piece",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/group-diverse-people-using-smartphones_53876-25100.jpg",
            imageAlt: "Phone showing an in-depth interview",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-beautiful-happy-woman_23-2148778274.jpg",
          imageAlt: "high quality event photo gallery",
        },
        {
          title: "Amplified Reach",
          description: "Strategic distribution across digital platforms, ensuring your message reaches the right audience.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/worker-examines-phone-with-greenscreen_482257-76605.jpg",
            imageAlt: "Phone showing social media analytics",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/young-famous-influencer-filming-review-phone-with-green-screen-creative-content-creator_482257-24914.jpg",
            imageAlt: "Phone showing audience engagement metrics",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-men-playing-drums_23-2149029454.jpg",
          imageAlt: "high quality event photo gallery",
        },
      ]}
      showStepNumbers={false}
      title="WHAT WE DELIVER"
      description="Our commitment is to tangible outcomes that resonate with your audience and elevate your brand's presence within the culture."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseCard
      logoText="DYSRVPT"
      columns={[
        {
          title: "Navigation",
          items: [
            {
              label: "Home",
              href: "/",
            },
            {
              label: "Stories",
              href: "/stories",
            },
            {
              label: "Services",
              href: "/services",
            },
            {
              label: "About",
              href: "/about",
            },
            {
              label: "Contact",
              href: "/contact",
            },
          ],
        },
        {
          title: "Socials",
          items: [
            {
              label: "Instagram",
              href: "https://instagram.com/dysrvpt",
            },
            {
              label: "TikTok",
              href: "https://tiktok.com/@dysrvpt",
            },
            {
              label: "X",
              href: "https://x.com/dysrvpt",
            },
            {
              label: "YouTube",
              href: "https://youtube.com/@dysrvpt",
            },
          ],
        },
        {
          title: "Legal",
          items: [
            {
              label: "Privacy Policy",
              href: "#",
            },
            {
              label: "Terms of Service",
              href: "#",
            },
          ],
        },
      ]}
      copyrightText="DYSRVPT | Documenting African Culture In Motion. DO IT LIKE YOU. STAY DYSRVPTIVE."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
