44 lines
2.2 KiB
TypeScript
44 lines
2.2 KiB
TypeScript
import { ArrowRight } from "lucide-react";
|
|
import { Link } from "@/i18n/routing";
|
|
// 🔥 IMPORTAMOS LA VERSIÓN DE SERVIDOR
|
|
import { getTranslations } from "next-intl/server";
|
|
|
|
export default async function PatrizioLegacy() {
|
|
const t = await getTranslations("PatrizioLegacy");
|
|
|
|
return (
|
|
<section id="legacy" className="relative w-full max-w-7xl mx-auto px-6 py-32 md:py-48 z-10">
|
|
|
|
<div className="absolute inset-0 bg-white/50 dark:bg-[#0A0A0C]/70 backdrop-blur-2xl rounded-[4rem] -z-10 [mask-image:radial-gradient(ellipse_at_center,black_40%,transparent_70%)] transition-colors duration-700" />
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-12 md:gap-24 items-center relative z-10">
|
|
|
|
<div className="animate-fade-in-up">
|
|
<h2 className="text-xs font-semibold tracking-widest text-[#0066CC] dark:text-[#4DA6FF] uppercase mb-6 transition-colors">
|
|
{t("subtitle")}
|
|
</h2>
|
|
<h3 className="text-5xl md:text-6xl lg:text-7xl font-light text-[#1D1D1F] dark:text-[#F5F5F7] tracking-tight leading-[1.05] transition-colors">
|
|
{t("title1")} <br />
|
|
<span className="font-medium italic text-black/40 dark:text-white/40 transition-colors">
|
|
{t("title2")}
|
|
</span>
|
|
</h3>
|
|
</div>
|
|
|
|
<div className="flex flex-col justify-center animate-fade-in-up delay-200">
|
|
<p className="text-lg md:text-xl font-light text-[#86868B] dark:text-[#A1A1A6] mb-6 leading-relaxed transition-colors">
|
|
{t("p1_1")}<span className="font-medium text-[#1D1D1F] dark:text-[#F5F5F7] transition-colors">{t("p1_2")}</span>{t("p1_3")}
|
|
</p>
|
|
<p className="text-lg md:text-xl font-light text-[#86868B] dark:text-[#A1A1A6] mb-10 leading-relaxed transition-colors">
|
|
{t("p2")}
|
|
</p>
|
|
|
|
<Link href="/heritage" className="inline-flex items-center gap-2 text-sm font-semibold text-[#1D1D1F] dark:text-white group hover:text-[#0066CC] dark:hover:text-[#4DA6FF] transition-colors">
|
|
{t("button")} <ArrowRight size={16} className="group-hover:translate-x-1 transition-transform" />
|
|
</Link>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
);
|
|
} |