steps

<section>
  <div class="px-8 py-32 mx-auto md:px-12 lg:px-24 max-w-7xl relative">
    <div class="grid grid-cols-1 gap-12 md:grid-cols-3 md:items-end">
      <div class="lg:col-span-2">
        <span
          class="font-mono text-xs font-medium tracking-tight text-blue-600 uppercase"
          >Process</span
        >
        <h1
          class="text-4xl mt-4 font-semibold tracking-tight text-gray-900 lg:text-balance"
        >
          Simple steps to achieve your goals
        </h1>
      </div>
      <p class="text-base font-medium mt-4 text-gray-500">
        Follow these straightforward steps to streamline your process and
        achieve success with ease.
      </p>
    </div>
    <dl class="grid grid-cols-1 gap-6 lg:grid-cols-3 md:grid-cols-2 mt-12">
      <div class="bg-gray-50 rounded-3xl">
        <dt class="tracking-tight text-lg font-medium text-gray-900 p-8">
          1. Choose your account type
        </dt>
        <dd class="text-sm text-gray-500 text-pretty p-8 border-t">
          Decide whether you need a checking account, savings account, or both.
          Each type has its own benefits and features.
        </dd>
      </div>
      <div class="bg-blue-600 rounded-3xl">
        <dt class="tracking-tight text-lg font-medium text-white p-8">
          2. Gather required documents
        </dt>
        <dd
          class="text-sm lg:text-balance text-gray-200 p-8 border-t border-white/20"
        >
          Collect necessary documents such as ID, proof of address, and Social
          Security number. This ensures a smooth application process.
        </dd>
      </div>
      <div class="bg-blue-950 rounded-3xl">
        <dt class="tracking-tight text-lg font-medium text-white p-8">
          3. Complete the application
        </dt>
        <dd
          class="text-sm lg:text-balance text-gray-200 p-8 border-t border-white/20"
        >
          Fill out the application form online or at your local branch. Provide
          accurate information to avoid delays.
        </dd>
      </div>
    </dl>
  </div>
</section>