{# ========================================================================= #}
{# :: IMPORTS #}
{# ========================================================================= #}
{% import "atoms/button/button-macros.njk" as button %}
{% import "molecules/button-group/button-group-macros.njk" as buttonGroup %}

{# ========================================================================= #}
{# :: Default #}
{# ========================================================================= #}
{% macro default(classes, data) %}
  <div class="m-blog-cta {{classes}}">
	<img
		class="m-blog-cta__image"
		src="{{data.image}}"
		alt="{{data.title}}"
		width="840"
		height="630"
		loading="lazy"
	/>

    <div class="m-blog-cta__content">
      <h3 class="m-blog-cta__content__title">{{data.title}}</h3>
      <p class="m-blog-cta__content__text">{{data.text}}</p>

      {% if data.button %}
        {{button.default("m-cta__content__button", {
          text: data.button.text,
          icon: {after: data.button.icon}
        })}}
      {% endif %}

      {% if data.buttons %}
        {{buttonGroup.default("", data.buttons)}}
      {% endif %}
    </div>
  </div>
{% endmacro %}