const CategoryCard = ({ img, label }: any) => (
  <a href="#" className="flex flex-col items-center group cursor-pointer">
    <div className="w-20 h-20 md:w-28 md:h-28 rounded-full overflow-hidden border-2 border-transparent group-hover:border-amber-400 transition-all duration-300 shadow-md">
      <img src={img} alt={label} className="w-full h-full object-cover group-hover:scale-105 transition-transform duration-300" />
    </div>
    <p className="mt-2 font-montserrat text-xs md:text-sm font-medium text-[#30232a] group-hover:text-amber-600 transition-colors text-center">{label}</p>
  </a>
);

export default CategoryCard