{# ========================================================================== #}
{# :: Hero  #}
{# ========================================================================== #}
{#
	The hero is located on the top level section of the home page containing a
	small introduction.
#}

{# ========================================================================== #}
{# :: Imports #}
{# ========================================================================== #}
{% import "components/hero.njk" as hero %}
{% import "components/article.njk" as article %}

{# ========================================================================== #}
{# :: Variables #}
{# ========================================================================== #}
{% set DATA = ROUTEDATA.PAGEDATA or {} %}
{% set title = DATA.title or "" %}
{% set description = DATA.description or "" %}
{% set brandDescription = DATA["brand_description"] or "" %}
{% set resourcesDescription = DATA["resource_description"] or "" %}
{% set libraryDescription = DATA["styleguide_description"] or "" %}

{% set content %}

	<div class="bp-l-grid bp-l-grid--with-spacing bp-l-grid--stretch">
		{% if CONFIG.server.api %}
			{{article.default("bp-l-grid__col bp-l-grid__col--6@viewport-7 bp-l-grid__col--4@viewport-9", {
				title: "home.cta.brand.title" | i18n,
				text: brandDescription,
				link: {
					iconBefore: { name: "chevron-right" },
					text: "home.cta.brand.link" | i18n,
					url: "/brand"
				}
			})}}
		{% endif %}

		{% if CONFIG.server.api %}
			{{article.default("bp-l-grid__col bp-l-grid__col--6@viewport-7 bp-l-grid__col--4@viewport-9", {
				title: "home.cta.resources.title" | i18n,
				text: resourcesDescription,
				link: {
					iconBefore: { name: "chevron-right" },
					text: "home.cta.resources.link" | i18n,
					url: "/resources"
				}
			})}}
		{% endif %}

		{{article.default("bp-l-grid__col bp-l-grid__col--6@viewport-7 bp-l-grid__col--4@viewport-9", {
			title: "home.cta.library.title" | i18n,
			text: libraryDescription,
			link: {
				iconBefore: { name: "chevron-right" },
				text: "home.cta.library.link" | i18n,
				url: "/" + CONFIG.taxonomy.library.route
			}
		})}}
	</div>

{% endset %}

{% set illustration %}
	{% include "./illustrations/hero.svg" %}
{% endset %}

{# ========================================================================== #}
{# :: Partial #}
{# ========================================================================== #}
{{hero.default("", {
	title: title,
	text: description,
	illustration: illustration,
	extraContent: content
})}}