{% include 'patterns/organisms/layout/district/navbar.html' with selected_item='Kdo jsme' is_transparent=True is_on_dark_background=True %}
{% include 'patterns/organisms/header/district/photo_header.html' %}

<main role="main">
  <div class="container--wide w-full">
    <section class="grid-container person-grid-container !ml-0">
      <div class="grid-left-side-with-content leading-6">
        <article
          class="
            mb-4
            xl:mb-24 xl:mr-2 xl:pr-40
          "
        >
          <p class="mb-5 text-lg leading-7">
            {{ person_text_1 }}
          </p>
          <p class="mb-5 text-lg leading-7">
            {{ person_text_2 }}
          </p>
        </article>
      </div>
      <div class="grid-right-side mb-8 xl:mb-0">
        {% include 'patterns/molecules/blocks/inline_contact.html' %}
      </div>
    </section>
  </div>

  <section class="mb-4 xl:mb-20 container--wide w-full">
    <div class="grid-container person-grid-container !ml-0">
      <div class="grid-left-side-with-content">
        <h2 class="text-[3.5rem] font-alt text-left">
          {{ person_calendar_title }}
        </h2>
      </div>
    </div>

    <div class="grid-container person-grid-container !ml-0">
      <div class="grid-left-side-with-content">
        <div>
          {% include 'patterns/atoms/calendar/calendar.html' %}
        </div>
      </div>
    </div>
  </section>

  <section class="mb-4 xl:mb-20 container--wide w-full">
    <div class="grid-container person-grid-container mb-3 !ml-0">
      <div class="grid-left-side-with-content">
        <h2 class="font-alt text-[3.5rem]">
          {{ person_title }}
        </h2>
      </div>
    </div>

    <div class="grid-container person-grid-container !ml-0">
      <div class="grid-full !ml-0">
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 content-stretch gap-8">
          {% for related_article in person_related_articles %}
            {% include 'patterns/molecules/boxes/card_box.html' with header=related_article.name content=related_article.description description_classes='!bg-grey-180' date=related_article.date %}
          {% endfor %}
        </div>
      </div>
    </div>
  </section>

  <section class="mb-4 xl:mb-20 container--wide w-full">
    <div class="grid-container person-grid-container mb-4 !ml-0">
      <div class="grid-left-side-with-content">
        <h2 class="text-[3.5rem] font-alt text-left">
          {{ person_simple_block_title }}
        </h2>
      </div>
    </div>

    <div class="grid-container person-grid-container !ml-0">
      <div class="grid-full">
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 content-stretch gap-8">
          {% for content in person_simple_block %}
            {% include 'patterns/molecules/boxes/card_box.html' with header=content.name content=content.function description_classes='!bg-grey-180' %}
          {% endfor %}
        </div>
      </div>
    </div>
  </section>

  {% include 'patterns/organisms/main_section/newsletter_section.html' %}
</main>

{% include 'patterns/organisms/layout/footer.html' %}
