{% set transforms = transforms
  ?? {
    '(min-width: 1200px)': {
      width: 1920,
      height: 900
    },
    '(min-width: 992px)': {
      width: 1440,
      height: 780
    },
    '(min-width: 768px)': {
      width: 1024,
      height: 780
    },
    '(min-width: 576px)': {
      width: 480,
      height: 800
    }
  }
%}

{% set img = img ?? null %}
{% set default = default ?? null %}

{% set defaultThumb = default
  ? {
    width: default.width ?? 'auto',
    height: default.height ?? 'auto'
  }
  : {
    width: 380,
    height: 700
  }
%}

{% if img and transforms %}
  {% set format = craft.app.images.getSupportsWebP() ? 'webp' : 'jpg' %}
  {% set thumb = {
    mode: 'crop',
    quality: 96,
    position: 'top-center',
    format: format
  } %}
  <picture>
    {% for key, value in transforms %}
      {% set thumb =
        thumb|merge({
          width: value.width ?? 'auto',
          height: value.height ?? 'auto'
        })
      %}
      <source type="image/{{ format }}"
        data-srcset="{{ img.getUrl(thumb) }}"
        width="{{ img.getWidth(thumb) }}"
        height="{{ img.getHeight(thumb) }}"
        media="{{ key }}" />
    {% endfor %}
    {% set parameters = thumb|merge(defaultThumb) %}
   
    <img class="img-fluid lazyload {{ setClass ?? null }}"
      alt="{{ alt ?? null }}"
      width=""
      width="{{ img.getWidth(parameters) }}"
      height="{{ img.getHeight(parameters) }}"
      data-src="{{ img.getUrl(parameters) }}" />
  </picture>
{% endif %}
