/*
 * FOOTER — banda navy con marca, navegación y línea legal.
 */

.site-footer {
	background-color: var(--color-primary-strong);
	color: var(--color-on-dark-soft);
	padding-block: var(--space-8) var(--space-6);
}

.site-footer__grid {
	display: grid;
	gap: var(--space-7);
	padding-block-end: var(--space-7);
	border-block-end: 1px solid color-mix(in oklch, var(--color-on-dark) 15%, transparent);
}

@media (min-width: 48em) {
	.site-footer__grid {
		grid-template-columns: 2fr 1fr;
	}
}

.site-footer__name {
	font-family: var(--font-display);
	font-size: var(--text-xl);
	font-weight: var(--weight-bold);
	color: var(--color-on-dark);
}

.site-footer__tagline {
	margin-block-start: var(--space-2);
	max-width: 32rem;
}

.site-footer__menu {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.site-footer__menu--inline {
	flex-direction: row;
	flex-wrap: wrap;
	gap: var(--space-4);
}

.site-footer__menu a {
	text-decoration: none;
	transition: color var(--duration-fast) var(--ease-out);
}

.site-footer__menu a:hover {
	color: var(--color-on-dark);
}

.site-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--space-4);
	padding-block-start: var(--space-5);
	font-size: var(--text-sm);
}