import { Link } from "react-router-dom"
import { chek2, wagreen, start33, start44, start55 } from "../asset"
function Kenapa() {
  return (
    <div className="container mx-auto flex justify-center items-center bg-customWhite mt-5 min-h-screen">
      <div className="flex flex-col md:flex-row bg-customWhite rounded-lg overflow-hidden relative pt-16 md:pt-52">
        {/* Image Section */}
        <div className="relative w-full md:w-2/5 p-5 flex justify-center md:ml-14 md:justify-start">
          <img
            src={start55 || "/placeholder.svg"}
            alt="Woman with Tablet"
            className="w-full md:w-[654.5px] max-h-[609.67px] h-auto object-contain"
          />
        </div>

        {/* Text Section */}
        <div className="w-full md:w-3/5 p-6 md:p-10 flex flex-col items-center md:items-start md:mr-28 text-center md:text-left text-[#212121] ">
          <h2 className="text-[30px] font-semibold">Mengapa Rekan AI untuk Corporate Business?</h2>
          <p className="mt-4 text-sm md:leading-8 md:text-lg">
            Rekan AI dirancang khusus untuk mendukung kebutuhan bisnis berskala besar dengan menghadirkan solusi yang dapat meningkatkan efisiensi, mempercepat proses, dan membantu pengambilan keputusan strategis. Dengan teknologi mutakhir yang fleksibel dan aman, Rekan AI menjadi mitra terpercaya dalam perjalanan transformasi digital perusahaan Anda.
          </p>
          <ul className="mt-8 space-y-4 md:space-y-6 text-[16px] md:max-w-[70%]  font-medium">
            <li className="flex items-center ">
              <img src={chek2 || "/placeholder.svg"} alt="Check" className="w-6 h-6 md:w-11 md:h-11 mr-3" />
              Standar keamanan tinggi dengan enkripsi dan sertifikasi resmi yang melindungi data perusahaan.
            </li>
            <li className="flex items-center">
              <img src={chek2 || "/placeholder.svg"} alt="Check" className="w-6 h-6 md:w-11 md:h-11 mr-3" />
              Solusi yang fleksibel dan dapat diimplementasikan di berbagai cabang perusahaan di seluruh dunia.            </li>
            <li className="flex items-center">
              <img src={chek2 || "/placeholder.svg"} alt="Check" className="w-6 h-6 md:w-11 md:h-11 mr-3" />
              Automasi dan integrasi sistem yang mempercepat proses bisnis dan memangkas biaya operasional.            </li>
          </ul>

          <div className="flex flex-col md:flex-row mt-8 md:mt-20 space-y-4 md:space-y-0 md:space-x-10 w-full mb-[112px]">
            <button className="flex items-center justify-center w-full md:w-[270px] h-[50px] md:h-[70px] border-2 border-[#CA2B68] text-[#CA2B68] md:text-xl font-medium rounded-[14px] hover:bg-white hover:bg-opacity-10 transition">
              <img
                src={wagreen || "/placeholder.svg"}
                alt="WhatsApp Icon"
                className="mr-2 w-4 h-4 md:w-[30px] md:h-[30px]"
              />
              Konsultasi Gratis
            </button>
            <Link to={"/Contact#form"}>
              <button className="w-full md:w-[276px] h-[50px] md:h-[70px] bg-gradient-to-r from-pink-700 to-indigo-600 text-white md:text-xl font-medium rounded-[14px] hover:opacity-90 transition">
                Coba Sekarang
              </button>
            </Link>
          </div>
        </div>
      </div>
    </div>
  )
}

export default Kenapa

