{% set featured = null %}
{% for p in collections.posts %}
  {% if p.data.featured and not featured %}
    {% set featured = p %}
  {% endif %}
{% endfor %}
{% if not featured and collections.posts.length > 0 %}
  {% set featured = collections.posts[0] %}
{% endif %}

{% if featured %}
<section class="tile" aria-label="Featured Technical Dispatch">
  <header class="tile-header">
    <div class="tile-title">
      <span class="status-indicator"></span>
      FEATURED DISPATCH
    </div>
    <span class="tile-meta">{{ (featured.data.tags | filterTagList)[0] | default('SYSTEMS') | upper }} &bull; {{ featured.templateContent | readingTime(featured.data.readingTime) }}</span>
  </header>

  <div class="featured-card-body">
    <div class="featured-badge-row">
      <span class="badge-pinned">[FEATURED DEEP DIVE]</span>
      <time datetime="{{ featured.date | isoDate }}">{{ featured.date | postDate }}</time>
    </div>

    <h2 style="margin: 0; font-size: inherit;">
      <a href="{{ featured.url }}" class="featured-article-title">{{ featured.data.title }}</a>
    </h2>

    <p class="featured-prose">
      {{ featured.data.excerpt }}
    </p>

    <!-- Terminal Code Preview Snippet -->
    <div class="terminal-code-box">
      <div class="code-titlebar">
        <span class="code-title">
          <span style="color: var(--accent-cyan);">&gt;</span>
          <span>init_cluster.sh</span>
        </span>
        <span>POSIX sh</span>
      </div>
      <div class="code-content">
        <pre><code class="language-bash"># System initialization and node health check
./cluster.sh --verify-nodes
curl -s https://api.local/healthz | jq .status</code></pre>
      </div>
    </div>

    <div class="featured-cta-row">
      <div class="tag-cluster">
        {% for tag in featured.data.tags | filterTagList %}
          <span class="tag-chip">#{{ tag }}</span>
        {% endfor %}
      </div>
      <a href="{{ featured.url }}" class="cta-button">READ FULL WRITEUP &rarr;</a>
    </div>
  </div>
</section>
{% endif %}