---
### ALL PAGES ###
layout: themes/[ site.theme.id ]/frontend/core/base

### PAGE CONFIG ###
# Hero Section — categories are the paper's desks. News voice throughout: a
# theme's frontmatter defaults are part of its identity (see docs/themes.md).
hero:
  headline: "Browse by"
  headline_accent: "desk"
  subheadline: "Every story we publish is filed to a desk. Pick one and read the coverage."
---

{% comment %}
  NEWSFLASH BLOG CATEGORIES
  Same data contract as classy's categories index (categories + counts built
  from site.posts), presented as the desk directory: editorial cards with
  stroked story-count numerals instead of folder icons.
{% endcomment %}

<!-- ============================================ -->
<!-- HERO -->
<!-- ============================================ -->
<section class="pb-4">
  <div class="container text-center" data-lazy="@class animation-slide-up">
    <span class="kicker mb-3">{% uj_icon "newspaper", "me-1" %}The desks</span>
    <h1 class="display-4 my-3">
      {{ page.resolved.hero.headline }}
      <span class="text-accent">{{ page.resolved.hero.headline_accent }}</span>
    </h1>
    {% iftruthy page.resolved.hero.subheadline %}
      <p class="lead mb-0">{{ page.resolved.hero.subheadline }}</p>
    {% endiftruthy %}
  </div>
</section>

<!-- ============================================ -->
<!-- DESK DIRECTORY -->
<!-- ============================================ -->
<section class="pt-0">
  <div class="container">
    {% comment %} Build unique categories list with post counts {% endcomment %}
    {% assign categories = '' | split: ',' %}
    {% assign category_counts = '' | split: ',' %}
    {% for post in site.posts %}
      {% for category in post.post.categories %}
        {% assign category_fixed = category | uj_title_case %}
        {% unless categories contains category_fixed %}
          {% assign categories = categories | push: category_fixed %}
          {% comment %} Count posts for this category {% endcomment %}
          {% assign count = 0 %}
          {% for p in site.posts %}
            {% for c in p.post.categories %}
              {% assign c_fixed = c | uj_title_case %}
              {% if c_fixed == category_fixed %}
                {% assign count = count | plus: 1 %}
                {% break %}
              {% endif %}
            {% endfor %}
          {% endfor %}
          {% assign category_counts = category_counts | push: count %}
        {% endunless %}
      {% endfor %}
    {% endfor %}

    <div class="row g-4">
      {% for category in categories %}
        <div class="col-xl-3 col-lg-4 col-md-6" data-lazy="@class animation-slide-up">
          <a href="{{ site.url }}/blog/categories/{{ category | slugify }}" class="card h-100 p-4 text-decoration-none text-center">
            <span class="stat-num">{{ category_counts[forloop.index0] }}</span>
            <h2 class="h4 mb-1">{{ category }}</h2>
            <p class="small text-body-secondary mb-0">
              {{ category_counts[forloop.index0] | uj_pluralize: 'story', 'stories' }} on this desk
            </p>
          </a>
        </div>
      {% endfor %}
    </div>

    {% if categories.size == 0 %}
      <div class="text-center py-5" data-lazy="@class animation-slide-up">
        <span class="kicker mb-2">No desks yet</span>
        <h2 class="h3 mb-2">The newsroom is still setting up</h2>
        <p class="text-body-secondary mb-4">Check back soon — the first stories are being filed.</p>
        <a href="{{ site.url }}/blog" class="btn btn-primary">
          {% uj_icon "arrow-left", "me-2" %}Back to the news
        </a>
      </div>
    {% endif %}
  </div>
</section>

{{ content | uj_content_format }}