const ClientsSection = () => {
  return (
    <section
      id="clients"
      className="h-screen w-full dark:bg-black flex flex-col items-center justify-center overflow-hidden"
    >
      <div className="p-4 max-w-7xl mx-auto relative z-10 w-full pt-20 md:pt-0">
        <h1 className="text-4xl md:text-7xl font-bold text-center bg-clip-text text-transparent bg-gradient-to-b from-neutral-600 to-neutral-400 dark:from-neutral-600 dark:to-white bg-opacity-50 p-2">
          Clients <br /> from all over the globe.
        </h1>
        <p className="mt-4 font-normal text-base text-neutral-500 dark:text-neutral-300 max-w-lg text-center mx-auto">
          Spotlight effect is a great way to draw attention to a specific part
          of the page. Here, we are drawing the attention towards the text
          section of the page. I don&apos;t know why but I&apos;m running out of
          copy.
        </p>
      </div>
    </section>
  );
};

export default ClientsSection;