import { Button } from "@/components/ui/button";
import { cn } from "@/lib/utils";

interface Cta5Props {
  className?: string;
}

const Cta5 = ({ className }: Cta5Props) => {
  return (
    <section dir="rtl" lang="fa" className={cn("py-32", className)}>
      <div className="container">
        <div className="flex w-full flex-col overflow-hidden rounded-lg bg-muted md:rounded-xl lg:flex-row lg:items-center">
          <div className="w-full shrink-0 self-stretch lg:w-1/2">
            <img
              src="/block-media/shadcnblocks/block/placeholder-dark-1.svg"
              alt="تصویر معرفی محصول"
              className="aspect-3/2 w-full rounded-t-md object-cover md:rounded-t-none md:rounded-e-md"
            />
          </div>
          <div className="w-full shrink-0 px-4 py-6 text-start md:p-8 lg:w-1/2 lg:px-16">
            <h3 className="mb-3 text-xl font-semibold md:mb-4 md:text-xl lg:mb-6">
              همین امروز شروع کنید
                                      </h3>
            <p className="mb-8 text-muted-foreground lg:text-lg">
              با استفاده از ابزارها و قابلیت‌های آماده، زمان توسعه را کاهش دهید، کیفیت محصول را افزایش دهید و سریع‌تر به بازار برسید.
                                      </p>
            <Button>شروع رایگان</Button>
          </div>
        </div>
      </div>
    </section>
  );
};

export { Cta5 };