card6

<section>
  <div class="container py-24">
    <div class="relative px-4 py-12 sm:px-6 lg:px-8 lg:py-16">
      <div class="relative mx-auto max-w-7xl">
        <div class="mx-auto grid max-w-lg gap-5 lg:max-w-none lg:grid-cols-3">
          <div class="flex flex-col overflow-hidden rounded-lg shadow-lg">
            <div class="shrink-0">
              <img class="h-48 w-full object-cover" src="/images/placeholders/original/neon-1.webp" alt="" />
            </div>
            <div class="flex flex-1 flex-col justify-between bg-white p-6">
              <div class="flex-1">
                <a href="#" class="mt-2 block">
                  <p class="text-xl font-semibold text-gray-600">
                    Boost your conversion rate
                  </p>
                  <p class="mt-3 text-base text-gray-500">
                    Lorem ipsum dolor sit amet consectetur adipisicing elit.
                    Architecto accusantium praesentium eius, ut atque fuga
                    culpa, similique sequi cum eos quis dolorum.
                  </p>
                </a>
              </div>
              <div class="mt-6 flex items-center">
                <div class="shrink-0">
                  <a href="https://twitter.com/ausrobdev">
                    <span class="sr-only">Rob Austin</span>
                    <img class="size-10 rounded-full" src="/images/placeholders/original/avatar-1.webp" alt="" />
                  </a>
                </div>
                <div class="ml-3">
                  <p class="text-sm font-medium text-gray-600">
                    <a href="https://twitter.com/ausrobdev" class="hover:underline">
                      Rob Austin</a>
                  </p>
                  <div class="flex space-x-1 text-sm text-gray-500">
                    <time datetime="2020-03-16"> Mar 16, 2020 </time>
                    <span aria-hidden="true"> · </span>
                    <span> 6 min read </span>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="flex flex-col overflow-hidden rounded-lg shadow-lg">
            <div class="shrink-0">
              <img class="h-48 w-full object-cover" src="/images/placeholders/original/neon-2.webp" alt="" />
            </div>
            <div class="flex flex-1 flex-col justify-between bg-white p-6">
              <div class="flex-1">
                <a href="#" class="mt-2 block">
                  <p class="text-xl font-semibold text-gray-600">
                    How to use search engine optimization to drive sales
                  </p>
                  <p class="mt-3 text-base text-gray-500">
                    Lorem ipsum dolor sit amet consectetur adipisicing elit.
                    Velit facilis asperiores porro quaerat doloribus, eveniet
                    dolore. Adipisci tempora aut inventore optio animi., tempore
                    temporibus quo laudantium.
                  </p>
                </a>
              </div>
              <div class="mt-6 flex items-center">
                <div class="shrink-0">
                  <a href="https://twitter.com/g_perales">
                    <span class="sr-only">Jane Smith</span>
                    <img class="size-10 rounded-full" src="/images/placeholders/original/avatar-2.webp" alt="" />
                  </a>
                </div>
                <div class="ml-3">
                  <p class="text-sm font-medium text-gray-600">
                    <a href="#" class="hover:underline"> Jane Smith</a>
                  </p>
                  <div class="flex space-x-1 text-sm text-gray-500">
                    <time datetime="2020-03-10"> Mar 10, 2020 </time>
                    <span aria-hidden="true"> · </span>
                    <span> 4 min read </span>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="flex flex-col overflow-hidden rounded-lg shadow-lg">
            <div class="shrink-0">
              <img class="h-48 w-full object-cover" src="/images/placeholders/original/neon-3.webp" alt="" />
            </div>
            <div class="flex flex-1 flex-col justify-between bg-white p-6">
              <div class="flex-1">
                <a href="#" class="mt-2 block">
                  <p class="text-xl font-semibold text-gray-600">
                    Improve your customer experience
                  </p>
                  <p class="mt-3 text-base text-gray-500">
                    Lorem ipsum dolor sit amet consectetur adipisicing elit.
                    Sint harum rerum voluptatem quo recusandae magni placeat
                    saepe molestiae, sed excepturi cumque corporis perferendis
                    hic.
                  </p>
                </a>
              </div>
              <div class="mt-6 flex items-center">
                <div class="shrink-0">
                  <a href="https://twitter.com/wickedlabsHQ">
                    <span class="sr-only">Wickedblocks</span>
                    <img class="size-10 rounded-full" src="/images/placeholders/original/avatar-3.webp" alt="" />
                  </a>
                </div>
                <div class="ml-3">
                  <p class="text-sm font-medium text-gray-600">
                    <a href="https://twitter.com/wickedlabsHQ" class="hover:underline">
                      Wickedblocks
                    </a>
                  </p>
                  <div class="flex space-x-1 text-sm text-gray-500">
                    <time datetime="2020-02-12"> Feb 12, 2020 </time>
                    <span aria-hidden="true"> · </span>
                    <span> 11 min read </span>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>