import Image from "next/image"

export default function CorporatePage() {
    return (
        <div className="container py-12 md:py-24">
            <div className="max-w-4xl mx-auto space-y-12">
                <section className="space-y-6 text-center">
                    <h1 className="text-4xl md:text-5xl font-bold tracking-tight font-outfit">Hakkımızda</h1>
                    <p className="text-xl text-muted-foreground">
                        1995'ten beri güvenliğinizi en değerli hazinemiz olarak görüyoruz.
                    </p>
                </section>

                <section className="grid md:grid-cols-2 gap-12 items-center">
                    <div className="aspect-square relative bg-slate-200 rounded-lg overflow-hidden">
                        {/* Placeholder Image */}
                        <div className="absolute inset-0 flex items-center justify-center text-muted-foreground">
                            Şirket Görseli
                        </div>
                    </div>
                    <div className="space-y-6">
                        <h2 className="text-3xl font-bold">Misyonumuz</h2>
                        <p className="text-slate-600 dark:text-slate-300 leading-relaxed">
                            ParaKasa olarak misyonumuz, müşterilerimizin maddi ve manevi değerlerini korumak için
                            dünya standartlarında güvenlik çözümleri sunmaktır. Teknolojiyi zanaatkarlıkla birleştirerek,
                            sadece bir metal kutu değil, huzur ve güven üretiyoruz.
                        </p>
                        <h2 className="text-3xl font-bold pt-4">Vizyonumuz</h2>
                        <p className="text-slate-600 dark:text-slate-300 leading-relaxed">
                            Türkiye'nin lider çelik kasa üreticisi olarak, global pazarda güvenilirlik ve kalite
                            denince akla gelen ilk marka olmak. Yenilikçi Ar-Ge çalışmalarımızla güvenlik teknolojilerine
                            yön vermek.
                        </p>
                    </div>
                </section>

                <section className="bg-slate-50 dark:bg-slate-900 p-8 rounded-2xl text-center space-y-4">
                    <h3 className="text-2xl font-bold">Neden ParaKasa?</h3>
                    <div className="grid sm:grid-cols-3 gap-6 pt-6">
                        <div className="p-4">
                            <div className="text-4xl font-bold text-primary mb-2">25+</div>
                            <div className="text-sm font-medium">Yıllık Tecrübe</div>
                        </div>
                        <div className="p-4">
                            <div className="text-4xl font-bold text-primary mb-2">10K+</div>
                            <div className="text-sm font-medium">Mutlu Müşteri</div>
                        </div>
                        <div className="p-4">
                            <div className="text-4xl font-bold text-primary mb-2">%100</div>
                            <div className="text-sm font-medium">Yerli Üretim</div>
                        </div>
                    </div>
                </section>
            </div>
        </div>
    )
}