{{ partial:components/molecules/cards/card bg_color="{ card_color ?? 'bg-white' }" classes="text-primary-500" :asset="thumbnail ?? header_asset" size="md" }}
    <div class="absolute top-2.5 right-0 p-2.5 max-w-64 font-display text-primary-500 bg-white uppercase truncate">
        {{ name }}
    </div>
    <div>
        <div class="flex items-center mb-2 text-primary-500 text-sm">
            {{ partial:components/atoms/icons/calendar classes="mr-2" }}
            {{ date iso_format="dd D MMMM YYYY" }}
        </div>
        {{ partial:components/atoms/text/heading size="md" tag="h3" weight="font-bold" text_color="{ card_color ?? text_color ?? 'text-black' }" }}
            <a href="{{ url }}" class="line-clamp-3">
                <span class="absolute inset-0"></span>
                {{ title }}
            </a>
        {{ /partial:components/atoms/text/heading }}
    </div>
    <div class="mt-4 space-y-4">
        <p class="line-clamp-4">{{ excerpt ?? content | raw | bard_text }}</p>
        {{ partial src="components/molecules/buttons/text" size="xs" classes="w-fit px-0 underline underline-offset-2 lg:px-0" tag="div" }}
            {{ trans key="Read more" }}
        {{ /partial }}
    </div>
{{ /partial:components/molecules/cards/card }}