{{ header }}
{{ content_top }}
<main class="blog-category-page">
  <section class="blog-category-hero pb-0">
    <div class="container-fluid">
      <ul class="blog-category-breadcrumb">
        {% for key,breadcrumb in breadcrumbs %}
        <li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a>{% if key + 1 < breadcrumbs|length %}<span>•</span>{% endif %}</li>
        {% endfor %}
      </ul>
      <div class="blog-category-hero__grid{% if not thumb %} blog-category-hero__grid--single{% endif %}">
        <div class="blog-category-hero__copy">
          <div class="blog-category-eyebrow">Журнал свадебного салона</div>
          <h1>{{ heading_title }}</h1>
          {% if description %}
          <div class="blog-category-hero__description">{{ description }}</div>
          {% else %}
          <p>Идеи, советы и вдохновение для вашего особенного дня.</p>
          {% endif %}
        </div>
        {% if thumb %}
        <div class="blog-category-hero__image">
          <img src="{{ thumb }}" alt="{{ heading_title }}" title="{{ heading_title }}" />
        </div>
        {% endif %}
      </div>
    </div>
  </section>

  {% if categories %}
  <section class="blog-category-refine">
    <div class="container-fluid">
      <div class="blog-category-refine__head">
        <span class="blog-category-eyebrow">{{ text_refine }}</span>
      </div>
      <div class="blog-category-refine__list">
        {% for category in categories %}
        <a href="{{ category.href }}" class="blog-category-refine__item">{{ category.name }}</a>
        {% endfor %}
      </div>
    </div>
  </section>
  {% endif %}

  <section class="blog-category-content">
    <div class="container-fluid">
      {% if articles %}
      <div class="blog-category-grid">
        {% for article in articles %}
        <article class="blog-category-card">
          <a href="{{ article.href }}" class="blog-category-card__image">
            <img src="{{ article.thumb }}" alt="{{ article.name }}" title="{{ article.name }}" loading="lazy" />
          </a>
          <div class="blog-category-card__body">
            <div class="blog-category-card__meta">
              <time>{{ article.date_added }}</time>
              <span class="blog-category-card__divider"></span>
              <span class="blog-category-card__views">
                <svg width="16" height="16" viewBox="0 0 24 24" aria-hidden="true">
                  <path d="M2.5 12s3.5-6 9.5-6 9.5 6 9.5 6-3.5 6-9.5 6-9.5-6-9.5-6Z"></path>
                  <circle cx="12" cy="12" r="2.5"></circle>
                </svg>
                {{ article.viewed }}
              </span>
            </div>
            <h3><a href="{{ article.href }}">{{ article.name }}</a></h3>
            <p>{{ article.description }}</p>
            <div class="blog-category-card__footer">
              <a href="{{ article.href }}" class="blog-category-card__link">
                {{ button_more }}
                <svg width="18" height="12" viewBox="0 0 18 12" aria-hidden="true">
                  <path d="M0 6h16M11 1l5 5-5 5"></path>
                </svg>
              </a>
              {% if configblog_review_status and article.rating %}
              <div class="blog-category-card__rating" aria-label="Рейтинг: {{ article.rating }} из 5">
                {% for i in 1..5 %}<span class="{% if article.rating < i %}is-empty{% endif %}">★</span>{% endfor %}
              </div>
              {% endif %}
            </div>
          </div>
        </article>
        {% endfor %}
      </div>
      <div class="blog-category-pagination">
        <div>{{ pagination }}</div>
        <div class="blog-category-pagination__results">{{ results }}</div>
      </div>
      {% else %}
      <div class="blog-category-empty">
        <div class="blog-category-eyebrow">Журнал свадебного салона</div>
        <h2>{{ text_empty }}</h2>
        <a href="{{ continue }}" class="btn btn-dark">{{ button_continue }}</a>
      </div>
      {% endif %}
    </div>
  </section>
</main>
{{ content_bottom }}
{{ footer }}
