import Image from 'next/image'
import React from 'react'

const Whatwedo = () => {
  return (
    <div className='Whatwedo bg-[#000] pt-16 pb-32 relative md:hidden lg:block'>
        {/* <div className='right_orange_sado'>
            <Image src="/images/right_orange_sado.png" className='w-100' alt="" />
        </div> */}
      <div className='max-w-7xl mx-auto px-10'>
        <div className='text-center pb-10'>
            <h2 data-aos="zoom-in" className="text-[30px] sm:text-[30px] lg:text-[52px] font-bold text-[#FFF] Manrope">What world see / What we do</h2>
        </div>

        <div className="container_laptop flex justify-center items-center">
            <div className="mockup mockup-macbook loaded opened relative">
                {/* Top Part */}
                <div className="part top relative">
                    <Image
                        src="https://d1xm195wioio0k.cloudfront.net/images/mockup/macbook-top.svg"
                        alt="MacBook Top"
                        width={1200} height={600}
                        className="top w-full absolute"
                    />
                    <Image src="/images/laptop_screen.png" alt="MacBook Cover" width={1200} height={600} className="cover w-full absolute"/>
                    {/* <Image src="https://d1xm195wioio0k.cloudfront.net/images/mockup/macbook-cover.svg" alt="MacBook Cover" className="cover w-full absolute"/> */}

                    {/* Video */}
                    {/* <video autoPlay muted loop className="w-full h-auto relative z-10">
                        <source src="/images/dummy_video.mp4" type="video/mp4"/>
                    </video> */}
                </div>

                {/* Bottom Part */}
                <div className="part bottom relative">
                    <Image
                        src="https://d1xm195wioio0k.cloudfront.net/images/mockup/macbook-cover.svg"
                        alt="MacBook Cover"
                        width={1200} height={600}
                        className="cover w-full absolute"
                    />
                    <Image src="/images/laptop_keyboard.png" alt="MacBook Bottom" width={1200} height={600} className="bottom w-full absolute" />
                </div>
            </div>
        </div>

      </div>
    </div>
  )
}

export default Whatwedo
