<div class="carousel brand-cards-carousel {{#if theme}}brand-cards-carousel--{{theme}} {{else}}brand-cards-carousel--white{{/if}} {{#if paddingTop}}{{paddingTop}}{{/if}} {{#if paddingBottom}}{{paddingBottom}}{{/if}}" {{#ifEquals theme "green"}}style="--card-text-color:#fff"{{/ifEquals}} data-module="brandCardsCarousel" data-sitecore-recommendation="{{sitecoreRecommendation}}" data-nba-instruction="{{nbaInstruction}}" >
    <div class="grid-container">
        <div class="grid-x grid-margin-x">
            <div class="cell">
                <div class="brand-cards-carousel__text-content">
                    {{#if title}}<h2 class="brand-cards-carousel__title">{{{title}}}</h2>{{/if}}
                    {{#if subtitle}}<p class="brand-cards-carousel__subtitle">{{{subtitle}}}</p>{{/if}}
                </div>
                <div role="region" class="carousel__slider brand-cards-carousel__slider grid-x js-brand-cards-carousel-slider">
                    {{#each cards}}
                        <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                            {{#if ../featured }}
                            {{> @cp-card-featured }}
                            {{else}}
                            {{> @cp-card-standard }}
                            {{/if}}
                        </div>
                    {{/each}}
                </div>
            </div>
        </div>
    </div>
</div>