2b58fed2-0a50-47f5-bcc0-7bf75db94468/src/app/about/page.tsx

"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import AboutMetric from "@/components/sections/about/AboutMetric";
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
import Link from "next/link";
import { TrendingUp, ShoppingCart, Users, Globe, Award, MessageSquare } from "lucide-react";

const AboutPage = () => {
  const footerColumns = [
    {
      items: [
        { label: "Home", href: "/" },
        { label: "Solutions", href: "/solutions" },
        { label: "About", href: "/about" },
        { label: "Pricing", href: "/pricing" },
      ],
    },
    {
      items: [
        { label: "Contact", href: "/contact" },
        { label: "Support", href: "#" },
        { label: "Blog", href: "#" },
        { label: "Careers", href: "#" },
      ],
    },
    {
      items: [
        { label: "Privacy Policy", href: "#" },
        { label: "Terms of Service", href: "#" },
        { label: "Security", href: "#" },
        { label: "Compliance", href: "#" },
      ],
    },
    {
      items: [
        { label: "LinkedIn", href: "https://linkedin.com" },
        { label: "Twitter", href: "https://twitter.com" },
        { label: "GitHub", href: "https://github.com" },
        { label: "Email", href: "mailto:hello@t4it.com" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="mediumSmall"
      sizing="largeSmallSizeMediumTitles"
      background="grid"
      cardStyle="gradient-radial"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="layered"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="T4IT"
          navItems={[
            { name: "Home", id: "/" },
            { name: "Solutions", id: "/solutions" },
            { name: "About", id: "/about" },
            { name: "Pricing", id: "/pricing" },
            { name: "Contact", id: "/contact" },
          ]}
          button={{ text: "Get Started", href: "/contact" }}
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="T4IT: Pioneering Digital Innovation Since 2009. We empower enterprises worldwide to achieve digital excellence through cutting-edge technology, expert guidance, and unwavering commitment to success."
          metrics={[
            { icon: TrendingUp, label: "Growth Acceleration", value: "350%" },
            { icon: ShoppingCart, label: "Client Satisfaction", value: "98%" },
            { icon: Users, label: "Enterprise Clients", value: "500+" },
            { icon: Globe, label: "Global Deployments", value: "45+" },
          ]}
          metricsAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSixteen
          title="Trusted by Industry Leaders"
          description="Discover why world-class companies choose T4IT as their technology innovation partner"
          tag="Client Success Stories"
          tagIcon={Award}
          tagAnimation="slide-up"
          testimonials={[
            {
              id: "1",
              name: "Sarah Chen",
              role: "CTO",
              company: "FinTech Innovators",
              rating: 5,
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARlnpjsMud0Ghx0a2BpPw48SFX/professional-headshot-of-a-confident-fem-1772563550335-f2dec30f.png",
              imageAlt: "Sarah Chen testimonial",
            },
            {
              id: "2",
              name: "Michael Rodriguez",
              role: "VP Engineering",
              company: "Enterprise Solutions Inc",
              rating: 5,
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARlnpjsMud0Ghx0a2BpPw48SFX/professional-headshot-of-a-male-tech-ent-1772563550086-a7384157.png",
              imageAlt: "Michael Rodriguez testimonial",
            },
            {
              id: "3",
              name: "Emily Watson",
              role: "Digital Director",
              company: "Global Tech Ventures",
              rating: 5,
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARlnpjsMud0Ghx0a2BpPw48SFX/professional-headshot-of-a-confident-fem-1772563550677-39e84f00.png",
              imageAlt: "Emily Watson testimonial",
            },
            {
              id: "4",
              name: "David Kim",
              role: "CEO",
              company: "StartupXYZ",
              rating: 5,
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARlnpjsMud0Ghx0a2BpPw48SFX/professional-headshot-of-a-male-software-1772563550376-b9377434.png",
              imageAlt: "David Kim testimonial",
            },
          ]}
          kpiItems={[
            { value: "15+", label: "Years in Business" },
            { value: "45+", label: "Countries Served" },
            { value: "500+", label: "Enterprise Partners" },
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Join Our Community"
          tagIcon={MessageSquare}
          tagAnimation="slide-up"
          title="Ready to Partner with T4IT?"
          description="Learn how T4IT can help your organization navigate digital transformation, accelerate innovation, and achieve sustainable growth. Our team is ready to support your journey."
          background={{ variant: "radial-gradient" }}
          useInvertedBackground={false}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARlnpjsMud0Ghx0a2BpPw48SFX/modern-tech-company-office-environment-w-1772563550699-ac79f00f.png"
          imageAlt="T4IT company culture"
          mediaAnimation="slide-up"
          mediaPosition="right"
          inputPlaceholder="Enter your email"
          buttonText="Get In Touch"
          termsText="We're excited to learn more about your organization and explore how we can partner for success."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="T4IT"
          columns={footerColumns}
        />
      </div>
    </ThemeProvider>
  );
};

export default AboutPage;