import { ServicesGrid } from "@/features/services/components/common/ServicesGrid";

/**
 * AccountServicesOverview - Authenticated user's services landing page.
 *
 * Shows available services for the logged-in user with a header
 * and services grid linking to account-specific service pages.
 */
export function AccountServicesOverview() {
  return (
    <div className="py-8">
      <div className="max-w-[var(--cp-page-max-width)] mx-auto px-4 sm:px-6 md:px-8">
        {/* Header */}
        <div className="text-center mb-16 pt-8">
          <h1 className="text-4xl sm:text-5xl font-extrabold text-foreground mb-6 tracking-tight">
            Our Services
          </h1>
          <p className="text-xl text-muted-foreground max-w-2xl mx-auto leading-relaxed">
            From high-speed internet to onsite support, we provide comprehensive solutions for your
            home and business.
          </p>
        </div>

        <ServicesGrid basePath="/account/services" />
      </div>
    </div>
  );
}
