arad-arisman/src/app/about/page.tsx

import type { Metadata } from "next";
import Image from "next/image";
import Link from "next/link";
import Container from "@/components/Container";
import PageBanner from "@/components/PageBanner";
import MissionVision from "@/components/MissionVision";
import ImportCountries from "@/components/ImportCountries";
import Features from "@/components/Features";
import { pageMetadata } from "@/lib/seo";

export const metadata: Metadata = pageMetadata({
  title: "درباره ما | آراد آریسمان",
  description:
    "آشنایی با شرکت آراد آریسمان؛ بیش از ۲۳ سال تجربه در تولید و عرضه مکمل‌های غذایی دام، طیور و زنبور عسل.",
  path: "/about",
});

export default function AboutPage() {
  return (
    <>
      <PageBanner
        title="درباره آراد آریسمان"
        subtitle="بیش از دو دهه تجربه در تولید و عرضه مکمل‌های غذایی دام، طیور و زنبور عسل"
        breadcrumb="درباره ما"
      />

      <section className="py-16 sm:py-20">
        <Container className="grid grid-cols-1 lg:grid-cols-2 items-center gap-12">
          <div className="relative aspect-[4/3] rounded-3xl overflow-hidden shadow-xl bg-surface order-2 lg:order-1">
            <Image
              src="/images/category-3.jpg"
              alt="محصولات آراد آریسمان"
              fill
              className="object-contain p-6"
              sizes="(min-width: 1024px) 45vw, 90vw"
            />
          </div>

          <div className="order-1 lg:order-2 text-center lg:text-start">
            <span className="text-sm font-bold text-accent">داستان ما</span>
            <h2 className="mt-3 text-3xl sm:text-4xl font-extrabold text-primary">
              تغذیه مطمئن، پرورش موفق
            </h2>
            <p className="mt-6 leading-8 text-foreground">
              شرکت آراد آریسمان پیشرو در تولید و عرضه افزودنی‌های خوراک، ویتامین‌ها و
              مکمل‌های غذایی دام و طیور با بیش از ۲۳ سال فعالیت در بازار ایران می‌باشد.
              واردات این شرکت عمدتا از تولیدکنندگان معتبر بین‌المللی غذای دام و طیور از
              کشورهای انگلستان، فرانسه، ترکیه، هندوستان و چین می‌باشد.
            </p>
            <p className="mt-4 leading-8 text-foreground">
              در طول این سال‌ها، تمرکز اصلی ما بر تضمین کیفیت، ثبات ترکیبات و پاسخگویی
              به نیاز واقعی دامداران، مرغداران و پرورش‌دهندگان زنبور عسل بوده است؛
              نتیجه‌ی این رویکرد، اعتماد پایدار بیش از ۲۳۰ مشتری در سراسر کشور است.
            </p>

            <div className="mt-8 flex justify-center lg:justify-start gap-10">
              <div>
                <div className="text-3xl font-extrabold text-primary">۲۳+</div>
                <div className="mt-1 text-sm text-foreground">سال تجربه</div>
              </div>
              <div>
                <div className="text-3xl font-extrabold text-primary">۲۳۰+</div>
                <div className="mt-1 text-sm text-foreground">رضایت مشتری</div>
              </div>
              <div>
                <div className="text-3xl font-extrabold text-primary">۵</div>
                <div className="mt-1 text-sm text-foreground">کشور واردات</div>
              </div>
            </div>
          </div>
        </Container>
      </section>

      <MissionVision />

      <section className="bg-surface">
        <Container className="pt-16 sm:pt-20 text-center max-w-xl mx-auto">
          <span className="text-sm font-bold text-accent">چرا آراد آریسمان</span>
          <h2 className="mt-3 text-3xl sm:text-4xl font-extrabold text-primary">
            مزایای مکمل‌های آراد آریسمان
          </h2>
        </Container>
        <Features />
      </section>

      <ImportCountries />

      <section className="py-16 sm:py-20">
        <Container>
          <div className="rounded-3xl bg-primary px-8 py-14 sm:px-16 text-center">
            <h2 className="text-2xl sm:text-3xl font-extrabold text-white">
              برای مشاوره و خرید محصولات همین حالا با ما در تماس باشید
            </h2>
            <p className="mt-4 text-white/80 max-w-xl mx-auto">
              کارشناسان آراد آریسمان آماده پاسخگویی به سوالات شما درباره مکمل‌ها و
              نحوه مصرف آن‌ها هستند.
            </p>
            <div className="mt-8 flex flex-wrap justify-center gap-4">
              <Link
                href="/contact"
                className="rounded-full bg-white px-7 py-3.5 text-primary font-semibold hover:bg-white/90 transition-colors"
              >
                تماس با ما
              </Link>
              <a
                href="tel:09104067935"
                dir="ltr"
                className="rounded-full border border-white/30 px-7 py-3.5 text-white font-semibold hover:bg-white/10 transition-colors"
              >
                09104067935
              </a>
            </div>
          </div>
        </Container>
      </section>
    </>
  );
}