{% extends 'partials/base.html.twig' %}

{% block body %}
{# coleção global de artigos por data desc #}
{%- set latest_all = page.collection({'items': '@root.descendants', 'order': {'by': 'date', 'dir': 'desc'}}) -%}
{%- set latest = [] -%}
{% for it in latest_all %}{% if it.template == 'item' and it.published %}{% set latest = latest|merge([it]) %}{% endif %}{% endfor %}

{%- set feature = latest|first -%}
{%- set side = latest|slice(1, 4) -%}
{%- set grid = latest|slice(5, 12) -%}

<div class="container">
  {%- set banner = page.header.banner ?? null -%}
  {% if banner and banner.enabled %}
    {%- set banner_img = banner.image ? page.media[banner.image] : null -%}
    <a class="home-banner {{ banner_img ? 'home-banner--image' }}" href="{{ url('/quem-somos') }}" aria-label="{{ banner.cta ?: 'Conheça o Instituto GSEC' }}">
      {% if banner_img %}
        <img class="home-banner__img" src="{{ banner_img.url }}" width="1200" height="150" alt="{{ banner.text ?: 'Instituto GSEC' }}" loading="lazy">
      {% else %}
        <div class="home-banner__inner">
          {% if banner.text %}<p class="home-banner__text">{{ banner.text }}</p>{% endif %}
          <span class="home-banner__cta">{{ banner.cta ?: 'Conheça o Instituto GSEC' }} →</span>
        </div>
      {% endif %}
    </a>
  {% endif %}

  {% if feature %}
  <section class="home-hero section-band" aria-label="Destaques">
    <div class="top-news">
      <div class="top-news__left">
        {% include 'partials/article-card.html.twig' with {item: feature, variant: 'feature'} %}
      </div>
      <div class="top-news__right">
        {% for it in side %}{% include 'partials/article-card.html.twig' with {item: it, variant: 'compact'} %}{% endfor %}
      </div>
    </div>
  </section>
  {% else %}
  <section class="section-band">
    <div class="empty-state">Ainda não há artigos publicados. Adicione conteúdo nas editorias para preencher a home.</div>
  </section>
  {% endif %}

  {% if grid|length %}
  <section class="section-band" aria-label="Últimas notícias">
    <div class="home-section-head" style="--ed: var(--c-accent);">
      <h2 class="home-section-head__title">Últimas</h2>
      <span class="home-section-head__rule"></span>
      <a class="home-section-head__link" href="{{ url('/busca') }}">ver tudo <span aria-hidden="true">→</span></a>
    </div>
    <div class="articles-list articles-list--column-4">
      {% for it in grid %}{% include 'partials/article-card.html.twig' with {item: it} %}{% endfor %}
    </div>
  </section>
  {% endif %}

  {# Faixas por editoria #}
  {% for slug in theme.nav_editorias %}
    {%- set ed = page.find('/' ~ slug) -%}
    {% if ed %}
      {%- set items = ed.children.published.order('date', 'desc')|slice(0, 4) -%}
      {% if items|length %}
      <section class="section-band" aria-label="{{ ed.title }}">
        <div class="home-section-head" style="--ed: var(--ed-{{ ed.slug }}, var(--c-accent));">
          <h2 class="home-section-head__title"><a href="{{ ed.url }}">{{ ed.title }}</a></h2>
          <span class="home-section-head__rule"></span>
          <a class="home-section-head__link" href="{{ ed.url }}">ver tudo <span aria-hidden="true">→</span></a>
        </div>
        <div class="articles-list articles-list--column-4">
          {% for it in items %}{% include 'partials/article-card.html.twig' with {item: it} %}{% endfor %}
        </div>
      </section>
      {% endif %}
    {% endif %}
  {% endfor %}
</div>
{% endblock %}