export function OurGrowthInNumbersStats() {
  return (
    <section className="font-inter py-20">
      <div className="mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8">
        <div className="flex flex-col items-center gap-8 lg:flex-row">
          <div className="flex flex-col gap-4 lg:w-2/5">
            <h2 className="font-manrope text-center text-3xl font-semibold text-black lg:text-start">
              Our Growth in Numbers
            </h2>
            <p className="text-center text-base leading-7 font-normal text-gray-600 lg:text-start">
              Our growth is more than just words—it’s in the numbers. Discover
              how we’ve scaled our operations, improved results
            </p>
            <button className="mx-auto mt-6 flex w-fit justify-center rounded-full bg-indigo-600 px-6 py-3 text-base font-semibold text-white shadow-sm transition-all duration-500 hover:bg-indigo-700 lg:mx-0">
              Lets get started
            </button>
          </div>
          <div>
            <div className="flex flex-col items-center justify-between gap-8 sm:flex-row">
              <div className="flex flex-col items-center justify-center gap-4 rounded-xl bg-gray-50 px-5 py-11">
                <h4 className="font-manrope text-center text-4xl font-bold text-black">
                  260+
                </h4>
                <p className="text-center text-lg leading-8 font-normal text-gray-600">
                  Expert Consultants
                </p>
              </div>
              <div className="flex flex-col items-center justify-center gap-4 rounded-xl bg-gray-50 px-5 py-11">
                <h4 className="font-manrope text-center text-4xl font-bold text-black">
                  724+
                </h4>
                <p className="text-center text-lg leading-8 font-normal text-gray-600">
                  Projects Delivered
                </p>
              </div>
              <div className="flex flex-col items-center justify-center gap-4 rounded-xl bg-gray-50 px-5 py-11">
                <h4 className="font-manrope text-center text-4xl font-bold text-black">
                  175+
                </h4>
                <p className="text-center text-lg leading-8 font-normal text-gray-600">
                  Team members
                </p>
              </div>
            </div>
            <div className="flex flex-col items-center justify-center gap-8 sm:mt-8 sm:flex-row">
              <div className="flex flex-col items-center justify-center gap-4 rounded-xl bg-gray-50 px-5 py-11">
                <h4 className="font-manrope text-center text-4xl font-bold text-black">
                  260+
                </h4>
                <p className="text-center text-lg leading-8 font-normal text-gray-600">
                  Expert Consultants
                </p>
              </div>
              <div className="flex flex-col items-center justify-center gap-4 rounded-xl bg-gray-50 px-5 py-11">
                <h4 className="font-manrope text-center text-4xl font-bold text-black">
                  724+
                </h4>
                <p className="text-center text-lg leading-8 font-normal text-gray-600">
                  Projects Delivered
                </p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}