180 lines
8.7 KiB
TypeScript
180 lines
8.7 KiB
TypeScript
import { Navbar } from "@/components/Navbar";
|
||
import { Footer } from "@/components/Footer";
|
||
import { FloatingWhatsApp } from "@/components/FloatingWhatsApp";
|
||
import { CTASection } from "@/components/CTASection";
|
||
import Image from "next/image";
|
||
import { Shield, Zap, Target, Users, Rocket, Eye } from "lucide-react";
|
||
import { Metadata } from "next";
|
||
|
||
export const metadata: Metadata = {
|
||
title: "Hakkımızda | Aydoğan Nakliyat Vinç Kurumsal",
|
||
description: "20 yılı aşkın tecrübemizle Dalaman ve Muğla bölgesinin lider vinç ve nakliyat firmasıyız. Vizyonumuz, misyonumuz ve profesyonel ekibimiz hakkında bilgi alın.",
|
||
};
|
||
|
||
const VALUES = [
|
||
{
|
||
title: "Güvenlik",
|
||
description: "Sıfır kaza politikasıyla, tüm operasyonlarımızda uluslararası güvenlik standartlarını uyguluyoruz.",
|
||
icon: <Shield className="w-10 h-10 text-primary" />
|
||
},
|
||
{
|
||
title: "Hız",
|
||
description: "Zamanın değerini biliyoruz. En karmaşık projeleri bile belirlenen takvim dahilinde tamamlıyoruz.",
|
||
icon: <Zap className="w-10 h-10 text-primary" />
|
||
},
|
||
{
|
||
title: "Hassasiyet",
|
||
description: "Milimetrik hesaplamalarla, en değerli yüklerinizi en ufak bir zarar görmeden taşıyoruz.",
|
||
icon: <Target className="w-10 h-10 text-primary" />
|
||
},
|
||
{
|
||
title: "Müşteri Odaklılık",
|
||
description: "Her projenin kendine has ihtiyaçları vardır. Size özel esnek ve akılcı çözümler üretiyoruz.",
|
||
icon: <Users className="w-10 h-10 text-primary" />
|
||
}
|
||
];
|
||
|
||
const STATS = [
|
||
{ label: "Yıllık Tecrübe", value: "20+" },
|
||
{ label: "Tamamlanan Proje", value: "1500+" },
|
||
{ label: "Modern Araç Filosu", value: "25+" },
|
||
{ label: "Maksimum Kapasite", value: "500t" }
|
||
];
|
||
|
||
export default function AboutPage() {
|
||
return (
|
||
<main className="relative min-h-screen flex flex-col bg-background selection:bg-primary selection:text-on-primary">
|
||
<Navbar />
|
||
|
||
{/* Hero Section */}
|
||
<section className="relative h-[60vh] flex items-center justify-center overflow-hidden">
|
||
<div className="absolute inset-0 z-0">
|
||
<Image
|
||
src="https://images.unsplash.com/photo-1504307651254-35680f356dfd?q=80&w=2070&auto=format&fit=crop"
|
||
alt="Crane at sunset"
|
||
fill
|
||
sizes="100vw"
|
||
className="object-cover grayscale opacity-60"
|
||
/>
|
||
<div className="absolute inset-0 bg-gradient-to-b from-surface/40 to-surface/90"></div>
|
||
</div>
|
||
<div className="relative z-10 text-center px-4">
|
||
<h1 className="text-primary text-6xl md:text-8xl font-headline font-black tracking-tighter uppercase">
|
||
Hakkımızda
|
||
</h1>
|
||
<div className="h-1 w-24 bg-primary mx-auto mt-4 mb-6"></div>
|
||
<p className="text-on-surface text-lg md:text-xl max-w-2xl mx-auto font-light tracking-wide uppercase">
|
||
Dalaman'ın güvenilir çözüm ortağı: Tecrübe, güç ve hassasiyetle yükseliyoruz.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
{/* Our Story */}
|
||
<section className="py-24 px-8 md:px-16 bg-surface">
|
||
<div className="max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">
|
||
<div className="relative">
|
||
<div className="absolute -top-4 -left-4 w-24 h-24 border-t-4 border-l-4 border-primary"></div>
|
||
<div className="relative aspect-[4/3] w-full overflow-hidden">
|
||
<Image
|
||
src="https://images.unsplash.com/photo-1578319439584-104c94d37305?q=80&w=2070&auto=format&fit=crop"
|
||
alt="Crane operation"
|
||
fill
|
||
sizes="(max-width: 768px) 100vw, 50vw"
|
||
className="object-cover grayscale hover:grayscale-0 transition-all duration-700"
|
||
/>
|
||
</div>
|
||
<div className="absolute -bottom-8 -right-8 bg-primary p-8 hidden md:block">
|
||
<p className="text-on-primary font-headline font-black text-4xl">20+</p>
|
||
<p className="text-on-primary text-xs uppercase font-bold tracking-widest">Yıllık Tecrübe</p>
|
||
</div>
|
||
</div>
|
||
<div className="flex flex-col gap-6">
|
||
<span className="text-primary font-headline text-sm uppercase tracking-[0.3em]">Kurumsal Kimliğimiz</span>
|
||
<h2 className="text-4xl md:text-5xl font-headline font-bold text-on-surface leading-none uppercase">
|
||
Dalaman'ın Gücü, Sizin Güveniniz.
|
||
</h2>
|
||
<p className="text-on-surface-variant text-lg leading-relaxed">
|
||
Aydoğan Nakliyat Vinç olarak, Dalaman ve çevresinde uzun yıllardır güvenilirlik ve tecrübeyle hizmet vermekteyiz. Sektördeki köklü geçmişimizle, her projede en yüksek standartları hedefliyoruz.
|
||
</p>
|
||
<p className="text-on-surface-variant text-lg leading-relaxed">
|
||
Ağır yük nakliyatından hassas vinç operasyonlarına kadar, modern filomuz ve uzman kadromuzla projelerinizin her aşamasında yanınızdayız. Mühendislik odaklı yaklaşımımızla, en zorlu coğrafi koşullarda bile kusursuz hizmet sağlıyoruz.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
{/* Core Values */}
|
||
<section className="py-24 bg-surface-container-low border-y border-outline-variant/10">
|
||
<div className="max-w-7xl mx-auto px-8 md:px-16">
|
||
<div className="text-center mb-16">
|
||
<h2 className="text-3xl font-headline font-bold text-white uppercase tracking-wider">Temel Değerlerimiz</h2>
|
||
<div className="w-16 h-1 bg-primary mx-auto mt-4"></div>
|
||
</div>
|
||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-px bg-outline-variant/20">
|
||
{VALUES.map((value, index) => (
|
||
<div
|
||
key={index}
|
||
className="bg-surface-container p-8 border-b-4 border-transparent hover:border-primary transition-all group"
|
||
>
|
||
<div className="mb-6 transition-transform group-hover:scale-110 duration-300">
|
||
{value.icon}
|
||
</div>
|
||
<h3 className="text-xl font-headline font-bold text-white mb-3 uppercase tracking-tight">
|
||
{value.title}
|
||
</h3>
|
||
<p className="text-on-surface-variant text-sm leading-relaxed">
|
||
{value.description}
|
||
</p>
|
||
</div>
|
||
))}
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
{/* Mission & Vision */}
|
||
<section className="py-24 px-8 md:px-16 bg-surface">
|
||
<div className="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-2 gap-px bg-outline-variant/20 border border-outline-variant/20">
|
||
<div className="bg-surface-container-high p-12 lg:p-20">
|
||
<div className="flex items-center gap-4 mb-8">
|
||
<div className="w-12 h-12 bg-primary flex items-center justify-center">
|
||
<Rocket className="w-6 h-6 text-on-primary" />
|
||
</div>
|
||
<h2 className="text-3xl font-headline font-bold text-white uppercase tracking-tight">Misyonumuz</h2>
|
||
</div>
|
||
<p className="text-on-surface-variant text-lg leading-relaxed italic">
|
||
"Modern teknolojiyi geleneksel iş ahlakıyla birleştirerek, Dalaman bölgesindeki altyapı ve inşaat projelerine en güvenilir, en hızlı ve en profesyonel lojistik ve vinç desteğini sağlamak."
|
||
</p>
|
||
</div>
|
||
<div className="bg-surface-container-lowest p-12 lg:p-20">
|
||
<div className="flex items-center gap-4 mb-8">
|
||
<div className="w-12 h-12 bg-primary flex items-center justify-center">
|
||
<Eye className="w-6 h-6 text-on-primary" />
|
||
</div>
|
||
<h2 className="text-3xl font-headline font-bold text-white uppercase tracking-tight">Vizyonumuz</h2>
|
||
</div>
|
||
<p className="text-on-surface-variant text-lg leading-relaxed">
|
||
"Sektörde yenilikçi çözümlerimiz ve sarsılmaz güvenilirliğimizle, sadece Dalaman'da değil, tüm Ege ve Akdeniz bölgesinde ağır nakliyat ve vinç hizmetlerinde lider marka olmak."
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
{/* Stats */}
|
||
<section className="py-20 bg-primary">
|
||
<div className="max-w-7xl mx-auto px-8 md:px-16 flex flex-wrap justify-between gap-12 text-on-primary">
|
||
{STATS.map((stat, index) => (
|
||
<div key={index} className="flex flex-col items-center md:items-start">
|
||
<span className="text-5xl font-headline font-black">{stat.value}</span>
|
||
<span className="text-xs font-bold uppercase tracking-widest opacity-80">{stat.label}</span>
|
||
</div>
|
||
))}
|
||
</div>
|
||
</section>
|
||
|
||
<CTASection />
|
||
<Footer />
|
||
<FloatingWhatsApp />
|
||
</main>
|
||
);
|
||
}
|