.o-footer {
	@include template(brand, info, nav--one, nav--two, title--one, title--two);
	@include z(z-footer);
	flex: 0;
	position: relative;
	padding-bottom: 0;
	color: palette(neutral, 0);
	background-color: palette(primary);
	transition: padding 0.6s;

	&:not(.is-simple)::after {
		@include ornament-hex-stroked('large', 'topright');
		content: '';
		display: block;
	}

	.is-cookie-bar-visible & {
		padding-bottom: $site-cookieBar-height;
	}

	&.is-simple {
		background-color: palette(primary, 700);
	}
}

.o-footer__main {
	@include contain;
	@include vspacing(
		'padding-top' 0.5,
		'padding-bottom' 0.5
	);
	margin-top: space(3);
	margin-bottom: space(3);
	display: grid;
	grid-gap: space(4) space(2);
	grid-template-columns: 1fr 1fr;
	grid-template-areas:
		"brand       brand"
		"info        info"
		"title--one  title--two"
		"nav--one    nav--two";

	@include mq(700) {
		grid-template-columns: 4fr 2fr 2fr;
		grid-template-areas:
			"brand title--one title--two"
			"info  nav--one   nav--two";
	}

	@include mq(1000) {
		grid-template-columns: 3fr 2fr 3fr;
	}
}

.o-footer__brand {
	display: inline-block;
	transition: opacity 200ms linear;

	&:hover { opacity: 0.5; }
}

.o-footer__logo {
	width: 152px;
}

.o-footer__title {
	@include text-style(5);
	color: palette(secondary, 500);
	align-self: center;
}

.o-footer__list {
	list-style: none;
	margin: 0;
}

.o-footer__link {
	display: inline-block;
	position: relative;
	z-index: 0;
	color: palette(neutral, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s linear;

	&::before {
		content: '';
		display: block;
		position: absolute;
		z-index: -1;
		left: -20px;
		top: 4px;
		width: calc(100% + 40px);
		height: calc(50% + 8px);
		background-color: palette(primary, 700);
		opacity: 0.5;
		transform: scaleX(0) skew(60deg);
		transform-origin: center;
		transition: transform 0.3s cubic-bezier(.5, -1.5, 0.5, 3);
	}

	&:hover {
		color: palette(action, 0);

		&::before {
			transform: scaleX(1) skew(60deg);
		}
	}

	&:focus {
		outline-color: palette(action);
	}
}

.o-footer__contact {
	margin-top: space(3);
}

.o-footer__data {
	display: flex;
}

.o-footer__label {
	min-width: space(12);
}

.o-footer__social {
	display: flex;
	list-style: none;
	margin: space(4) 0 0;
}

.o-footer__channel {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	margin-right: space(2);
}

.o-footer__icon {
	flex: auto;
	display: block;
	height: 100%;
	color: palette(neutral, 0);
	background-repeat: no-repeat;
	background-position: center;
	transition-property: color;
	transition-duration: 0.25s;

	&:hover {
		color: palette(action, 300);
	}
}