<{{ params.htmlElement|default:"div" }} class="tna-card{% if params.featured %} tna-card--featured{% endif %} {{ params.classes }}" data-module="tna-card" {% for attribute, value in params.attributes.items %} {{ attribute }}="{{ value }}"{% endfor %}>
    <div class="tna-card__inner">
    {% if params.heading.supertitle %}
        {% if params.heading.singleSentence %}
        <hgroup class="tna-card__heading tna-hgroup tna-hgroup--{{ params.heading.size|default:'m' }}">
            <h{{ params.heading.level }} class="tna-card__title tna-hgroup__title">
                <span class="tna-card__supertitle tna-hgroup__supertitle">{{ params.heading.supertitle }}</span>
            {% if params.href %}
                <a href="{{ params.href }}" class="tna-card__title-link">{{ params.heading.title }}</a>
            {% else %}
                {{ params.heading.title }}
            {% endif %}
            </h{{ params.heading.level }}>
        </hgroup>
        {% else %}
        <hgroup class="tna-card__heading tna-hgroup tna-hgroup--{{ params.heading.size|default:'m' }}">
            <p class="tna-card__supertitle tna-hgroup__supertitle">{{ params.heading.supertitle }}</p>
            <h{{ params.heading.level }} class="tna-card__title tna-hgroup__title">
            {% if params.href %}
                <a href="{{ params.href }}" class="tna-card__title-link">{{ params.heading.title }}</a>
            {% else %}
                {{ params.heading.title }}
            {% endif %}
            </h{{ params.heading.level }}>
        </hgroup>
        {% endif %}
    {% else %}
        <h{{ params.heading.level }} class="tna-card__title tna-heading tna-heading--{{ params.heading.size|default:'m' }}">
            {% if params.href %}
                <a href="{{ params.href }}" class="tna-card__title-link">{{ params.heading.title }}</a>
            {% else %}
                {{ params.heading.title }}
            {% endif %}
        </h{{ params.heading.level }}>
    {% endif %}
    {% if params.image %}
        <a href="{{ item.href }}" class="tna-card__image-container" tabindex="-1">
            <img src="{{ params.image.src }}" alt="{{ params.image.alt }}" width="{{ params.image.width }}" height="{{ params.image.height }}" class="tna-card__image" />
        </a>
    {% endif %}
        <div class="tna-card__body">
        {% if params.text %}
            <p>{{ params.text }}</p>
        {% else %}
            {{ params.body | safe }}
        {% endif %}
        </div>
    {% if params.actions %}
        <div class="tna-card__actions">
        {% for item in params.actions %}
            <a href="{{ item.href }}" class="tna-card__action tna-button" role="button" {% if item.title %}title="{{ item.title }}"{% endif %}>{{ item.text }}</a>
        {% endfor %}
        </div>
    {% endif %}
    </div>
</{{ params.htmlElement|default:"div" }}>