veda/www_veda_2025
12
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ok

Browse Source
This commit is contained in:
sasha-astiadi
2025-08-21 16:13:23 +02:00
parent 563ff04ae5
commit 82394b564f
20 changed files with 239 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
src/components/Experiences.jsx
View File

@@ -1,71 +1,68 @@
export function Experiences() {
return (
<div className=" py-12">
<div className="mx-auto max-w-2xl px-6 lg:max-w-7xl lg:px-8 ">
<p className="mt-2 max-w-lg text-3xl font-semibold tracking-[-0.05em] text-[#1f4922] lg:text-4xl">
Experiences
<div className="pt-16 sm:pt-24 pb-12">
<div className="mx-auto max-w-2xl px-4 lg:max-w-7xl lg:px-6">
<p className="mt-2 max-w-lg text-2xl sm:text-3xl font-semibold tracking-[-0.05em] text-darkgr-700 lg:text-4xl">
Programs
</p>
<p className="mt-4 max-w-5xl text-2xl font-medium tracking-[-0.045em] lg:text-3xl text-[#1f4922]">
From intimate community gatherings to professional retreats, VEDA offers transformative experiences on the Nile. Each space is thoughtfully designed to foster connection, creativity, and personal growth in an inspiring riverside setting.
<p className="mt-4 max-w-5xl text-lg sm:text-2xl font-medium tracking-[-0.045em] lg:text-3xl text-darkgr">
From intimate community gatherings to professional retreats, VEDA offers transformative programs on the Nile. Each space is thoughtfully designed to foster connection, creativity, and personal growth in an inspiring riverside setting.
</p>
<div className="mt-10 grid grid-cols-1 gap-4 sm:mt-16 lg:grid-cols-8 lg:grid-rows-2">
<div className="mt-8 sm:mt-16 grid grid-cols-1 gap-4 lg:grid-cols-8 lg:grid-rows-2">
<div className="flex p-px lg:col-span-5">
<div className="w-full overflow-hidden rounded-lg bg-[#3d2704] shadow-sm outline outline-black/5 max-lg:rounded-t-4xl lg:rounded-tl-4xl">
<div className="h-80 w-full overflow-hidden">
<img
alt=""
src="/images/community.jpg"
className="h-full w-full object-cover object-center"
/>
</div>
<div className="w-full overflow-hidden rounded-lg shadow-sm outline outline-black/5 max-lg:rounded-t-4xl lg:rounded-tl-4xl relative isolate flex flex-col justify-end">
<img
alt=""
src="/images/community.jpg"
className="absolute inset-0 -z-10 h-full w-full object-cover object-center"
/>
<div className="absolute inset-0 -z-10 bg-gradient-to-t from-gray-900 via-gray-900/40" />
<div className="px-8 py-4">
<p className="mt-2 text-lg font-semibold tracking-normal text-[#FEFFF6]">Community building Space</p>
<p className="mt-1 pb-2 text-sm lg:text-base font-medium text-[#FEFFF6]/80">Foster connections and meaningful relationships through shared experiences.</p>
</div>
</div>
</div>
<div className="flex p-px lg:col-span-3">
<div className="w-full overflow-hidden rounded-lg bg-[#3d2704] shadow-sm outline outline-black/5 lg:rounded-tr-4xl">
<div className="h-80 w-full overflow-hidden">
<img
alt=""
src="/images/private.jpg"
className="h-full w-full object-cover object-center"
/>
</div>
<div className="w-full overflow-hidden rounded-lg shadow-sm outline outline-black/5 lg:rounded-tr-4xl relative isolate flex flex-col justify-end h-80">
<img
alt=""
src="/images/private.jpg"
className="absolute inset-0 -z-10 h-full w-full object-cover object-center"
/>
<div className="absolute inset-0 -z-10 bg-gradient-to-t from-gray-900 via-gray-900/40" />
<div className="px-8 py-4">
<p className="mt-2 text-lg font-semibold tracking-normal text-[#FEFFF6]">Private Retreats</p>
<p className="mt-1 text-sm lg:text-base font-medium text-[#FEFFF6]/80">Exclusive experiences tailored for intimate groups and families.</p>
</div>
</div>
</div>
<div className="flex p-px lg:col-span-3">
<div className="w-full overflow-hidden rounded-lg bg-[#3d2704] shadow-sm outline outline-black/5 lg:rounded-bl-4xl">
<div className="h-80 w-full overflow-hidden">
<img
alt=""
src="/images/events.jpg"
className="h-full w-full object-cover object-center"
/>
</div>
<div className="w-full overflow-hidden rounded-lg shadow-sm outline outline-black/5 lg:rounded-bl-4xl relative isolate flex flex-col justify-end h-80">
<img
alt=""
src="/images/events.jpg"
className="absolute inset-0 -z-10 h-full w-full object-cover object-center"
/>
<div className="absolute inset-0 -z-10 bg-gradient-to-t from-gray-900 via-gray-900/40" />
<div className="px-8 py-4">
<p className="mt-2 text-lg lg:text-xl font-semibold tracking-normal text-[#FEFFF6]">Events & Conferences</p>
<p className="mt-1 pb-2 text-sm lg:text-base font-medium text-[#FEFFF6]/80">Professional gatherings in an inspiring riverside setting.</p>
</div>
</div>
</div>
<div className="flex p-px lg:col-span-5">
<div className="w-full overflow-hidden rounded-lg bg-[#3d2704] shadow-sm outline outline-black/5 max-lg:rounded-b-4xl lg:rounded-br-4xl">
<div className="h-80 w-full overflow-hidden">
<img
alt=""
src="/images/nomads.jpg"
className="h-full w-full object-cover object-center"
/>
</div>
<div className="w-full overflow-hidden rounded-lg shadow-sm outline outline-black/5 max-lg:rounded-b-4xl lg:rounded-br-4xl relative isolate flex flex-col justify-end h-80">
<img
alt=""
src="/images/nomads.jpg"
className="absolute inset-0 -z-10 h-full w-full object-cover object-center"
/>
<div className="absolute inset-0 -z-10 bg-gradient-to-t from-gray-900 via-gray-900/40" />
<div className="px-8 py-4">
<p className="mt-2 text-lg font-semibold tracking-normal text-[#FEFFF6]">Digital Nomad Hub</p>
<p className="mt-1 pb-2 text-sm lg:text-base font-medium text-[#FEFFF6]/80">Work remotely while surrounded by the tranquility of the Nile.</p>
</div>
</div>
</div>