/* Component: footer — design-reference/canvas/Footer.dc.html */

.mx-footer { background: var(--mx-forest-deep); color: var(--mx-on-dark); font-size: var(--mx-text-md); }
.mx-footer a { color: var(--mx-footer-link); text-decoration: none; }
.mx-footer a:hover { color: var(--mx-white); text-decoration: underline; }
.mx-footer a:focus-visible { outline-color: var(--mx-footer-focus); }

.mx-footer__top {
	display: flex; flex-wrap: wrap; gap: var(--mx-space-12);
	padding-top: 64px; padding-bottom: var(--mx-space-8);
}
.mx-footer__about { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: var(--mx-space-4); }
.mx-footer__about p { margin: 0; line-height: 1.6; max-width: 30em; }
.mx-footer__brand { display: flex; align-items: center; gap: var(--mx-space-3); }
.mx-footer__logo-well {
	display: inline-flex; align-items: center; justify-content: center;
	width: 52px; height: 52px; border-radius: var(--mx-radius-md);
	background: var(--mx-white);
}
.mx-footer__logo-well img { width: 40px; height: 40px; object-fit: contain; }
.mx-footer__name { font-family: var(--mx-font-display); font-size: 24px; color: var(--mx-white); }

.mx-footer__col { flex: 0 1 200px; display: flex; flex-direction: column; gap: 10px; }
.mx-footer__col strong { color: var(--mx-white); font-weight: 600; }

.mx-footer__bottom {
	display: flex; flex-wrap: wrap; justify-content: space-between;
	gap: var(--mx-space-3) var(--mx-space-8);
	padding-top: var(--mx-space-5); padding-bottom: var(--mx-space-8);
	background: linear-gradient(var(--mx-footer-rule), var(--mx-footer-rule)) no-repeat top / calc(100% - 2 * var(--mx-gutter)) 1px;
	font-size: var(--mx-text-xs);
	color: var(--mx-footer-fine);
}