69 lines
2.8 KiB
TypeScript
69 lines
2.8 KiB
TypeScript
export function TinkerSection() {
|
||
return (
|
||
<section className="relative px-[20px] py-[60px] md:py-[100px] overflow-hidden">
|
||
<div className="mx-auto flex max-w-[1260px] flex-col gap-[50px] lg:flex-row lg:items-center">
|
||
|
||
{/* Left Column - Images */}
|
||
<div className="relative flex w-full flex-col items-center justify-center lg:w-1/2">
|
||
{/* Background Glow */}
|
||
<div className="absolute inset-0 z-0 flex items-center justify-center pointer-events-none">
|
||
<img
|
||
src="https://8ded8880.delivery.rocketcdn.me/themes/aiero/wp-content/uploads/2025/02/Group-18433.svg"
|
||
alt=""
|
||
className="w-[120%] max-w-[800px] h-auto object-contain opacity-80"
|
||
aria-hidden="true"
|
||
/>
|
||
</div>
|
||
{/* Big X Image */}
|
||
<div className="relative z-10 w-full max-w-[450px]">
|
||
<img
|
||
src="https://8ded8880.delivery.rocketcdn.me/themes/aiero/wp-content/uploads/2025/01/Vector-13.png"
|
||
alt="Neural Network Visualization"
|
||
className="w-full h-auto"
|
||
/>
|
||
</div>
|
||
</div>
|
||
|
||
{/* Right Column - Text & Partners */}
|
||
<div className="relative z-10 flex w-full flex-col lg:w-1/2 lg:pl-[5%]">
|
||
<h2
|
||
className="mb-[60px] text-aiero-dark tracking-[-0.03em]"
|
||
style={{
|
||
fontFamily: "var(--font-dm-sans)",
|
||
fontSize: "clamp(36px, 4.5vw, 65px)",
|
||
fontWeight: 500,
|
||
lineHeight: 1.1,
|
||
}}
|
||
>
|
||
Tinker with a <span className="gradient-text-purple">Neural Network right here</span> in your browser. Don’t worry, you can’t break it. We Promise.
|
||
</h2>
|
||
|
||
{/* Partners row */}
|
||
<div className="flex flex-wrap items-center justify-start gap-x-[40px] gap-y-[30px]">
|
||
<img
|
||
src="https://8ded8880.delivery.rocketcdn.me/themes/aiero/wp-content/uploads/2024/12/partners-1.png"
|
||
alt="Partner 1"
|
||
className="h-auto w-[140px] object-contain"
|
||
/>
|
||
<img
|
||
src="https://8ded8880.delivery.rocketcdn.me/themes/aiero/wp-content/uploads/2024/12/partners-2.png"
|
||
alt="Partner 2"
|
||
className="h-auto w-[130px] object-contain"
|
||
/>
|
||
<img
|
||
src="https://8ded8880.delivery.rocketcdn.me/themes/aiero/wp-content/uploads/2024/12/partners-3.png"
|
||
alt="Partner 3"
|
||
className="h-auto w-[100px] object-contain"
|
||
/>
|
||
<img
|
||
src="https://8ded8880.delivery.rocketcdn.me/themes/aiero/wp-content/uploads/2024/12/partners-4.png"
|
||
alt="Partner 4"
|
||
className="h-auto w-[140px] object-contain"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
);
|
||
}
|