<section class="body-font text-gray-600 max-w-screen-2xl mr-auto ml-auto">
  <div
    class="container pl-5 pr-5 px-5 pt-24 pb-24 py-24 ml-auto mr-auto mx-auto"
  >
    <div class="text-center mb-20">
      <h1
        class="title-font text-2xl font-medium text-center text-gray-900 mb-4 sm:text-3xl"
      >
        Streamlined Workflow Essentials
      </h1>
      <p
        class="text-base leading-relaxed ml-auto mr-auto mx-auto lg:w-3/4 xl:w-2/4"
      >
        Optimize your team&apos;s efficiency with tools designed to enhance
        communication, automate tasks, and deliver faster results without
        compromising quality.
      </p>
    </div>
    <div
      class="-mx-2 flex flex-wrap sm:ml-auto sm:mr-auto sm:mx-auto sm:mb-2 lg:w-4/5"
    >
      <div class="pt-2 pr-2 pb-2 pl-2 w-full sm:w-1/2">
        <div
          class="bg-gray-100 rounded flex pt-4 pr-4 pb-4 pl-4 h-full items-center"
        >
          <svg
            fill="none"
            stroke="currentColor"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="3"
            class="flex-shrink-0 text-indigo-500 w-6 h-6 mr-4"
            viewBox="0 0 24 24"
          >
            <path d="M22 11.08V12a10 10 0 11-5.93-9.14"></path>
            <path d="M22 4L12 14.01l-3-3"></path>
          </svg>
          <span class="title-font font-medium">Automated Task Routing</span>
        </div>
      </div>
      <div class="pt-2 pr-2 pb-2 pl-2 w-full sm:w-1/2">
        <div
          class="bg-gray-100 rounded flex pt-4 pr-4 pb-4 pl-4 h-full items-center"
        >
          <svg
            fill="none"
            stroke="currentColor"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="3"
            class="flex-shrink-0 text-indigo-500 w-6 h-6 mr-4"
            viewBox="0 0 24 24"
          >
            <path d="M22 11.08V12a10 10 0 11-5.93-9.14"></path>
            <path d="M22 4L12 14.01l-3-3"></path>
          </svg>
          <span class="title-font font-medium">Real-Time Status Updates</span>
        </div>
      </div>
      <div class="pt-2 pr-2 pb-2 pl-2 w-full sm:w-1/2">
        <div
          class="bg-gray-100 rounded flex pt-4 pr-4 pb-4 pl-4 h-full items-center"
        >
          <svg
            fill="none"
            stroke="currentColor"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="3"
            class="flex-shrink-0 text-indigo-500 w-6 h-6 mr-4"
            viewBox="0 0 24 24"
          >
            <path d="M22 11.08V12a10 10 0 11-5.93-9.14"></path>
            <path d="M22 4L12 14.01l-3-3"></path>
          </svg>
          <span class="title-font font-medium">Intelligent Notifications</span>
        </div>
      </div>
      <div class="pt-2 pr-2 pb-2 pl-2 w-full sm:w-1/2">
        <div
          class="bg-gray-100 rounded flex pt-4 pr-4 pb-4 pl-4 h-full items-center"
        >
          <svg
            fill="none"
            stroke="currentColor"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="3"
            class="flex-shrink-0 text-indigo-500 w-6 h-6 mr-4"
            viewBox="0 0 24 24"
          >
            <path d="M22 11.08V12a10 10 0 11-5.93-9.14"></path>
            <path d="M22 4L12 14.01l-3-3"></path>
          </svg>
          <span class="title-font font-medium">Custom Role Access</span>
        </div>
      </div>
      <div class="pt-2 pr-2 pb-2 pl-2 w-full sm:w-1/2">
        <div
          class="bg-gray-100 rounded flex pt-4 pr-4 pb-4 pl-4 h-full items-center"
        >
          <svg
            fill="none"
            stroke="currentColor"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="3"
            class="flex-shrink-0 text-indigo-500 w-6 h-6 mr-4"
            viewBox="0 0 24 24"
          >
            <path d="M22 11.08V12a10 10 0 11-5.93-9.14"></path>
            <path d="M22 4L12 14.01l-3-3"></path>
          </svg>
          <span class="title-font font-medium">Secure Cloud Sync</span>
        </div>
      </div>
      <div class="pt-2 pr-2 pb-2 pl-2 w-full sm:w-1/2">
        <div
          class="bg-gray-100 rounded flex pt-4 pr-4 pb-4 pl-4 h-full items-center"
        >
          <svg
            fill="none"
            stroke="currentColor"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="3"
            class="flex-shrink-0 text-indigo-500 w-6 h-6 mr-4"
            viewBox="0 0 24 24"
          >
            <path d="M22 11.08V12a10 10 0 11-5.93-9.14"></path>
            <path d="M22 4L12 14.01l-3-3"></path>
          </svg>
          <span class="title-font font-medium">Cross-Team Collaboration</span>
        </div>
      </div>
    </div>
    <button
      class="flex ml-auto mr-auto mx-auto mt-16 text-white bg-indigo-500 border-0 pt-2 pb-2 py-2 pl-8 pr-8 px-8 focus:outline-none rounded text-lg hover:bg-indigo-600"
    >
      Button
    </button>
  </div>
</section>