/* ── FOOTER (transferred from Framer "Footer" component) ── */
footer {
	background-color: var(--color-dark);
	color: var(--color-white);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	padding: 20px 16px 24px;
}

.footer-row {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	width: 100%;
}

@media (min-width: 768px) {
	.footer-row {
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-end;
		gap: 46px;
	}
}

.footer-group {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
}

@media (min-width: 768px) {
	.footer-group {
		flex-direction: row;
		gap: 24px;
	}
}

.footer-group a {
	font-size: var(--text-body-size);
	font-weight: 400;
	letter-spacing: var(--text-body-tracking);
	line-height: var(--text-body-leading);
	color: var(--color-white);
	transition: color 0.2s;
}

@media (hover: hover) {
	.footer-group a:hover {
		color: rgba(253, 253, 253, 0.85);
	}
}

.footer-copy {
	font-size: var(--text-caption-size);
	font-weight: 400;
	letter-spacing: var(--text-caption-tracking);
	line-height: var(--text-caption-leading);
	color: var(--color-white);
	opacity: 0.5;
}