About Quote Highlight

<section class="mx-auto w-full max-w-3xl bg-white px-4 py-12 text-center md:py-16 dark:bg-gray-900">
  <figure class="m-0">
    <svg class="mx-auto h-8 w-8 text-blue-600/30 dark:text-blue-400/30" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" focusable="false">
      <path d="M9.5 5C6.5 6.7 5 9.3 5 12.9V19h6v-6H8.2c0-2.2.9-3.7 2.6-4.7L9.5 5Zm9 0c-3 1.7-4.5 4.3-4.5 7.9V19h6v-6h-2.8c0-2.2.9-3.7 2.6-4.7L18.5 5Z" />
    </svg>
    <!-- The quote is a real <blockquote>; the attribution is a <figcaption> outside it, not part of the quoted words. -->
    <blockquote class="mt-5 text-balance text-2xl font-semibold leading-snug tracking-tight text-gray-900 sm:text-3xl dark:text-gray-100">
      They shipped in ten weeks what our last vendor could not describe in ten months. We own every line of it.
    </blockquote>
    <figcaption class="mt-6 flex items-center justify-center gap-3">
      <span class="flex h-10 w-10 items-center justify-center rounded-full bg-blue-100 text-sm font-bold text-blue-700 dark:bg-blue-950 dark:text-blue-300" aria-hidden="true">DL</span>
      <span class="text-left">
        <span class="block text-sm font-semibold text-gray-900 dark:text-gray-100">Dana Levine</span>
        <span class="block text-sm text-gray-500 dark:text-gray-400">VP Engineering, Northwind</span>
      </span>
    </figcaption>
  </figure>
</section>