/*
 * Pied de page : nom de l’association, liens de service, mentions légales, flux.
 *
 * Sans logo, comme la maquette : le nom en toutes lettres suffit, l’identité
 * visuelle étant déjà portée par l’en-tête.
 */

.cvigee-pied {
	background-color: var(--color-bg);
	margin-top: var(--space-section);
}

.cvigee-pied__corps {
	border-top: var(--rule);
	padding-top: var(--space-md);
	padding-bottom: var(--space-xl);
}

.cvigee-pied__haut {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-md) var(--space-lg);
}

.cvigee-pied__nom {
	flex: 0 1 auto;
	font-size: var(--fs-meta);
	line-height: var(--lh-body-sm);
	color: var(--color-text-muted);
	margin: 0;
}

/* ------------------------------------------------------------- Liens. */

.cvigee-pied__liens {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 26px;
	margin: 0;
	padding: 0;
}

.cvigee-pied__liens a {
	font-family: var(--font-ui);
	font-size: var(--fs-meta);
	letter-spacing: var(--ls-nav);
	color: var(--color-accent);
}

.cvigee-pied__liens a:hover,
.cvigee-pied__liens a:focus {
	color: var(--color-ink);
}

/* ------------------------------------------------------- Bas de pied. */

.cvigee-pied__bas {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-sm) var(--space-lg);
	margin-top: var(--space-lg);
	padding-top: var(--space-md);
	border-top: var(--rule);
}

.cvigee-pied__legal {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	margin: 0;
	padding: 0;
}

.cvigee-pied__legal a,
.cvigee-pied__mention {
	font-family: var(--font-ui);
	font-size: var(--fs-label);
	letter-spacing: var(--ls-nav);
	color: var(--color-text-muted);
}

.cvigee-pied__legal a:hover,
.cvigee-pied__legal a:focus {
	color: var(--color-accent);
}

.cvigee-pied__mention {
	margin: 0;
}

@media (max-width: 640px) {

	.cvigee-pied__haut,
	.cvigee-pied__bas {
		flex-direction: column;
		align-items: flex-start;
	}

	.cvigee-pied__liens {
		flex-direction: column;
		gap: 12px;
	}
}