49 lines
2.4 KiB
TypeScript
49 lines
2.4 KiB
TypeScript
import { CheckCircle2 } from "lucide-react";
|
|
|
|
export function BenefitsGridSection() {
|
|
return (
|
|
<section className="relative overflow-hidden bg-white px-[20px] pb-[60px] md:pb-[100px]">
|
|
<div className="mx-auto max-w-[1260px]">
|
|
<div className="grid grid-cols-1 gap-[30px] md:grid-cols-3">
|
|
{/* Card 1 */}
|
|
<div className="flex flex-col gap-[20px] rounded-[25px] border border-tenext-card-border p-[40px] transition-transform duration-300 hover:-translate-y-2">
|
|
<h4 className="text-[22px] font-bold leading-[1.3] text-tenext-dark font-[var(--font-sora)]">
|
|
Predictable outcomes from your IT investments
|
|
</h4>
|
|
<ul className="flex flex-col gap-[15px] mt-[10px]">
|
|
<li className="flex items-start gap-[10px] text-[16px] text-tenext-text-muted">
|
|
<span className="mt-[5px] h-[6px] w-[6px] rounded-full bg-tenext-accent-teal shrink-0"></span>
|
|
Lowest total cost of ownership
|
|
</li>
|
|
<li className="flex items-start gap-[10px] text-[16px] text-tenext-text-muted">
|
|
<span className="mt-[5px] h-[6px] w-[6px] rounded-full bg-tenext-accent-teal shrink-0"></span>
|
|
Accelerated time to value
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Card 2 */}
|
|
<div className="flex flex-col gap-[20px] rounded-[25px] border border-tenext-card-border p-[40px] transition-transform duration-300 hover:-translate-y-2">
|
|
<h4 className="text-[22px] font-bold leading-[1.3] text-tenext-dark font-[var(--font-sora)]">
|
|
Built to fit your existing business processes
|
|
</h4>
|
|
<p className="text-[16px] leading-[1.6] text-tenext-text-muted mt-[10px]">
|
|
Seamless integration with existing systems and platforms, on a
|
|
scalable and flexible architecture engineered for the long term.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Card 3 (OpenAI Logo) */}
|
|
<div className="flex items-center justify-center rounded-[25px] border border-tenext-card-border bg-[#F8F9FA] p-[40px] transition-transform duration-300 hover:-translate-y-2">
|
|
<img
|
|
src="/images/tenext/openai-logo-1.png"
|
|
alt="OpenAI Logo"
|
|
className="w-[180px] h-auto object-contain"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|