www_engage_os/src/components/Benefits.tsx
2025-06-18 16:44:30 +02:00

93 lines
5.0 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { Container } from '@/components/Container'
import Image from 'next/image'
import Benefits1 from '@/images/benefits/benefits1.jpg'
import Benefits2 from '@/images/benefits/benefits2.jpg'
import Benefits3 from '@/images/benefits/benefits3.jpg'
import Benefits4 from '@/images/benefits/benefits4.jpg'
export default function Benefits() {
return (
<div className="bg-white py-12">
<div className="mx-auto max-w-2xl px-6 lg:max-w-7xl lg:px-8">
<Container>
<div className="mx-auto max-w-2xl lg:mx-0 lg:max-w-3xl">
<h2 className="lg:text-4xl text-3xl font-medium tracking-tight text-gray-900">
Built Different. For a Change.
</h2>
<p className="mt-6 lg:text-lg text-base text-gray-600">
Engage OS isnt just another tech platform its a digital infrastructure built from the ground up for purpose-driven organizations. From white-label sovereignty to field-ready resilience, every element of Engage OS is designed to meet the real-world challenges of civil society.
</p>
</div>
</Container>
<div className="mt-10 grid grid-cols-1 gap-4 sm:mt-16 lg:grid-cols-6 lg:grid-rows-2">
<div className="flex p-px lg:col-span-4">
<div className="overflow-hidden rounded-lg bg-white ring-1 ring-black/15 max-lg:rounded-t-4xl lg:rounded-tl-4xl">
<Image
alt=""
src={Benefits1}
className="h-80 object-cover object-left"
/>
<div className="p-10">
<h3 className="text-sm/4 font-semibold text-gray-900"> Built for Civil Society</h3>
<p className="mt-2 text-lg font-medium tracking-tight text-gray-900">Purpose-First, Not Profit-First</p>
<p className="mt-2 max-w-lg text-sm/6 text-gray-600">
Unlike traditional SaaS built for commercial scale, Engage OS was born from the realities of NGOs, grassroots coalitions, and purpose-led institutions. Every module, flow, and metric is optimized to serve impact not ad revenue or venture capital.
</p>
</div>
</div>
</div>
<div className="flex p-px lg:col-span-2">
<div className="overflow-hidden rounded-lg bg-white ring-1 ring-black/15 lg:rounded-tr-4xl">
<Image
alt=""
src={Benefits2}
className="h-80 object-cover"
/>
<div className="p-10">
<h3 className="text-sm/4 font-semibold text-gray-900">White-Label, Zero-Code</h3>
<p className="mt-2 text-lg font-medium tracking-tight text-gray-900">Your Brand, Your Movements</p>
<p className="mt-2 max-w-lg text-sm/6 text-gray-600">
Engage OS empowers organizations to fully own their digital identity. From Red Cross OS to Montessori OS, each instance is custom-branded no tech team required. You launch a platform that looks and feels like you, not us.
</p>
</div>
</div>
</div>
<div className="flex p-px lg:col-span-2">
<div className="overflow-hidden rounded-lg bg-white ring-1 ring-black/15 lg:rounded-bl-4xl">
<Image
alt=""
src={Benefits3}
className="h-80 object-cover"
/>
<div className="p-10">
<h3 className="text-sm/4 font-semibold text-gray-900">Sovereign & Ethical Infrastructure</h3>
<p className="mt-2 text-lg font-medium tracking-tight text-gray-900">Own Your Data. Always.</p>
<p className="mt-2 max-w-lg text-sm/6 text-gray-600">
We dont mine or monetize user data. Engage OS runs on decentralized, privacy-respecting infrastructure built for trust, compliance, and sovereignty. You control where your data lives and who sees it.
</p>
</div>
</div>
</div>
<div className="flex p-px lg:col-span-4">
<div className="overflow-hidden rounded-lg bg-white ring-1 ring-black/15 max-lg:rounded-b-4xl lg:rounded-br-4xl">
<Image
alt=""
src={Benefits4}
className="h-80 object-cover object-left"
/>
<div className="p-10">
<h3 className="text-sm/4 font-semibold text-gray-900">Mutualized Model</h3>
<p className="mt-2 text-lg font-medium tracking-tight text-gray-900">Share Infrastructure. Multiply Impact.</p>
<p className="mt-2 max-w-lg text-sm/6 text-gray-600">
By pooling tech costs across aligned organizations, Engage OS offers enterprise-grade functionality at a fraction of the price. When one partner grows, the entire ecosystem benefits through shared modules, updates, and insights.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
)
}