import imgModel from "../assets/model.jpg" 

const About = () => {


  return (
    <div data-scroll data-scroll-speed="-0.15" className='about-text w-full  pt-20 pb-20 bg-[#CDEA68] rounded-t-3xl'>
        <div className="max-w-[1600px]">
            <h1 className="text-[3.2vw] leading-[4vw] tracking-tight px-16">Ochi is a strategic partner for fast-growing tech businesses that need to raise funds, sell products, 
            explain complex ideas, and hire great people. </h1>
        </div>

        <div className="border-t-[1px] border-[#98AC52] mt-10"></div>

        <div className="px-16 mt-5 grid grid-cols-2 gap-3">
            <div className="text-[1vw]">What you can expect:</div>
            <div className="grid grid-cols-2">
                <div className="text-[1vw] pr-10">
                    <p className=" mb-5">We create tailored presentations to help you persuade your colleagues, clients, or investors. 
                        Whether it’s live or digital, delivered for one or a hundred people. </p> <br />
                    <p>We believe the mix of strategy and design (with a bit of coffee) is what makes your message clear, convincing, and captivating.</p>
                </div>
                <div className="flex flex-col justify-center text-[1vw] mx-40 -mb-20">
                    <p className="mb-4">S:</p>
                    <p>Instagram </p>
                    <p>Behance </p>
                    <p>Facebook </p>
                    <p>Linkedin </p>
                </div>
            </div>
        </div>

        <div className="border-t-[1px] border-[#98AC52] mt-40"></div>

        <div className="flex px-16 mt-5">
            <div className="  w-1/2">
                <p className="text-7xl text-[#212121] mb-8">Our approach:</p>
                <button className="btn flex justify-center items-center gap-8">
                    <p className="text-[19px] uppercase">Read More</p>
                    <span className="w-3 h-3 bg-white rounded-full"></span>
                </button>
            </div>
            <div className="w-1/2 h-[70vh]"><img src={imgModel} alt="" className="rounded-xl h-full "/></div>
        </div>
        

    </div>
  )
}

export default About