<div class="mt-12 py-8 border-t-2 flex flex-col md:flex-row justify-between items-center">
  <div class="flex flex-col mb-4 md:mb-0 md:flex-row items-center flex-1">
    <div class="h-20 w-20">
      <img
        class="inline-block h-20 w-20 mr-2"
        src="/assets/img/avatar.webp"
        alt={{ site.name }}
        loading="lazy" />
    </div>
    <span class="text-lg font-medium">{{ site.name }}</span>
  </div>
  <p class="text-sm flex-1">{{ site.description }}</p>
</div>