{{!< default}}

{{#tag}}
<header class="container mx-auto px-4 py-16 md:py-24 text-center">
    <span class="text-xs uppercase tracking-[0.3em] text-[var(--text-tertiary)] mb-4 block">Tag</span>
    <h1 class="text-6xl md:text-8xl font-bold tracking-tighter text-[var(--brand-primary)] mb-4">{{name}}</h1>
    {{#if description}}
        <p class="mt-4 text-xl md:text-2xl text-[var(--text-secondary)] max-w-2xl mx-auto font-serif italic italic leading-relaxed opacity-90 mb-8">{{description}}</p>
    {{/if}}

    <div class="flex items-center justify-center text-sm font-medium uppercase tracking-[0.2em] text-[var(--text-tertiary)]">
        <span class="inline-block w-8 h-px bg-[var(--bg-tertiary)] mr-4"></span>
        {{plural ../pagination.total empty='No posts' singular='% post' plural='% posts'}}
        <span class="inline-block w-8 h-px bg-[var(--bg-tertiary)] ml-4"></span>
    </div>
</header>
{{/tag}}

<div class="container mx-auto px-4 pb-20">
    {{#if posts}}
        {{> "post-feed"}}
    {{else}}
        <p class="text-center text-[var(--text-secondary)] text-2xl py-20">No posts found.</p>
    {{/if}}
</div>