{# ========================================================================== #}
{# :: Imports #}
{# ========================================================================== #}
{% import "general/components/logo/logo-macros.njk" as logo %}

{# ========================================================================== #}
{# :: Default #}
{# ========================================================================== #}
{% macro default(classes, data) %}

	<div class="c-footer {{classes}}">

		<div class="c-footer__content l-section l-container">

			{{logo.white("c-footer__logo u-hide@tablet", {
				url: "#"
			})}}

			<div class="c-footer__grid l-grid l-grid--with-spacing">

				<div class="c-footer__item l-grid__col l-grid__col--6@tablet l-grid__col--3@desktop">
					<span class="c-footer__title">hypotheek</span>

					<ul class="c-footer__list">
						<li class="c-footer__list-item">Titel 1</li>
						<li class="c-footer__list-item">Titel 2</li>
						<li class="c-footer__list-item">Titel 3</li>
					</ul>
				</div>

				<div class="c-footer__item l-grid__col l-grid__col--6@tablet l-grid__col--3@desktop">
					<span class="c-footer__title">rentes</span>

					<ul class="c-footer__list">
						<li class="c-footer__list-item">Titel 1</li>
						<li class="c-footer__list-item">Titel 2</li>
						<li class="c-footer__list-item">Titel 3</li>
					</ul>
				</div>

				<div class="c-footer__item l-grid__col l-grid__col--6@tablet l-grid__col--3@desktop">
					<span class="c-footer__title">duurzaamheid</span>

					<ul class="c-footer__list">
						<li class="c-footer__list-item">Titel 1</li>
						<li class="c-footer__list-item">Titel 2</li>
						<li class="c-footer__list-item">Titel 3</li>
					</ul>
				</div>

				<div class="c-footer__item c-footer__item--last l-grid__col l-grid__col--6@tablet l-grid__col--3@desktop u-margin-top-5x@below-tablet">
					<span class="c-footer__title u-show@tablet">neem contact op</span>

					<ul class="c-footer__list c-footer__list--last">
						<li class="c-footer__list-item">
							<a class="c-footer__list-link" href="mailto:hoi@lot.nl">mail naar hoi@lot.nl</a>
						</li>
						<li class="c-footer__list-item">
							<a class="c-footer__list-link" href="callto:08004094094">bel naar 0800 409 409 4</a>
						</li>
						<li class="c-footer__list-item">
							<a class="c-footer__list-link" href="https://wa.me/08004094094/?text=urlencodedtext">stuur via WhatsApp</a>
						</li>
					</ul>
				</div>
			</div>

		</div>

		<div class="c-footer__meta-background">
			<div class="c-footer__meta l-container">

				{{logo.white("c-footer__logo u-show@tablet", {
					url: "#"
				})}}

				<div class="c-footer__meta-content">
					<ul class="c-footer__meta-list">
						<li class="c-footer__meta-list-item">
							<a class="c-footer__meta-list-link" href="#">Privacy</a>
						</li>
						<li class="c-footer__meta-list-item">
							<a class="c-footer__meta-list-link" href="#">Disclaimer</a>
						</li>
						<li class="c-footer__meta-list-item">
							<a class="c-footer__meta-list-link" href="#">Voorwaarden</a>
						</li>
					</ul>

					<ul class="c-footer__numbers">
						<li class="c-footer__numbers-item">K.v.K. nr. 27032036</li>
						<li class="c-footer__numbers-item">AFM nr. 12000074</li>
						<li class="c-footer__numbers-item">BTW nr. NL0017.60.968.B.01</li>
					</ul>

					<address class="c-footer__address">Antwoordnummer 16077, 2501 VE 's-Gravenhage, Adres NIBC Bank N.V. Carnegieplein 4, 2517 KJ 's-Gravenhage</address>
				</div>
			</div>
		</div>
	</div>

{% endmacro %}