/**
 * Site footer — Figma "Footer" (8-78) / "Footer mobile" (13-98).
 * Mobile: logo, menu, head office, copyright. Desktop: 4 columns + bottom bar.
 */

.site-footer {
	background: var(--bg-inverse);
	color: var(--text-inverse);
}

.site-footer__inner {
	display: flex;
	flex-direction: column;
	gap: var(--space-32);
	max-width: calc(var(--container) + 2 * var(--gutter));
	margin-inline: auto;
	padding: var(--space-48) var(--gutter) 40px;
}

.site-footer__top {
	display: flex;
	flex-direction: column;
	gap: var(--space-16);
}

.site-footer__logo {
	width: 79px;
	height: auto;
}

.site-footer a {
	text-decoration: none;
}

.site-footer a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.site-footer__col {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

/* Mobile: tagline, solutions and menu title are hidden (Figma 13-98) */
.site-footer__tagline,
.site-footer__col--solutions,
.site-footer__col--menu .site-footer__title,
.site-footer__divider,
.site-footer__rights {
	display: none;
}

.site-footer__list {
	display: flex;
	flex-direction: column;
	gap: var(--space-16);
}

.site-footer__col--menu .site-footer__list {
	line-height: var(--nav-line);
}

.site-footer__col--menu a {
	font-size: var(--nav-size);
	font-weight: var(--nav-weight);
	line-height: var(--nav-line);
	letter-spacing: var(--nav-tracking);
	text-transform: uppercase;
}

.site-footer__col--contact {
	margin-top: var(--space-16);
}

.site-footer__col--contact .site-footer__list {
	gap: var(--space-4);
	font-size: var(--body-s-size);
	line-height: var(--body-s-line);
	opacity: 0.75;
}

.site-footer__bottom {
	display: flex;
	flex-direction: column;
	gap: var(--space-24);
}

.site-footer__legal {
	display: flex;
	flex-wrap: wrap;
	gap: 0 0.3em;
	margin: 0;
	font-size: var(--caption-size);
	font-weight: var(--caption-weight);
	line-height: var(--caption-line);
	letter-spacing: var(--caption-tracking);
	opacity: 0.5;
}

.site-footer__social {
	display: flex;
	gap: var(--space-12);
}

.site-footer__social a {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--icon-inverse);
	font-size: var(--button-size);
	font-weight: var(--button-weight);
	line-height: var(--button-line);
	letter-spacing: var(--button-tracking);
	text-transform: uppercase;
	opacity: 0.8;
	transition: opacity var(--duration-fast) var(--ease-out);
}

.site-footer__social a:hover {
	text-decoration: none;
	opacity: 1;
}

@media (min-width: 768px) {

	.site-footer__inner {
		gap: var(--space-64);
		padding-top: var(--space-96);
	}

	.site-footer__top {
		flex-flow: row wrap;
		gap: var(--space-48) var(--space-32);
		justify-content: space-between;
	}

	.site-footer__brand {
		display: flex;
		flex-basis: 100%;
		flex-direction: column;
		gap: var(--space-24);
	}

	.site-footer__tagline {
		display: block;
		max-width: 320px;
		margin: 0;
		opacity: 0.7;
	}

	.site-footer__col--solutions,
	.site-footer__col--menu .site-footer__title {
		display: flex;
	}

	.site-footer__list {
		gap: 14px;
	}

	.site-footer__list a,
	.site-footer__list span,
	.site-footer__col--menu a {
		font-size: var(--body-m-size);
		font-weight: 400;
		line-height: var(--body-m-line);
		letter-spacing: 0;
		text-transform: none;
		opacity: 0.75;
	}

	.site-footer__col--contact {
		margin-top: 0;
	}

	.site-footer__col--contact .site-footer__list {
		gap: 14px;
		font-size: var(--body-m-size);
		line-height: var(--body-m-line);
		opacity: 1;
	}

	.site-footer__list a:hover {
		opacity: 1;
	}

	.site-footer__divider {
		display: block;
		width: 100%;
		height: 1px;
		margin: 0;
		border: 0;
		background: var(--icon-inverse);
		opacity: 0.15;
	}

	.site-footer__rights {
		display: inline;
	}

	.site-footer__bottom {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.site-footer__legal {
		font-size: var(--body-s-size);
		font-weight: 400;
		line-height: var(--body-s-line);
		letter-spacing: 0;
	}
}

@media (min-width: 1024px) {

	.site-footer__brand {
		flex-basis: 320px;
	}
}
