{# drop_calendar (magazine-bold) — dated list of drops: mono datelines, condensed names, a status tag. Fields: heading, intro, drops[].date/.name/.detail/.status(live|soon|sold)/.link/.linkLabel. Static, no motion. #}
<section data-block="magazine-bold:drop_calendar" class="w-full overflow-hidden py-10 md:py-12">
  <div class="mx-auto max-w-4xl px-4 sm:px-6">
    {% if heading %}<h2 class="mb-heading text-3xl md:text-5xl text-foreground">{{ heading }}</h2>{% endif %}
    {% if intro %}<p class="mt-4 max-w-2xl text-deck text-muted-foreground">{{ intro }}</p>{% endif %}
    {% if drops %}
    <ul class="mt-10 border-t-2 border-[hsl(var(--foreground))]">
      {% for drop in drops %}
      <li class="flex flex-col gap-3 border-b-2 border-[hsl(var(--foreground))] py-5 sm:flex-row sm:items-center sm:gap-8">
        <div class="mb-caps shrink-0 text-[hsl(var(--accent))] sm:w-40">{{ drop.date }}</div>
        <div class="min-w-0 flex-1">
          <h3 class="mb-heading text-xl md:text-2xl text-foreground">{% if drop.link %}<a href="{{ drop.link }}" class="transition-colors hover:text-[hsl(var(--accent))]">{{ drop.name }}</a>{% else %}{{ drop.name }}{% endif %}</h3>
          {% if drop.detail %}<p class="mt-1 text-sm text-muted-foreground">{{ drop.detail }}</p>{% endif %}
        </div>
        {% if drop.status == "live" %}<span class="mb-caps shrink-0 bg-[hsl(var(--accent))] px-3 py-1 text-[hsl(var(--accent-foreground))]">Live</span>
        {% elif drop.status == "sold" %}<span class="mb-caps shrink-0 border-2 border-[hsl(var(--border))] px-3 py-1 text-muted-foreground">Sold out</span>
        {% elif drop.status == "soon" %}<span class="mb-caps shrink-0 border-2 border-[hsl(var(--foreground))] px-3 py-1 text-foreground">Coming soon</span>{% endif %}
      </li>
      {% endfor %}
    </ul>
    {% else %}<div class="mb-caption py-12">No drops scheduled.</div>{% endif %}
  </div>
</section>
