import React from 'react';

const Advantage = ({className, icon, title, description}) => {
    return (
        <div className={['flex max-md:justify-center max-md:mb-5', className].join(' ')}>
            <div className='flex flex-col items-center text-center'>
                <div className='bg-yellow-400 rounded-lg w-16 h-16 max-md:w-12 max-md:h-12 flex justify-center items-center mb-4'>{icon}</div>
                <h3 className='text-gray-900 font-semibold text-2xl max-md:text-base max-lg:text-xl mb-3'>{title}</h3>
                <p className='text-gray-500 font-medium text-base max-md:text-sm leading-6'>{description}</p>
            </div>
        </div>
    );
}

export default Advantage;