<section class="carousel" data-controller="carousel">
    <ul class="carousel__controls btn-group" role="group" aria-label="gallery controls">
        <li class="carousel__control-prev">
            <button type="button" class="btn btn--lg" data-action="click->carousel#previous">
                <svg class="icon" aria-hidden="true" focusable="false" width="16" height="16">
                    <use xlink:href="/assets/icons.svg#i-arrow_left" />
                </svg>
            </button>
        </li>
        <li class="carousel__control-next">
            <button type="button" class="btn btn--lg" data-action="click->carousel#next">
                <svg class="icon" aria-hidden="true" focusable="false" width="16" height="16">
                    <use xlink:href="/assets/icons.svg#i-arrow_right" />
                </svg>
            </button>
        </li>
    </ul>
    <div class="carousel__inner" data-carousel-target="inner">
        <div class="carousel__item" role="region" tabindex="0" aria-label="gallery" data-carousel-target="slide">
            <div class="stage stage--callout-left">
                <div class="stage__image">
                    <picture>
                        <img src="/placeholder/students.jpg" alt="">
                    </picture>
                </div>
                <div class="stage__content prose">
                    <h3 class="h4">Der Fachbereich Wirtschaftswissenschaften bietet attraktive Studiengänge und Profilmerkmale mit Praxisbezug und internationaler Ausrichtung</h3>
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sequi inventore perferendis commodi vero debitis veritatis quas aliquid mollitia nemo libero alias, atque iure. Quo corporis voluptatum ut natus reiciendis cumque.</p>
                    <a href="#" class="cta-link">Mehr erfahren</a>
                </div>
            </div>
        </div>
        <div class="carousel__item" role="region" tabindex="0" aria-label="gallery" data-carousel-target="slide">
            <div class="stage stage--callout-left">
                <div class="stage__image">
                    <picture>
                        <img src="/placeholder/students.jpg" alt="">
                    </picture>
                </div>
                <div class="stage__content prose">
                    <h3 class="h4">Der Fachbereich Wirtschaftswissenschaften bietet attraktive Studiengänge und Profilmerkmale mit Praxisbezug und internationaler Ausrichtung</h3>
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sequi inventore perferendis commodi vero debitis veritatis quas aliquid mollitia nemo libero alias, atque iure. Quo corporis voluptatum ut natus reiciendis cumque.</p>
                    <a href="#" class="cta-link">Mehr erfahren</a>
                </div>
            </div>
        </div>
        <div class="carousel__item" role="region" tabindex="0" aria-label="gallery" data-carousel-target="slide">
            <div class="stage stage--callout-left">
                <div class="stage__image">
                    <picture>
                        <img src="/placeholder/students.jpg" alt="">
                    </picture>
                </div>
                <div class="stage__content prose">
                    <h3 class="h4">Der Fachbereich Wirtschaftswissenschaften bietet attraktive Studiengänge und Profilmerkmale mit Praxisbezug und internationaler Ausrichtung</h3>
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sequi inventore perferendis commodi vero debitis veritatis quas aliquid mollitia nemo libero alias, atque iure. Quo corporis voluptatum ut natus reiciendis cumque.</p>
                    <a href="#" class="cta-link">Mehr erfahren</a>
                </div>
            </div>
        </div>
        <div class="carousel__item" role="region" tabindex="0" aria-label="gallery" data-carousel-target="slide">
            <div class="stage stage--callout-left">
                <div class="stage__image">
                    <picture>
                        <img src="/placeholder/students.jpg" alt="">
                    </picture>
                </div>
                <div class="stage__content prose">
                    <h3 class="h4">Der Fachbereich Wirtschaftswissenschaften bietet attraktive Studiengänge und Profilmerkmale mit Praxisbezug und internationaler Ausrichtung</h3>
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sequi inventore perferendis commodi vero debitis veritatis quas aliquid mollitia nemo libero alias, atque iure. Quo corporis voluptatum ut natus reiciendis cumque.</p>
                    <a href="#" class="cta-link">Mehr erfahren</a>
                </div>
            </div>
        </div>
    </div>
</section>
<section class="carousel" data-controller="carousel">
  <ul class="carousel__controls btn-group" role="group" aria-label="gallery controls">
    <li class="carousel__control-prev">
      <button type="button" class="btn btn--lg" data-action="click->carousel#previous">
        {% include '@icon' with { 'type': 'i-arrow_left' } %}
      </button>
    </li>
    <li class="carousel__control-next">
      <button type="button" class="btn btn--lg" data-action="click->carousel#next">
        {% include '@icon' with { 'type': 'i-arrow_right' } %}
      </button>
    </li>
  </ul>
  <div class="carousel__inner" data-carousel-target="inner">
    {% for item in items %}
    <div class="carousel__item" role="region" tabindex="0" aria-label="gallery" data-carousel-target="slide">
      <div class="stage stage--callout-left">
        <div class="stage__image">
          <picture>
            <img src="/placeholder/students.jpg" alt="">
          </picture>
        </div>
        <div class="stage__content prose">
          <h3 class="h4">Der Fachbereich Wirtschaftswissenschaften bietet attraktive Studiengänge und Profilmerkmale mit Praxisbezug und internationaler Ausrichtung</h3>
          <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sequi inventore perferendis commodi vero debitis veritatis quas aliquid mollitia nemo libero alias, atque iure. Quo corporis voluptatum ut natus reiciendis cumque.</p>
          <a href="#" class="cta-link">Mehr erfahren</a>
        </div>
      </div>
    </div>
    {% endfor %}
  </div>
</section>
{
  "items": [
    {},
    {},
    {},
    {}
  ]
}