44 lines
1.5 KiB
TypeScript
44 lines
1.5 KiB
TypeScript
import DotAnimatsiya from "@/components/dot/DotAnimatsiya";
|
|
|
|
export function ProductBanner() {
|
|
return (
|
|
<section className="relative w-full h-[60vh] min-h-100 overflow-hidden pt-10">
|
|
{/* Background Image */}
|
|
<div
|
|
className="absolute inset-0 z-0"
|
|
style={{
|
|
backgroundImage: "url(/images/blog/banner.jpg)",
|
|
backgroundSize: "cover",
|
|
backgroundPosition: "center",
|
|
}}
|
|
/>
|
|
|
|
{/* Gradient Overlay - Bottom-left to top-right */}
|
|
<div
|
|
className="absolute inset-0 z-10"
|
|
style={{
|
|
background: `linear-gradient(to top right, #d2610a 0%, #1e1d1ce3 30%, #1e1d1ce3 100%)`,
|
|
}}
|
|
/>
|
|
|
|
<div className="max-w-250 w-full mx-auto px-4">
|
|
<div className="relative z-20 h-full flex max-lg:flex-col items-start justify-between gap-5 pt-30">
|
|
<div className="spacw-y-4 ">
|
|
<DotAnimatsiya />
|
|
<p
|
|
className=" bg-linear-to-br from-white via-white to-black
|
|
text-transparent bg-clip-text text-4xl sm:text-5xl lg:text-6xl font-bold leading-tight text-pretty"
|
|
>
|
|
Ignum technology <br /> At The Ready
|
|
</p>
|
|
</div>
|
|
<div className="lg:w-[40%] text-gray-300 lg:mt-20 md:mt-10 sm:mt-5 ">
|
|
It emphasizes that these firefighters are there not just as public
|
|
servants but as a vital part of the community.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|