import Image from "next/image";

export default function ContentSection() {
  return (
    <section className="py-16 md:py-32">
      <div className="mx-auto max-w-5xl space-y-8 px-6 md:space-y-16">
        <h2 className="text-heading-2 relative z-10 max-w-xl font-semibold leading-relaxed tracking-normal text-foreground">
          راهکارهای یکپارچه برای کسب‌وکارهای هوشمند
        </h2>
        <div className="grid gap-6 sm:grid-cols-2 md:gap-12 lg:gap-24">
          <div className="relative mb-6 sm:mb-0">
            <div className="bg-linear-to-b aspect-76/59 relative rounded-2xl from-border to-transparent p-px dark:from-border">
              <Image
                src="/assets/Echosystem.png"
                className="rounded-[15px] object-cover dark:invert"
                alt="اکوسیستم یکپارچه"
                width={1207}
                height={929}
              />
            </div>
          </div>

          <div className="relative space-y-4">
            <p className="text-body text-muted-foreground leading-relaxed tracking-normal">
              ما یک گروه متخصص هستیم که در حوزه اینتگریشن و روش‌های نوین یکپارچه‌سازی فعالیت می‌کنیم.{" "}
              <span className="text-primary font-semibold">
                ما با استفاده از تکنولوژی‌های پیشرفته و رویکردهای نوآورانه
              </span>{" "}
              به کسب‌وکارها کمک می‌کنیم تا سیستم‌های خود را به شکلی کارآمد و قابل‌اعتماد بهم متصل کنند.
            </p>
            <p className="text-body text-muted-foreground leading-relaxed tracking-normal">
              ما در زمینه یکپارچه‌سازی سیستم‌ها، اتوماسیون فرآیندها، ارتباطات چندکاناله و مدیریت داده‌ها تخصص داریم. با استفاده از روش‌های نوین و ابزارهای پیشرفته، راهکارهای سفارشی برای هر کسب‌وکار طراحی و پیاده‌سازی می‌کنیم که به آن‌ها امکان می‌دهد تا از قدرت اتوماسیون و ارتباطات هوشمند بهره‌مند شوند.
            </p>

            <div className="pt-6">
              <blockquote className="border-s-4 border-primary/30 ps-4">
                <p className="text-body leading-relaxed tracking-normal text-foreground">
                  ماموریت ما این است که با استفاده از روش‌های نوین اینتگریشن، به کسب‌وکارها کمک کنیم تا 
                  بدون پیچیدگی‌های فنی، سیستم‌های خود را بهم متصل کنند و به اهداف خود برسند.
                </p>

                <div className="mt-6 space-y-3">
                  <div className="block font-medium not-italic text-foreground">ماموریت ما</div>
                </div>
              </blockquote>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
}