{% extends "base.html" %}
{% block title %}Tag: #{{ tag }}{% endblock %}

{% block content %}

<!-- Hero -->
<section class="relative text-center py-20 text-white bg-gradient-to-br from-orange-500/20 via-rose-500/10 to-fuchsia-500/10 backdrop-blur border-b border-white/10">
  <div class="max-w-3xl mx-auto px-6">
    <h1 class="text-5xl md:text-6xl font-archivo font-extrabold mb-3">
      Posts tagged <span class="text-orange-300">#{{ tag }}</span>
    </h1>
    <p class="text-white/80">Projects and posts matching this tag.</p>
  </div>
</section>

<!-- Results -->
<section class="py-16">
  <div class="container-page">
    {% if projectpost and projectpost|length %}
      <div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-8">
        {% for p in projectpost %}
        <article class="bg-white/5 backdrop-blur-md border border-white/10 rounded-2xl p-6 hover:shadow-xl hover:border-orange-400/30 transition-all duration-300">
          <h2 class="text-xl font-semibold font-archivo tracking-tight">
            <a href="{{ url_for('view_project', slug=p.slug) }}" class="hover:text-orange-400 transition">
              {{ p.title }}
            </a>
          </h2>

          {% if p.category %}
          <p class="mt-2 text-sm text-orange-400 font-medium">{{ p.category }}</p>
          {% endif %}

          {% if p.summary %}
          <p class="mt-3 text-white/70 line-clamp-3">{{ p.summary }}</p>
          {% endif %}

          <div class="mt-6">
            <a href="{{ url_for('view_project', slug=p.slug) }}" class="btn btn-primary">View</a>
          </div>
        </article>
        {% endfor %}
      </div>
    {% else %}
      <div class="card max-w-2xl mx-auto text-center">
        <h3 class="text-2xl font-semibold mb-2">No results</h3>
        <p class="text-white/70">Nothing tagged <span class="text-orange-300">#{{ tag }}</span> yet.</p>
        <div class="mt-6">
          <a href="{{ url_for('projects') }}" class="btn btn-ghost">← Back to Projects</a>
        </div>
      </div>
    {% endif %}
  </div>
</section>

{% endblock %}