{% if query %}
  <p class="text-sm text-slate-400 mb-4">{{ results|length }} result{{ results|length|pluralize }} for “{{ query }}”</p>
  {% if results %}
    <ul class="space-y-3 mb-10">
      {% for article in results %}
        <li class="bg-white rounded-xl border border-slate-200 p-4 shadow-sm">
          <a href="{{ article.get_absolute_url }}" class="font-medium hover:underline" style="color: var(--helpapp-primary)">
            {{ article.title }}
          </a>
          {% if article.summary %}
            <p class="text-sm text-slate-500 mt-1">{{ article.summary }}</p>
          {% endif %}
        </li>
      {% endfor %}
    </ul>
  {% else %}
    <p class="text-slate-400 mb-10">No articles matched your search. Try a different term.</p>
  {% endif %}
{% endif %}