.site-footer {
	flex-shrink: 0;
	background: var(--gray-950);
	color: var(--gray-400);
	padding-block: var(--space-8);
}

.site-footer-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-5);
	width: 100%;
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
	text-align: center;
}

.footer-nav ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--space-2) var(--space-6);
}

.footer-nav a {
	display: inline-block;
	padding: var(--space-2);
	font-size: var(--fs-sm);
	color: var(--gray-300);
	transition: color var(--dur-fast) var(--ease);
}

.footer-nav a:hover {
	color: var(--white);
}

.footer-nav a:focus-visible {
	outline-color: var(--accent);
}

.footer-legal {
	font-size: var(--fs-sm);
	color: var(--gray-500);
}

@media (min-width: 700px) {
	.site-footer-inner {
		flex-direction: row;
		justify-content: space-between;
		text-align: left;
	}
}