/**
 * Site footer — Figma node 475:1773.
 */

.site-footer {
	--footer-social-icon-size: 1.1875rem; /* 19px */

	background-color: var(--color-footer-bg);
	color: var(--color-footer-muted);
	padding-block: var(--space-96) var(--space-64);
}

.site-footer__inner {
	display: flex;
	flex-direction: column;
	gap: 3.0625rem; /* 49px */
}

.site-footer__top {
	display: flex;
	align-items: flex-start;
	gap: 5.1875rem; /* 83px */
}

.site-footer__brand {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	flex: 0 0 14.625rem; /* 234px */
	gap: 1.5625rem; /* 25px */
}

.site-footer__logo-link {
	display: block;
	text-decoration: none;
	color: var(--color-text-inverse);
	line-height: 0;
}

.site-footer__logo {
	display: block;
	height: auto;
	max-width: 14.625rem;
}

.site-footer__name {
	font-family: var(--font-sans);
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: var(--nav-letter-spacing);
	line-height: 1.2;
	text-transform: uppercase;
	color: var(--color-text-inverse);
}

.site-footer__tagline {
	margin: 0;
	max-width: 13.6875rem; /* 219px */
	font-family: var(--font-sans);
	font-size: var(--text-body-sm-size);
	font-weight: var(--text-body-sm-weight);
	line-height: var(--text-body-line-height);
	letter-spacing: var(--text-body-letter-spacing);
	color: var(--color-footer-tagline);
}

.site-footer__social-icon {
	display: block;
	flex: 0 0 auto;
	overflow: clip;
	width: var(--footer-social-icon-size);
	height: var(--footer-social-icon-size);
}

.site-footer__social-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.site-footer__navs {
	flex: 1 1 0;
	display: grid;
	grid-template-columns: repeat(var(--footer-cols, 4), minmax(0, 1fr));
	gap: var(--space-32);
	min-width: 0;
}

.site-footer__col {
	display: flex;
	flex-direction: column;
	gap: var(--space-16);
	min-width: 0;
}

.site-footer__heading {
	margin: 0;
	padding: 1px 0 var(--space-16);
	border-bottom: 0.5px solid var(--color-border);
	font-family: var(--font-sans);
	font-size: var(--nav-size);
	font-weight: var(--nav-weight-bold);
	line-height: var(--nav-line-height);
	letter-spacing: var(--nav-letter-spacing);
	text-transform: uppercase;
	color: var(--color-text-inverse);
}

.site-footer__menu {
	display: flex;
	flex-direction: column;
	gap: var(--space-8);
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-footer__menu a {
	display: block;
	font-family: var(--font-sans);
	font-size: var(--text-body-size);
	font-weight: var(--text-body-weight);
	line-height: var(--text-body-line-height);
	letter-spacing: var(--text-body-letter-spacing);
	color: var(--color-footer-muted);
	text-decoration: none;
}

.site-footer__menu a:hover,
.site-footer__menu a:focus-visible {
	color: var(--color-text-inverse);
}

.site-footer__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-24);
	padding-block: var(--space-16);
	border-top: 0.5px solid var(--color-border);
}

.site-footer__copy {
	margin: 0;
	font-family: var(--font-sans);
	font-size: var(--text-footer-meta-size);
	font-weight: var(--text-body-weight);
	line-height: var(--text-body-line-height);
	letter-spacing: var(--text-body-letter-spacing);
	color: var(--color-footer-meta);
}

.site-footer__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-24);
}

.site-footer__credit,
.site-footer__legal-menu a {
	font-family: var(--font-sans);
	font-size: var(--text-footer-meta-size);
	font-weight: var(--text-body-weight);
	line-height: var(--text-body-line-height);
	letter-spacing: var(--text-body-letter-spacing);
	color: var(--color-footer-meta);
	text-decoration: none;
}

.site-footer__credit[href]:hover,
.site-footer__credit[href]:focus-visible,
.site-footer__legal-menu a:hover,
.site-footer__legal-menu a:focus-visible {
	color: var(--color-text-inverse);
}

.site-footer__legal-menu {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-24);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (max-width: 1439px) {
	.site-footer {
		padding-block: var(--space-80) var(--space-48);
	}

	.site-footer__top {
		flex-direction: column;
		gap: var(--space-48);
	}

	.site-footer__brand {
		flex-basis: auto;
	}

	.site-footer__navs {
		width: 100%;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.site-footer {
		padding-block: var(--space-64) var(--space-40);
	}

	.site-footer__inner {
		gap: var(--space-40);
	}

	.site-footer__navs {
		grid-template-columns: minmax(0, 1fr);
	}

	.site-footer__bar {
		flex-direction: column;
		align-items: flex-start;
	}
}