"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="entrance-slide"
        borderRadius="soft"
        contentWidth="mediumLarge"
        sizing="large"
        background="floatingGradient"
        cardStyle="solid"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="layered"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "Stories",
          id: "/stories",
        },
        {
          name: "Services",
          id: "/services",
        },
        {
          name: "About",
          id: "/about",
        },
        {
          name: "Contact",
          id: "/contact",
        },
      ]}
      button={{
        text: "Work With Us",
        href: "/services",
      }}
      logoSrc="http://img.b2bpic.net/free-vector/pack-african-logo-templates_23-2148735830.jpg"
      logoAlt="DYSRVPT Logo"
      brandName="DYSRVPT"
    />
  </div>

  <div id="services-overview" data-section="services-overview">
      <FeatureCardSeven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "Media Coverage",
          description: "Comprehensive on-ground reporting, capturing the essence of events and cultural movements.",
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-female-journalist-taking-interview_23-2149032407.jpg",
          imageAlt: "Live event media coverage in Africa",
        },
        {
          title: "Mobile Content Creation",
          description: "Dynamic, social-first visuals crafted for immediate impact and wide audience reach.",
          imageSrc: "http://img.b2bpic.net/free-photo/leadership-agreement-productivity-business_53876-21311.jpg",
          imageAlt: "Smartphone displaying engaging content creation",
        },
        {
          title: "Editorial Storytelling",
          description: "In-depth articles, interviews, and features that delve into the narratives behind the culture.",
          imageSrc: "http://img.b2bpic.net/free-photo/flay-lay-coffee-coffee-bag_23-2148267874.jpg",
          imageAlt: "Magazine open to an article about African culture",
        },
        {
          title: "Talent Amplification",
          description: "Strategic positioning and profiling of artists, DJs, and cultural disruptors.",
          imageSrc: "http://img.b2bpic.net/free-photo/woman-with-fluorescent-make-up-copy-space_23-2148410068.jpg",
          imageAlt: "African artist profile projected onto a wall",
        },
      ]}
      title="OUR OFFERINGS"
      description="We empower brands and artists to connect with contemporary African culture through bespoke media and storytelling solutions."
    />
  </div>

  <div id="partnership-levels" data-section="partnership-levels">
      <PricingCardNine
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      plans={[
        {
          id: "basic",
          title: "Cultural Spotlight",
          price: "Inquire",
          period: "Per Project",
          features: [
            "Feature in Short Reads",
            "Social Media Mentions",
            "Access to DYSRVPT Network",
          ],
          button: {
            text: "Start Collaborating",
            href: "/contact",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/3d-cinema-glasses-isolated-white-background_23-2148188109.jpg",
          imageAlt: "Abstract pattern for basic plan",
        },
        {
          id: "pro",
          title: "Immersive Narrative",
          price: "Inquire",
          period: "Per Campaign",
          features: [
            "Dedicated Long Read Feature",
            "Custom Mobile Content",
            "Event Coverage (Tier 1)",
            "Priority Talent Amplification",
          ],
          button: {
            text: "Elevate Your Brand",
            href: "/contact",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/mix-peach-blue-paint_23-2147763497.jpg",
          imageAlt: "Abstract pattern for pro plan",
        },
        {
          id: "enterprise",
          title: "Disruptive Partnership",
          price: "Custom",
          period: "Annual",
          features: [
            "Full Editorial Series",
            "Exclusive Documentary Content",
            "Comprehensive Media Integration",
            "Strategic Cultural Consultancy",
            "Event Coverage (All Tiers)",
          ],
          button: {
            text: "Build a Custom Plan",
            href: "/contact",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/still-life-illustrating-ethics-concept_23-2149412262.jpg",
          imageAlt: "Abstract pattern for enterprise plan",
        },
      ]}
      title="PARTNERSHIP LEVELS"
      description="Explore our tailored solutions for media collaboration and cultural amplification, designed to elevate your brand's presence within the African creative landscape."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoReveal
      logoSrc="http://img.b2bpic.net/free-vector/pack-african-logo-templates_23-2148735830.jpg"
      logoAlt="DYSRVPT Logo"
      logoText="DYSRVPT"
      leftLink={{
        text: "DO IT LIKE YOU.",
        href: "#",
      }}
      rightLink={{
        text: "STAY DYSRVPTIVE.",
        href: "#",
      }}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
