Simple support card

Create a compact centered contact card with Tailwind CSS: a small heading, a one-line subtitle, an email field, a message textarea, and a submit button, all inside a max-w-md bordered rounded-2xl card on a light background.

<section class="flex min-h-[60vh] items-center justify-center bg-neutral-50 p-6">
  <div class="w-full max-w-md rounded-2xl border border-neutral-200 bg-white p-8 shadow-sm">
    <h2 class="text-xl font-semibold text-neutral-900">Send us a note</h2>
    <p class="mt-1 text-sm text-neutral-500">We'd love to hear from you.</p>
    <form class="mt-6 space-y-4">
      <input type="email" placeholder="Your email" class="w-full rounded-xl border border-neutral-200 px-3.5 py-2.5 text-sm outline-none focus:border-neutral-900 focus:ring-4 focus:ring-neutral-900/10" />
      <textarea rows="4" placeholder="Your message" class="w-full rounded-xl border border-neutral-200 px-3.5 py-2.5 text-sm outline-none focus:border-neutral-900 focus:ring-4 focus:ring-neutral-900/10"></textarea>
      <button class="w-full rounded-xl bg-neutral-900 py-2.5 text-sm font-medium text-white hover:bg-neutral-800">Submit</button>
    </form>
  </div>
</section>