For that image above there were 3 items in the region and 5 blocks in the first region

So I seem to have solved it, although not quite sure what was the fix, I wrapped everything on the listing template in a <perch:if> statement and that seems to have done it.

For anyone else here are my final templates:

listing-page.php

  PerchSystem::set_var('path', 'training-detail');
  PerchSystem::set_var('listing-title', 'Upcoming Training Courses');
  perch_content_custom('Courses', array(
      'template' => 'listing.html',
  ));

listing.html

<perch:if exists="heroImage">

<perch:before>
<div class="listing">
  <div class="row row--pad-none-bottom">
    <div class="page-width page-width--content">
      <perch:if exists="listing-title"><h2 class="listing__title"><perch:content id="listing-title" /></h2></perch:if>
      <ul class="listing__list">
</perch:before>

        <li class="listing__list__item">

          <div class="listing__list__item__image">
            <a href="<perch:content id="path" />/<perch:content id="slug" type="slug" />">
              <img src="<perch:content type="image" id="heroImage" width="800" height="600" crop="true" bucket="banners" />" alt="<perch:content id="heroTitle" />" />
            </a>
          </div><!--/listing__list__item__image-->

          <div class="listing__list__item__info">

            <a href="<perch:content id="path" />/<perch:content id="slug" type="slug" />">
              <h3 class="listing__list__item__info__title"><perch:content id="heroTitle" /></h3>
            </a>

            <p class="listing__list__item__info__text"><perch:content id="excerpt" chars="200" append="..." /></p>

            <div class="listing__list__item__info__buttons">
              <div class="listing__list__item__info__buttons__button">
                <a class="btn btn--green" href="<perch:content id="path" />/<perch:content id="slug" type="slug" />" ><strong>Info</strong></a>
              </div><!--/listing__list__item__info__buttons__button-->
              <perch:if exists="btnLink AND btnText">
                <div class="listing__list__item__info__buttons__button">
                  <a class="btn btn--green" href="<perch:content id="btnLink" type="text" label="Button Link" />" ><strong><perch:content id="btnText" type="text" label="Button Text" /></strong></a>
                </div><!--/listing__list__item__info__buttons__button-->
              </perch:if>
            </div><!--/list__item__info__buttons-->

          </div><!--/list__item__info-->

          <perch:template path="content/date.html" />

        </li>

<perch:after>
      </ul>
    </div><!--/page-width-->
  </div><!--/row-->
</div><!--/listing-->
</perch:after>

</perch:if>

date.html (this is where the <perch:blocks> wrapper lives:

<perch:blocks>
  <perch:block type="location" label="Location Block">

    <perch:if exists="dates OR time OR price">
      <div class="listing__list__item__dates">

      <div class="wrapper">
        <perch:repeater id="dates" label="Dates" max="2">
          <div class="date">
            <img class="date__icon" src="/a/img/icon-calendar.png" alt="calendar icon" />
            <div class="date__month"><perch:content id="event_date" type="date" label="Date Of Event" format="F" /></div>
            <div class="date__day"><strong><perch:content id="event_date" type="date" format="d" /></strong></div>
          </div><!--/date-->
        </perch:repeater>
      </div><!--/wrapper-->

      <perch:if exists="time OR price">
        <div class="listing__list__item__dates__extra">
          <perch:if exists="time"><p><strong><perch:content id="time" /></strong></p></perch:if>
          <perch:if exists="price"><p><strong>£<perch:content id="price" /></strong></p></perch:if>
        </div><!--/listing__list__item__dates__time-->
      </perch:if>

      </div><!--/list__item__dates-->
    </perch:if>

  </perch:block>
</perch:blocks>