"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';

export default function ServicesPage() {
  return (
    <ThemeProvider defaultButtonVariant="icon-arrow" defaultTextAnimation="reveal-blur" borderRadius="rounded" contentWidth="medium" sizing="medium" background="none" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
      <ReactLenis root>
        <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          navItems={[
            { name: "Home", id: "/" },
            { name: "Services", id: "/services" },
            { name: "Portfolio", id: "/portfolio" },
            { name: "Contact", id: "/contact" }
          ]}
          brandName="Chandigi"
          button={{ text: "Get Growth Plan", href: "/contact" }}
        />
        </div>
        <div className="pt-32 pb-20">
            <div className="text-center">
                <h1 className="text-4xl font-bold">Our Expert Services</h1>
                <p className="text-lg mt-4">Data-driven digital marketing and growth solutions tailored for your business needs.</p>
            </div>
        </div>
        <div id="footer" data-section="footer">
        <FooterBaseReveal logoText="Chandigi" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }] }]} />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}