<div class="landscape-image-cards block-margin-top--{{ $block->margin_type_top }} block-margin-bottom--{{$block->margin_type_bottom}}" data-controller="blocks/home-blocks">
  @if ($block->anchor_id )
    <div id="{{ $block->anchor_id }}" class="anchor-offset"></div>
  @endif
  <div>
      <div class="landscape-image-cards__wrap">
        @if($block->block_title)
            <h2>@title($block->block_title)</h2>
        @endif
        <div class="landscape-image-cards__container">
          @foreach($block->cards as $i => $card)
            @php $cardData = $card->getCardFields() @endphp
            @if(!empty($cardData))
              <div class="landscape-image-cards__card" data-action="clickBlock">
                <div class="landscape-image-cards__image-wrap">
                    @if(!empty($cardData->image))
                    <picture>
                        <source srcset="{{ getMediaUrl($cardData->image->filename, '640x440') }}.webp" type="image/webp">
                        {!! getMediaImg($cardData->image, '640x440', htmlentities($cardData->title), null, true) !!}
                    </picture>
                    @endif
                </div>
                <div class="landscape-image-cards__copy">
                    <h4><span>@title($cardData->title)</span></h4>
                    {!! !empty($cardData->content) ? $cardData->content : $cardData->excerpt !!}
                    {!! generateLink($cardData->cta, 'landscape-image-cards__link') !!}
                </div>
              </div>
            @endif
          @endforeach
        </div>
      </div>
    </div>
  </div>
