forked from amnannn/rekan_ai
55 lines
2.7 KiB
JavaScript
55 lines
2.7 KiB
JavaScript
import { component11, wagreen, hs } from "../asset";
|
|
|
|
export default function HeadPersonal() {
|
|
return (
|
|
<div className="container mx-auto px-4 lg:px-6">
|
|
<div className="grid grid-cols-1 lg:grid-cols-2 items-center gap-12 py-8 mt-[200px] lg:mt-[85px]">
|
|
{/* Left Column */}
|
|
<div className="space-y-6 md:-mt-40 -mt-28 text-center lg:text-left order-1 lg:order-none">
|
|
{/* Logo and Tagline */}
|
|
<div className="flex items-center lg:justify-start">
|
|
<span className="flex items-center justify-center w-[53.52px] h-[43px] ml-[2px] mb-4">
|
|
<img src={component11} alt="Logo" width={53.52} height={43} />
|
|
</span>
|
|
<span className="inline-flex items-center ml-[17px] justify-center bg-pink-600 text-white px-4 py-2 rounded-[14px] text-base sm:text-lg md:text-xl mt-[-20px] lg:text-2xl text-center">
|
|
# Solusi Startup
|
|
</span>
|
|
</div>
|
|
|
|
{/* Header Text */}
|
|
<h1 className="text-[32px] lg:text-[30px] text-customBlack font-semibold mt-7">
|
|
Tumbuh Lebih Cepat dengan Automasi dan Analisis yang Terjangkau
|
|
</h1>
|
|
|
|
{/* Description */}
|
|
<p className="text-[20px] lg:text-[18px] text-customBlack mt-7">
|
|
Rekan AI hadir sebagai mitra terpercaya bagi Startup di seluruh Indonesia. Dengan solusi berbasis teknologi, kami membantu para pelaku pengembang Startup untuk bekerja lebih cerdas, mengurangi beban operasional, dan mencapai pertumbuhan yang berkelanjutan.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Right Column - Hero Image */}
|
|
<div className="order-2 lg:order-none flex justify-center">
|
|
<img
|
|
src={hs}
|
|
alt="Hero Illustration"
|
|
width={716}
|
|
height={743}
|
|
className="w-full h-auto md:w-[600px] md:h-[600px]"
|
|
/>
|
|
</div>
|
|
|
|
{/* Buttons - Ensure they come last on mobile */}
|
|
<div className="flex flex-col sm:flex-row gap-4 md:-mt-96 order-3 lg:order-none">
|
|
<button className="flex items-center justify-center px-6 py-3 border-2 md:w-[245px] md:h-[55px] border-customRed rounded-[14px] text-customRed font-medium text-base lg:text-lg hover:bg-pink-50 transition-colors">
|
|
<img src={wagreen} alt="WhatsApp Icon" width={30} height={30} className="mr-2" />
|
|
Konsultasi Gratis
|
|
</button>
|
|
<button className="flex items-center justify-center px-6 py-3 rounded-[14px] md:w-[245px] md:h-[55px] bg-gradient-to-r from-[#DC0168] to-[#5B59E8] text-white font-medium text-base lg:text-lg hover:opacity-90 transition-opacity">
|
|
Coba Sekarang
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|