<div
  class="
    flex flex-col bg-grey-180 drop-shadow

    {{ classes }}
  "
>
  <a href="{{ url }}">
    <img
      src="{{ image_url }}"
      alt=""
      class="w-full object-cover object-center h-[27rem]"
    >
  </a>

  <div class="flex flex-col px-8 pb-6 pt-5 h-full">
    <div class="text-xl text-grey-350 mb-2">
      {{ date }}
    </div>

    <a href="{{ url }}" class="mb-2 underline-offset-4">
      <h2 class="font-alt text-4xl">{{ title }}</h2>
    </a>

    <div class="mb-6">
      {% include 'patterns/molecules/tags/inline_tags.html' %}
    </div>

    <div class="flex flex-col justify-between h-full">
      <p class="mb-8 text-lg">
        {{ text }}
      </p>

      <div class="flex justify-end">
        {% include 'patterns/atoms/buttons/round_button.html' with button_text='Zjisti více' %}
      </div>
    </div>
  </div>
</div>
