{# ========================================================================= #}
{# :: Imports #}
{# ========================================================================= #}
{% import "molecules/map/map-macros.njk" as map %}

{# ========================================================================= #}
{# :: Default #}
{# ========================================================================= #}
<section class="m-section m-section--spacing-small l-split">
  <div class="m-section__container l-container">

    <div class="l-split__col-5-12 l-split__image u-mobile-hide">
      {{map.default("m-section__image m-section__image--contain", {})}}
    </div>

    <div class="l-split__col-7-12 l-split__content">
      <header class="m-section__header m-section__header--split">
        <h2>Je batterijen binnenbrengen in een Bebat inzamelpunt</h2>

        <div class="m-section__image-visual u-mobile-show">
          {{map.default("m-section__image m-section__image--contain", {})}}
        </div>
      </header>

      <div class="m-section__content">
        <p class="m-section__content-item">
          Elke dag zamelen we dankzij onze 24.000 inzamelpunten meer dan 300.000 batterijen in.Benieuwd of er zich eentje in jouw buurt bevindt?
        </p>

        {{buttonGroup.default("", [
          button.default("", {
            text: "Vind een inzamelpunt",
            icon: {before: "icon-location"}
          })
        ])}}
      </div>
    </div>

  </div>
</section>