/*
 * LAU global footer - responsive and glyph layer only.
 *
 * Background, colours, spacing, gaps and the border on the copyright bar all
 * come from block attributes and theme.json presets. Only what Gutenberg has
 * no control for lives here: the logo/wordmark row, the social glyphs, the
 * nav list reset, the bottom bar's responsive stack and the hover states.
 *
 * Every selector is scoped to .lau-footer, so nothing here can reach the
 * header or any section of the front page.
 */

.lau-footer__logo {
	margin: 0;
	flex: 0 0 auto;
	line-height: 0;
}

.lau-footer__logo img {
	display: block;
	height: auto;
}

.lau-footer__desc,
.lau-footer__brand + p {
	max-width: 30rem;
}

.lau-footer__desc,
.lau-footer__brand + p,
.lau-footer__nav a,
.lau-footer__contact p,
.lau-footer__contact a,
.lau-footer__bottom p,
.lau-footer__bottom a {
	font-size: 1rem !important;
	line-height: 1.55 !important;
}

/* ---------- Social row ---------- */

.lau-footer__social {
	margin: 0;
}

.lau-footer__social-item {
	margin: 0;
}

.lau-footer__social-item a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	text-decoration: none;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.lau-footer__social-item a {
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--wp--preset--color--spx-border-on-dark);
	border-radius: 0.4rem;
	color: var(--wp--preset--color--spx-on-dark-muted);
	font-size: 1rem;
}

.lau-footer__social-item a:hover {
	color: var(--wp--preset--color--spx-on-dark);
	border-color: var(--wp--preset--color--spx-on-dark-muted);
}

.lau-footer__social-icon {
	width: 0.9rem;
	height: 0.9rem;
	flex: 0 0 auto;
	background-color: currentColor;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
}

/* Same glyphs as the contact section's own social row, reused rather than redrawn. */
.lau-footer__social-icon-instagram {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1'/%3E%3C/svg%3E");
}

.lau-footer__social-icon-facebook {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M22 12.06C22 6.5 17.52 2 12 2S2 6.5 2 12.06c0 5 3.66 9.15 8.44 9.94v-7.03H7.9v-2.9h2.54V9.85c0-2.52 1.5-3.91 3.77-3.91 1.09 0 2.24.2 2.24.2v2.46h-1.26c-1.24 0-1.63.78-1.63 1.57v1.89h2.78l-.44 2.9h-2.34V22c4.78-.79 8.44-4.94 8.44-9.94z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M22 12.06C22 6.5 17.52 2 12 2S2 6.5 2 12.06c0 5 3.66 9.15 8.44 9.94v-7.03H7.9v-2.9h2.54V9.85c0-2.52 1.5-3.91 3.77-3.91 1.09 0 2.24.2 2.24.2v2.46h-1.26c-1.24 0-1.63.78-1.63 1.57v1.89h2.78l-.44 2.9h-2.34V22c4.78-.79 8.44-4.94 8.44-9.94z'/%3E%3C/svg%3E");
}

.lau-footer__social-icon-tiktok {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M16.6 5.82a4.28 4.28 0 0 1-3.14-1.4V15a4.6 4.6 0 1 1-3.86-4.54v2.35a2.28 2.28 0 1 0 1.59 2.17V2h2.27a4.28 4.28 0 0 0 3.14 3.68z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M16.6 5.82a4.28 4.28 0 0 1-3.14-1.4V15a4.6 4.6 0 1 1-3.86-4.54v2.35a2.28 2.28 0 1 0 1.59 2.17V2h2.27a4.28 4.28 0 0 0 3.14 3.68z'/%3E%3C/svg%3E");
}

/* ---------- Quick nav ---------- */

.lau-footer__nav {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}

/*
 * core/list's own item styling carries a margin-top on <li>, which stacked on
 * top of the flex gap above instead of being replaced by it - measured at 18px
 * between items instead of the declared 10.4px. Zeroing it here leaves gap as
 * the only source of spacing.
 */
.lau-footer__nav li {
	margin: 0;
}

.lau-footer__nav a {
	color: var(--wp--preset--color--spx-on-dark-muted);
	font-size: var(--wp--preset--font-size--spx-small);
	text-decoration: none;
	transition: color 0.2s ease;
}

.lau-footer__nav a:hover {
	color: var(--wp--preset--color--spx-primary);
}

/* ---------- Contact column ---------- */

.lau-footer__contact a {
	color: inherit;
	text-decoration: none;
}

.lau-footer__contact a:hover {
	color: var(--wp--preset--color--spx-primary);
}

/* ---------- Bottom bar ---------- */

.lau-footer__bottom a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}

.lau-footer__bottom a:hover {
	color: var(--wp--preset--color--spx-primary);
}

.lau-footer p,
.lau-footer a {
	font-size: 1rem !important;
	line-height: 1.55 !important;
}

/* ---------- Columns ---------- */

@media (max-width: 781px) {
	.lau-footer__grid {
		flex-wrap: wrap;
	}

	.lau-footer__grid > .wp-block-column {
		flex-basis: 100% !important;
	}
}
