"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
import FaqBase from "@/components/sections/faq/FaqBase";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import Link from "next/link";
import { Trophy } from "lucide-react";

export default function WorkPage() {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "Services", id: "services" },
    { name: "Work", id: "work" },
    { name: "Team", id: "team" },
    { name: "Pricing", id: "pricing" },
    { name: "Contact", id: "contact" },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="small"
      sizing="mediumLargeSizeLargeTitles"
      background="grid"
      cardStyle="layered-gradient"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={navItems}
          brandName="SocialVibe Agency"
          bottomLeftText="Premium Social Strategy"
          bottomRightText="hello@socialvibe.com"
        />
      </div>

      <div id="case-studies" data-section="case-studies">
        <ProductCardFour
          title="Case Studies"
          description="Real results from real brands. See how we've transformed social presence into measurable business impact."
          tag="Success Stories"
          tagIcon={Trophy}
          tagAnimation="slide-up"
          textboxLayout="split"
          useInvertedBackground={false}
          animationType="scale-rotate"
          gridVariant="bento-grid"
          products={[
            {
              id: "case-1",
              name: "Fashion Brand Growth",
              price: "340% Engagement",
              variant: "Instagram Takeover",
              imageSrc: "http://img.b2bpic.net/free-photo/cute-young-woman-talking-about-clothing-accessories-her-fashion-video-blog_662251-2238.jpg?_wi=2",
              imageAlt: "Fashion brand case study results",
            },
            {
              id: "case-2",
              name: "SaaS Market Expansion",
              price: "2.5M Impressions",
              variant: "LinkedIn Strategy",
              imageSrc: "http://img.b2bpic.net/free-photo/focused-workaholic-entrepreneur-man-working-overtime-presenting-company-statistics_482257-6363.jpg?_wi=2",
              imageAlt: "SaaS platform expansion results",
            },
            {
              id: "case-3",
              name: "E-commerce Boom",
              price: "520% ROI",
              variant: "TikTok Campaign",
              imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-smartphone-with-inscription-screen_23-2147652183.jpg?_wi=2",
              imageAlt: "E-commerce sales growth",
            },
            {
              id: "case-4",
              name: "Brand Awareness",
              price: "1.2M New Followers",
              variant: "Multi-Platform",
              imageSrc: "http://img.b2bpic.net/free-photo/laptop-computer-with-marketing-graphs-screen-standing-table-startup-office-while-diverse-team-sharing-papers-with-company-turnover-it-multiethnic-businesspeople-analyzing-strategy_482257-40096.jpg?_wi=2",
              imageAlt: "Brand awareness campaign",
            },
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          title="What Our Clients Say"
          description="Real feedback from brands we've transformed"
          tag="Client Testimonials"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          testimonials={[
            {
              id: "testimonial-1",
              name: "Jessica Liu",
              date: "March 2024",
              title: "CEO, TechVenture",
              quote: "SocialVibe transformed our brand presence. Within 6 months, our follower count tripled and engagement became genuine. They truly understand strategy.",
              tag: "Tech Industry",
              avatarSrc: "http://img.b2bpic.net/free-photo/carefree-african-american-businesswoman-showing-tongue-having-fun_176420-26990.jpg",
              avatarAlt: "Jessica Liu",
            },
            {
              id: "testimonial-2",
              name: "David Park",
              date: "February 2024",
              title: "Marketing Manager, FashionLux",
              quote: "The content quality and consistency exceeded our expectations. Our audience feels more connected to our brand than ever before.",
              tag: "Fashion & Beauty",
              avatarSrc: "http://img.b2bpic.net/free-photo/pretty-smiling-business-woman-standing-window_1262-1069.jpg",
              avatarAlt: "David Park",
            },
            {
              id: "testimonial-3",
              name: "Maria Santos",
              date: "January 2024",
              title: "Founder, EcomPro",
              quote: "They delivered a 520% ROI on our social campaigns. Professional, creative, and deeply committed to results.",
              tag: "E-commerce",
              avatarSrc: "http://img.b2bpic.net/free-vector/women-avatar-collection_24908-60281.jpg",
              avatarAlt: "Maria Santos",
            },
            {
              id: "testimonial-4",
              name: "Robert Chen",
              date: "December 2023",
              title: "Director, WellnessHub",
              quote: "Outstanding team. They balanced creativity with data-driven decisions. Our brand story is now resonating with our target audience perfectly.",
              tag: "Health & Wellness",
              avatarSrc: "http://img.b2bpic.net/free-photo/proud-businessman-with-his-company_1098-2864.jpg",
              avatarAlt: "Robert Chen",
            },
            {
              id: "testimonial-5",
              name: "Sophia Anderson",
              date: "November 2023",
              title: "VP Marketing, EdTechGlobal",
              quote: "Their strategic approach and execution are flawless. We've seen consistent growth across all platforms and meaningful community engagement.",
              tag: "Education",
              avatarSrc: "http://img.b2bpic.net/free-photo/portrait-african-businesswoman-manage-meeting_329181-20101.jpg",
              avatarAlt: "Sophia Anderson",
            },
            {
              id: "testimonial-6",
              name: "Thomas Morgan",
              date: "October 2023",
              title: "CEO, SustainableBrand",
              quote: "They understood our mission and crafted content that attracted our ideal customers. Partner with them without hesitation.",
              tag: "Sustainability",
              avatarSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1602.jpg",
              avatarAlt: "Thomas Morgan",
            },
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Everything you need to know about our services and process"
          tag="Get Answers"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
          faqs={[
            {
              id: "faq-1",
              title: "How long does it take to see results?",
              content: "Most clients see initial engagement improvements within 2-4 weeks. Meaningful follower growth and audience building typically takes 2-3 months. We focus on sustainable growth, not shortcuts. Results depend on your starting point, industry, and budget.",
            },
            {
              id: "faq-2",
              title: "Which social platforms do you manage?",
              content: "We specialize in Instagram, TikTok, LinkedIn, Twitter/X, Facebook, YouTube, and Pinterest. We also handle emerging platforms based on your audience. Our strategy determines which platforms maximize your reach and engagement.",
            },
            {
              id: "faq-3",
              title: "Do you create content or curate it?",
              content: "We do both. Our approach combines high-quality original content creation with strategic curation. We produce graphics, videos, reels, and captions. We also identify and share industry-relevant content that resonates with your audience.",
            },
            {
              id: "faq-4",
              title: "Can you work with established brands and startups?",
              content: "Absolutely. We work with everyone from Fortune 500 companies to early-stage startups. Our strategies scale to your budget and goals. Whether you're building from scratch or optimizing existing presence, we customize our approach.",
            },
            {
              id: "faq-5",
              title: "How do you measure success?",
              content: "We track KPIs aligned with your business goals: engagement rate, follower growth, reach, conversions, and ROI. We provide detailed monthly reports and quarterly strategy reviews. Transparency in metrics is fundamental to our partnership.",
            },
            {
              id: "faq-6",
              title: "What's your onboarding process?",
              content: "We start with a strategy consultation to understand your brand, goals, and audience. Then we conduct a social audit, create a 90-day roadmap, and establish reporting cadence. Our team gets full access to your accounts to execute seamlessly.",
            },
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="SocialVibe"
          leftLink={{ text: "Privacy Policy", href: "#" }}
          rightLink={{ text: "© 2024 SocialVibe Agency", href: "/" }}
        />
      </div>
    </ThemeProvider>
  );
}