/**
 * FashionFlow global footer.
 */

.ff-site-footer {
	padding-block: clamp(3.5rem, 8vw, 6rem) var(--ff-space-4);
	border-top: 1px solid var(--ff-color-border);
	background: var(--ff-color-card);
}

.ff-footer__main {
	display: grid;
	gap: var(--ff-space-6);
}

.ff-footer__brand {
	max-width: 28rem;
}

.ff-footer__brand p {
	max-width: 24rem;
	margin-top: var(--ff-space-3);
	color: var(--ff-color-muted);
}

.ff-footer__menus {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--ff-space-5) var(--ff-space-4);
}

.ff-footer__column h2 {
	margin-bottom: var(--ff-space-3);
	font-family: var(--ff-font-sans);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ff-footer-menu {
	display: grid;
	gap: 0.65rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

.ff-footer-menu a {
	color: var(--ff-color-muted);
	font-size: 0.9rem;
	text-decoration: none;
}

.ff-footer-menu a:hover {
	color: var(--ff-color-accent);
}

.ff-footer__bottom {
	display: grid;
	gap: var(--ff-space-2);
	padding-top: var(--ff-space-5);
	margin-top: var(--ff-space-6);
	border-top: 1px solid var(--ff-color-border);
	color: var(--ff-color-muted);
	font-size: 0.75rem;
}

.ff-footer__bottom p {
	margin: 0;
}

@media (min-width: 40rem) {
	.ff-footer__menus {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.ff-footer__bottom {
		grid-template-columns: minmax(0, 1fr) minmax(0, auto);
		align-items: end;
	}

	.ff-footer__bottom p:last-child {
		max-width: 25rem;
		text-align: right;
	}
}

@media (min-width: 64rem) {
	.ff-footer__main {
		grid-template-columns: minmax(18rem, 0.85fr) minmax(0, 1.15fr);
		align-items: start;
		gap: clamp(4rem, 8vw, 8rem);
	}
}