Pricing 13

            
<div class="bg-gray-50 text-gray-600 px-6 lg:px-8 py-12 lg:pb-20">
  <div class="max-w-screen-lg mx-auto grid grid-cols-3 gap-8 items-center">
    <div class="bg-gray-200 p-6 lg:p-8 items-center gap-4 col-span-4 md:col-span-1 text-center">
      <div class="bg-gray-100 rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-6">
        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-8">
          <path d="M12 14l9-5-9-5-9 5 9 5z" />
          <path d="M12 14l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14z" />
        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 14l9-5-9-5-9 5 9 5zm0 0l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14zm-4 6v-7.5l4-2.222" />
        </svg>
      </div>
      <h3 class="text-xl lg:text-2xl font-semibold text-gray-700 mb-4">Students plan</h3>
      <span class="text-3xl lg:text-4xl font-bold">€4 p/m</span>
      <p class="mt-6">Silk pyjamas exchanged for blue quartz. Brawny gods just</p>
      <button class="block w-full bg-gray-600 font-semibold rounded-lg py-4 px-5 lg:px-8 text-white mt-6">Order now</button>
    </div>
    <div class="bg-gray-200 p-6 lg:p-8 lg:py-16 items-center gap-4 col-span-4 md:col-span-1 text-center">
      <div class="bg-gray-100 rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-6">
        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-8">
          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z" />
        </svg>
      </div>
      <h3 class="text-xl lg:text-2xl font-semibold text-gray-700 mb-4">Group plan</h3>
      <span class="text-3xl lg:text-4xl font-bold">€58 p/m</span>
      <p class="mt-6">Silk pyjamas exchanged for blue quartz. Brawny gods just</p>
      <button class="block w-full bg-gray-600 font-semibold rounded-lg py-4 px-5 lg:px-8 text-white mt-6">Order now</button>
    </div>
    <div class="bg-gray-200 p-6 lg:p-8 items-center gap-4 col-span-4 md:col-span-1 text-center">
      <div class="bg-gray-100 rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-6">
        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-8">
          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
        </svg>
      </div>
      <h3 class="text-xl lg:text-2xl font-semibold text-gray-700 mb-4">Single plan</h3>
      <span class="text-3xl lg:text-4xl font-bold">€9 p/m</span>
      <p class="mt-6">Silk pyjamas exchanged for blue quartz. Brawny gods just</p>
      <button class="block w-full bg-gray-600 font-semibold rounded-lg py-4 px-5 lg:px-8 text-white mt-6">Order now</button>
    </div>
  </div>
</div>