/* The footer. Measurements: notes/design-reference.md. */

.site-footer {
	background: var(--color-light-pink);
}

.site-footer__logo-row {
	display: flex;
	justify-content: center;
	padding: var(--space-40) var(--space-20);
	border-bottom: 2px solid var(--color-pink-shadow);
}

.site-footer__logo-image {
	width: var(--logo-footer);
}

.site-footer__columns {
	display: flex;
	gap: var(--space-64);
	max-width: var(--content-width);
	margin: 0 auto;
	padding: var(--space-40) 0;
}

.site-footer__column {
	flex: 1 1 0;
	min-width: 0;
}

/* Elementor worked out this line height from the 16 px body text: 25.6 px. */
.site-footer__about,
.site-footer__copyright {
	line-height: calc(var(--text-16) * var(--leading-body));
}

.site-footer__about {
	font-size: var(--text-14);
}

/* Elementor left 20 px below its last block in a column. */
.site-footer__nav {
	padding-bottom: var(--space-20);
}

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

.site-footer__heading {
	margin: 0;
	font-size: var(--text-14);
	font-weight: var(--weight-regular);
	line-height: var(--leading-normal);
	letter-spacing: var(--tracking-lg);
	text-transform: uppercase;
}

.social-links {
	display: flex;
	flex-direction: column;
	gap: var(--space-30);
	/* On the live site the rows run 10 px past the list's own box, so what follows starts 10 px higher. */
	margin: 0 0 calc(var(--space-10) * -1);
	padding: 0;
	list-style: none;
}

/* The name starts 48 px from the icon's left edge. */
.social-links__item {
	display: grid;
	grid-template-columns: var(--space-48) auto;
	align-items: center;
}

.social-links__icon {
	width: var(--icon-social);
	height: var(--icon-social);
	object-fit: contain;
}

.social-links__link {
	font-size: var(--text-16);
	font-weight: var(--weight-semibold);
	line-height: var(--leading-body);
	color: var(--color-primary);
	text-decoration: none;
}

.social-links__link:hover {
	color: var(--color-accent);
}

.site-footer__menu-list {
	display: flex;
	flex-direction: column;
	gap: var(--space-20);
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-footer__menu-list a {
	display: block;
	font-size: var(--text-14);
	font-weight: var(--weight-semibold);
	letter-spacing: var(--tracking-lg);
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-primary);
	line-height: var(--leading-normal);
}

.site-footer__menu-list a:hover,
.site-footer__menu-list .current-menu-item > a {
	color: var(--color-accent);
}

.site-footer__bottom {
	padding: var(--space-20);
	border-top: 2px solid var(--color-pink-shadow);
	text-align: center;
}

.site-footer__copyright {
	margin: 0;
	padding-top: var(--space-12);
	font-size: var(--text-14);
}

@media (max-width: 1024px) {
	.site-footer__columns {
		padding-right: var(--space-20);
		padding-left: var(--space-20);
	}

	.site-footer__column {
		flex: 0 0 33%;
	}

	.site-footer__nav {
		display: none;
	}
}

@media (max-width: 767px) {
	.site-footer__logo-image {
		width: var(--logo-footer-small);
	}

	.site-footer__columns {
		flex-direction: column;
		gap: var(--space-32);
	}

	.site-footer__column {
		flex-basis: auto;
	}
}