/**
 * Pie de página — bloque oscuro (Abeto) con menú legal dinámico.
 *
 * @package SilviaGarcia
 */

.site-footer {
	flex-shrink: 0;
	background-color: var(--sg-fir);
	color: var(--sg-linen);
	padding-block: calc(var(--sg-unit) * 8) calc(var(--sg-unit) * 4);

	/*
	 * Filete superior en lino al 10 %. Se lee sobre todo cuando la última
	 * sección de la página también es abeto (el cierre de casi todas): sin él
	 * el pie y el CTA se funden en un único bloque oscuro. Sobre una sección
	 * clara simplemente no se aprecia, que es lo que buscamos.
	 */
	border-top: var(--sg-hairline-dark);
}

@media (min-width: 768px) {

	.site-footer {
		padding-block: calc(var(--sg-unit) * 12) calc(var(--sg-unit) * 5);
	}
}

.site-footer a {
	color: var(--sg-linen-70);
	text-decoration: none;
	transition: color var(--sg-transition);
}

.site-footer a:hover,
.site-footer a:focus {
	color: var(--sg-clay);
}

.site-footer__inner {
	display: grid;
	grid-template-columns: 1fr;
	gap: calc(var(--sg-unit) * 6);
}

@media (min-width: 768px) {

	.site-footer__inner {
		grid-template-columns: 1.5fr 1fr 1fr;
		gap: calc(var(--sg-unit) * 4);
	}
}

/* Marca ------------------------------------------------------------------ */

.site-footer__brand-name {
	margin: 0 0 calc(var(--sg-unit) * 2);
	font-family: var(--sg-font-heading);
	font-size: var(--sg-headline-sm);
	font-weight: var(--sg-heading-weight);
	color: var(--sg-linen);
}

.site-footer__brand-name a {
	color: var(--sg-linen);
}

/* Antes --sg-linen-50: demasiado poco contraste para un párrafo de lectura. */
.site-footer__tagline {
	max-width: 34ch;
	margin: 0;
	color: var(--sg-linen-70);
	font-size: var(--sg-body-md);
	font-weight: var(--sg-weight-text);
	line-height: 1.7;
}

/* Columnas de enlaces ----------------------------------------------------- */

.site-footer__col-title {
	margin: 0 0 calc(var(--sg-unit) * 2);
	color: var(--sg-linen-50);
	font-family: var(--sg-font-body);
	font-size: var(--sg-label);
	font-weight: 600;
	letter-spacing: var(--sg-label-tracking);
	text-transform: uppercase;
}

.site-footer__menu ul,
.site-footer__menu li {
	list-style: none;
	margin: 0;
	padding: 0;
}

.site-footer__menu li {
	margin-bottom: calc(var(--sg-unit) * 1.5);
}

.site-footer__menu a {
	font-size: var(--sg-body-md);
	font-weight: var(--sg-weight-text);
}

/* Línea inferior ---------------------------------------------------------- */

.site-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: calc(var(--sg-unit) * 2);
	margin-top: calc(var(--sg-unit) * 8);
	padding-top: calc(var(--sg-unit) * 3);
	border-top: var(--sg-hairline-dark);
	color: var(--sg-linen-50);
	font-size: var(--sg-label);
	letter-spacing: 0.04em;
}

.site-footer__bottom p {
	margin: 0;
}
