reui-blocks/blocks/stats1.tsx

import { cn } from "@/lib/utils";

const formatNumber = (value: number) => value.toLocaleString("fa-IR");

interface Stats1Props {
  className?: string;
}

const Stats1 = ({ className }: Stats1Props) => {
  return (
    <section dir="rtl" lang="fa" className={cn("py-32", className)}>
      <div className="container">
        <h1 className="text-center text-xl font-semibold lg:text-2xll">
          بینش‌های عملکرد پلتفرم
        </h1>
        <div className="grid gap-10 pt-9 md:grid-cols-3 lg:gap-0 lg:pt-20">
          <div className="text-center">
            <p className="text-sm font-medium text-muted-foreground">
              زمان استخدام را تا
            </p>
            <p className="pt-4 text-2xll font-semibold lg:pt-10">۴ برابر</p>
            <p className="text-xl font-semibold text-muted-foreground">
              سریع‌تر کاهش دهید
            </p>
          </div>
          <div className="text-center">
            <p className="text-sm font-medium text-muted-foreground">
              مشتریان شاهد کاهش
            </p>
            <p className="pt-4 text-2xll font-semibold lg:pt-10">
              {formatNumber(50)}٪
            </p>
            <p className="text-xl font-semibold text-muted-foreground">
              در زمان استخدام بوده‌اند
            </p>
          </div>
          <div className="text-center">
            <p className="text-sm font-medium text-muted-foreground">
              میانگین تعداد استخدام در هر
            </p>
            <p className="pt-4 text-2xll font-semibold lg:pt-10">
              {formatNumber(3)}
            </p>
            <p className="text-xl font-semibold text-muted-foreground">ماه</p>
          </div>
        </div>
      </div>
    </section>
  );
};

export { Stats1 };