{% extends 'base.html' %}
{% block title %}All Masterclasses{% endblock %}
{% block content %}
<section style="padding:3rem 6%;">
  <div class="section-header">
    <h2>All <span>Masterclasses</span></h2>
    <p style="color:var(--text-muted);">Browse the full academy catalog.</p>
  </div>
  <div class="course-grid">
    {% for course in course %}
      <div class="course-card">
        <div class="card-image-wrap"><img src="{% if course.cover %}/static/{{ course.cover.name }}{% endif %}"/></div>
        <div class="card-body">
          <h3 class="card-title"><a href="{% url 'aftaportal:shop' %}?id={{ course.id }}">{{ course.name }}</a></h3>
          <p class="card-tagline">{{ course.preview|truncatechars:120 }}</p>
          <div class="card-footer"><div class="price-current">{{ course.mablagh }}</div><a class="btn-gold" href="{% url 'aftaportal:shop' %}?id={{ course.id }}">View</a></div>
        </div>
      </div>
    {% endfor %}
  </div>
</section>
{% endblock %}