You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

40 lines
1.3 KiB

1 month ago
import Image from "next/image";
interface ContactHeroProps {
title: string;
subtitle?: string;
image?: string;
}
export function ContactHero({ title, subtitle, image = "/img/6.png" }: ContactHeroProps) {
return (
<section className="relative isolate overflow-hidden bg-[#e9efff]">
<div className="absolute inset-0">
<Image
src={image}
alt=""
fill
priority
sizes="100vw"
className="object-cover"
/>
<div className="absolute inset-0 bg-gradient-to-br from-[#e6f0ff]/90 via-white/88 to-white" />
</div>
<div className="relative mx-auto flex max-w-5xl flex-col items-center px-4 py-20 text-center md:px-6 md:py-24">
<span className="rounded-full border border-white/60 bg-white/60 px-4 py-1 text-xs font-semibold uppercase tracking-[0.3em] text-[#5f7dff] shadow-[0_12px_30px_rgba(87,125,255,0.25)]">
Partner With Us
</span>
<h1 className="mt-6 text-3xl font-semibold tracking-tight text-[#0d1b46] md:text-[40px]">
{title}
</h1>
{subtitle && (
<p className="mt-4 max-w-2xl text-sm leading-relaxed text-[#51689b] md:text-lg">
{subtitle}
</p>
)}
</div>
</section>
);
}