{% if featured.taxonomies.people %}
    {% set people = get_section(path="people/_index.md") %}           
    {% set pages_str = people.pages | json_encode() | as_str %}
    {% if pages_str is containing(featured.taxonomies.people[0]) %}
        {% set author_path = 'people/' ~ featured.taxonomies.people[0] ~ '/index.md' %}
        {% set author = get_page(path=author_path) %}
    {% endif %}
{% endif %}

<body>
  <div class="lg:grid lg:grid-cols-2 lg:gap-8 relative mt-12 pt-6 lg:pt-16 px-6 lg:px-0 lg:mt-10 items-center py-10 container mx-auto flex flex-col-reverse lg:flex-row">
    <!-- Image Section (Will be displayed first on small screens) -->
    <div class="relative lg:mt-0 max-w-full order-1 lg:order-2">
      <img class="relative mx-auto mt-10 lg:mt-16 rounded-lg max-h-64 py-0" src="{{featured.permalink}}{{featured.extra.imgPath}}" alt="" />
    </div>
    <!-- Text Content Section (Will be displayed first on larger screens) -->
    <div class="relative w-full md:w-auto mx-3 lg:mx-12 order-2 lg:order-1">
      <h3 class="text-base not-italic font-medium leading-6 text-indigo-400 mb-4">FEATURED POST</h3>
      <a href="{{featured.permalink}}">
        <h2 class="text-2xl main-title lg:text-3xl fw-500 leading-snug font-semibold">
          {{ featured.title }}
        </h2>
        <p class="mt-4 text-base font-light text-gray-50 text-left">
          {{ featured.description }}
        </p>
      </a>
      <h4 class="mt-2 mb-6 lg:mb-10 text-sm not-italic font-light leading-6 text-gray-200">
        {{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}} 
      </h4>
      <a href="/blog/ensuring_reliability" class="rounded-md mt-6 lg:mt-12 bg-indigo-400 px-3.5 py-2.5 font-semibold text-white shadow-sm text-sm hover:bg-indigo-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-400">Read More</a>
    </div>
  </div>

  <hr class="mt-6 container mx-auto">
  <br>
  <br>
</body>
