Grille projet : images en pleine largeur de colonne servies en HD

Dans la grille d'images de la fiche projet, la dernière image d'un
total impair s'étale sur toute la largeur de colonne (grid-column:
span 2) en tablette/desktop. Elle était chargée en SD 640px, donc
pixelisée. Ajout d'un srcset (@Nx) avec sizes adapté à la largeur
d'affichage réelle : 100vw pour l'image pleine largeur, sinon
(min-width: 576px) 50vw, 100vw.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

user/themes/figureslibres-v2/templates/reader.html.twig

@@ -39,13 +39,15 @@
       </div>
 
       <div id="project-images-grid">
-        {% for image in page.media.images %}
-            {# quand l'en-tête est une vidéo, la 1re image n'est pas affichée ailleurs : on l'inclut dans la grille #}
-            {% if cover_video != null or image != page.media.images | first %}
-              <figure class="{{ class_suffix }}">
-                <img src="{{ url('theme://images/loader/rolling.svg') }}" data-src="{{ image.url }}" alt="{{ page.title }}" class="lazy loader project-image">
-              </figure>
-            {% endif %}
+        {# images affichées dans la grille : toutes, ou toutes sauf la 1re (en-tête) s'il n'y a pas de vidéo #}
+        {% set grid_images = cover_video != null ? page.media.images : page.media.images|slice(1) %}
+        {% set grid_count = grid_images|length %}
+        {% for image in grid_images %}
+            {# dernière image d'un total impair : elle s'étale sur toute la largeur de colonne (grid-column: span 2) → sizes 100vw #}
+            {% set full_width = loop.last and grid_count is odd %}
+            <figure class="{{ class_suffix }}">
+              <img src="{{ url('theme://images/loader/rolling.svg') }}" data-src="{{ image.url }}"{% if image.srcset %} data-srcset="{{ image.srcset }}" data-sizes="{{ full_width ? '100vw' : '(min-width: 576px) 50vw, 100vw' }}"{% endif %} alt="{{ page.title }}" class="lazy loader project-image">
+            </figure>
         {% endfor %}
       </div>