export function ClientLogosInCard() {
  return (
    <section className="py-24">
      <div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
        <div className="mb-14 text-center">
          <h1 className="text-center text-4xl font-bold text-gray-900">
            Some of our valuable clients
          </h1>
        </div>
      </div>
      <div className="relative grid gap-y-8 overflow-hidden">
        <div className="flex flex-nowrap items-center gap-8">
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
        </div>
        <div className="flex flex-nowrap items-center gap-8">
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
          <div className="flex h-36 w-56 cursor-pointer items-center justify-center rounded border-t-4 border-solid border-gray-200 bg-white transition-all duration-500 hover:border-indigo-600">
            {/* SVG removed */}
          </div>
        </div>
      </div>
    </section>
  )
}