96 lines
5.1 KiB
TypeScript
96 lines
5.1 KiB
TypeScript
"use client"
|
|
|
|
import Navbar from "@/components/navbar"
|
|
import Footer from "@/components/footer"
|
|
import { Card } from "@/components/ui/card"
|
|
import { ArrowLeft, Info } from "lucide-react"
|
|
import Link from "next/link"
|
|
import { useLanguage } from "@/lib/language-context"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
export default function ConditionsPage() {
|
|
const { t } = useLanguage()
|
|
|
|
return (
|
|
<main className="relative min-h-screen bg-slate-50">
|
|
<Navbar darkMode={true} />
|
|
|
|
{/* Background Decorations */}
|
|
<div className="fixed inset-0 pointer-events-none -z-10 overflow-hidden">
|
|
<div className="absolute top-1/4 -right-20 w-96 h-96 bg-primary/5 rounded-full blur-3xl opacity-30 animate-blob" />
|
|
<div className="absolute top-1/2 -left-20 w-80 h-80 bg-secondary/5 rounded-full blur-3xl opacity-30 animate-blob animation-delay-2000" />
|
|
</div>
|
|
|
|
{/* Header Section */}
|
|
<section className="relative pt-40 pb-32 overflow-hidden bg-[#D9A321]">
|
|
<div
|
|
className="absolute inset-0 bg-diagonal opacity-100 -z-10"
|
|
style={{ background: 'linear-gradient(135deg, #D9A321 0%, #1A1A1A 100%)' }}
|
|
/>
|
|
<div className="absolute bottom-0 left-0 w-full h-[100px] bg-slate-50 transform -skew-y-3 origin-bottom-left -z-10" />
|
|
|
|
<div className="max-w-7xl mx-auto px-6 relative z-10">
|
|
<Link href="/" className="inline-flex items-center text-white/70 hover:text-white mb-10 transition-colors group">
|
|
<div className="bg-white/10 p-2 rounded-full mr-3 group-hover:bg-white/20 transition-colors">
|
|
<ArrowLeft className="w-4 h-4" />
|
|
</div>
|
|
<span className="text-xs font-bold tracking-[0.2em] uppercase">{t.conditionsPage.back}</span>
|
|
</Link>
|
|
|
|
<div className="space-y-4">
|
|
<h1 className="text-5xl md:text-8xl font-black text-white tracking-tighter leading-none uppercase">
|
|
{t.conditionsPage.title} <br />
|
|
<span className="text-secondary/40 italic">{t.conditionsPage.titleAccent}</span>
|
|
</h1>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section className="py-24">
|
|
<div className="max-w-5xl mx-auto px-6">
|
|
<div className="grid grid-cols-1 gap-12">
|
|
{t.conditionsPage.sections.map((section: any, idx: number) => (
|
|
<div key={idx} className="relative">
|
|
{/* Section Header */}
|
|
<div className="flex items-center gap-4 mb-8">
|
|
<div className="bg-primary/10 p-2.5 rounded-xl">
|
|
<Info className="w-5 h-5 text-primary" />
|
|
</div>
|
|
<h2 className="text-2xl md:text-3xl font-black text-slate-900 uppercase tracking-tight">
|
|
{section.title}
|
|
</h2>
|
|
</div>
|
|
|
|
{/* Section Content */}
|
|
<Card className="p-8 md:p-12 rounded-[2.5rem] border-none shadow-xl bg-white space-y-6">
|
|
{section.content.map((paragraph: string, pIdx: number) => (
|
|
<p key={pIdx} className="text-slate-600 leading-relaxed font-medium text-lg">
|
|
{paragraph}
|
|
</p>
|
|
))}
|
|
</Card>
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
{/* Contact Info Footer */}
|
|
<div className="mt-24 bg-slate-900 rounded-[3rem] p-12 text-center text-white relative overflow-hidden shadow-2xl">
|
|
<div className="absolute top-0 right-0 w-64 h-64 bg-primary/10 rounded-full blur-3xl -mr-32 -mt-32" />
|
|
<p className="relative z-10 text-xl font-bold uppercase tracking-widest text-primary mb-4">
|
|
SkyFly Travel
|
|
</p>
|
|
<h2 className="relative z-10 text-3xl md:text-4xl font-black uppercase tracking-tighter mb-8">
|
|
{t.nav.contact}
|
|
</h2>
|
|
<div className="relative z-10 flex flex-wrap justify-center gap-8">
|
|
<a href="tel:+36305543838" className="font-bold text-lg hover:text-primary transition-colors">+36 30 5543838</a>
|
|
<a href="mailto:info@skyflytravel.hu" className="font-bold text-lg hover:text-primary transition-colors">info@skyflytravel.hu</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<Footer />
|
|
</main>
|
|
)
|
|
}
|