<div class="cast-gallery">
  <ul class="cast-gallery-list">
    {% for image in images %}
      <li class="cast-gallery-item">
        <a class="cast-gallery-link" href="{{ image.file.url }}">
          <picture>
            <source
              srcset="{{ image.thumbnail.srcset.avif }}"
              type="image/avif"
              sizes="{{ image.thumbnail.sizes }}"
            >
            <img
              class="cast-gallery-thumbnail"
              alt="{{ image.default_alt_text }}"
              src="{{ image.thumbnail.src.jpeg }}"
              srcset="{{ image.thumbnail.srcset.jpeg }}"
              sizes="{{ image.thumbnail.sizes }}"
              width="{{ image.thumbnail.width }}"
              height="{{ image.thumbnail.height }}"
              loading="lazy"
            />
          </picture>
        </a>
      </li>
    {% endfor %}
  </ul>
</div>
