/**
 * Site Footer
 * Matches Mallory Oniki footer (Figma 823:11723)
 *
 * Spacing tokens (desktop 1512):
 * - Top content padding: 57px vertical, 205px horizontal
 * - Nav ↔ tagline ↔ nav gap: 163px
 * - Nav link stack gap: 24px
 * - Content → legal gap: 36px
 * - Legal → logo gap: 21px
 * - Legal inset: 32px; logo band: 256px
 */

.site-footer {
	position: relative;
	color: var(--wp--preset--color--butter-yellow, #f5e29e);
	background-color: var(--wp--preset--color--coffee, #3c1f10);
	overflow: hidden;
}

.site-footer__inner {
	position: relative;
	z-index: 1;
	max-width: 1512px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 21px;
}

.site-footer__top {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 34px;
	width: 100%;
}

.site-footer__main {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	gap: 163px;
	width: 100%;
	max-width: 1512px;
	margin: 0 auto;
	padding: 57px 205px;
	box-sizing: border-box;
}

.site-footer__nav {
	flex: 0 0 auto;
	width: 89px;
}

.site-footer__menu {
    list-style: none;
    margin: -5px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    text-align: center;
}

.site-footer__menu a {
	color: var(--wp--preset--color--butter-yellow, #f5e29e);
	font-family: var(--wp--preset--font-family--gt-maru-mono, ui-monospace, Consolas, Menlo, monospace);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.05em;
	line-height: 1;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: opacity 150ms ease;
}

.site-footer__menu a:hover,
.site-footer__menu a:focus {
	opacity: 0.7;
	text-decoration: underline;
	text-decoration-skip-ink: none;
	text-underline-offset: 3px;
}

.site-footer__tagline {
	flex: 0 1 598px;
	max-width: 598px;
	width: 100%;
	margin: 0;
	color: var(--wp--preset--color--butter-yellow, #f5e29e);
	font-family: var(--wp--preset--font-family--pp-neue-montreal, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
	font-size: 32px;
	font-weight: 400;
	letter-spacing: -0.013em;
	line-height: 1.1;
	text-align: center;
	opacity: 1;
}

.site-footer__legal {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	width: 100%;
	max-width: 1448px;
    margin: 0 auto -8px;
	padding: 0;
	box-sizing: border-box;
}

.site-footer__copyright,
.site-footer__credits {
	margin: 0;
	color: var(--wp--preset--color--butter-yellow, #f5e29e);
	font-family: var(--wp--preset--font-family--gt-maru-mono, ui-monospace, Consolas, Menlo, monospace);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.8;
	text-transform: uppercase;
	white-space: nowrap;
}

.site-footer__credits {
	text-align: right;
}

.site-footer__credits a {
	color: inherit;
	text-decoration: none;
	transition: opacity 150ms ease;
}

.site-footer__credits a:hover,
.site-footer__credits a:focus {
	opacity: 0.7;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.site-footer__logo {
	position: relative;
	width: 100%;
	line-height: 0;
	pointer-events: none;
}

.site-footer__logo-img {
	display: block;
	width: 100%;
	height: auto;
	max-width: none;
}

.site-footer__logo-img--mobile {
	display: none;
}

/* Mid desktop (~1024–1400): reduce horizontal insets. */
@media (min-width: 64rem) and (max-width: 87.5rem) {
	.site-footer__main {
		padding: 57px 5%;
	}

	.site-footer__legal {
		padding: 0 20px;
	}
}

/* Tablet — scale insets, keep vertical rhythm proportional */
@media (max-width: 1200px) {
	.site-footer__main {
		gap: clamp(48px, 8vw, 163px);
		padding: 57px clamp(40px, 8vw, 205px);
	}
}

@media (max-width: 67.5rem) {
	.site-footer__main {
		justify-content: space-between;
	}
}

@media (max-width: 1100px) {
	.site-footer__inner {
		gap: 21px;
	}

	.site-footer__top {
		gap: 36px;
	}

	.site-footer__main {
		gap: 48px;
		padding: 48px 40px;
	}

	.site-footer__tagline {
		font-size: 24px;
		max-width: 420px;
		flex-basis: 420px;
	}

	.site-footer__legal {
		padding: 0 32px;
	}
}

/* Mobile — Figma Footer (node 823:11746) */
@media (max-width: 48rem) {
	.site-footer {
		min-height: 1009px;
	}

	.site-footer__inner {
		gap: 21px;
		min-height: inherit;
		position: static;
	}

	.site-footer__logo {
		height: 883px;
		left: 50%;
		max-width: 402px;
		position: absolute;
		top: 0;
		transform: translateX(-50%);
		width: 100%;
		z-index: 0;
	}

	.site-footer__logo-img--desktop {
		display: none;
	}

	.site-footer__logo-img--mobile {
		display: block;
		height: 100%;
		object-fit: contain;
		object-position: center top;
		width: 100%;
	}

	.site-footer__top {
		gap: 21px;
		position: relative;
		width: 100%;
		z-index: 1;
	}

	.site-footer__main {
		align-items: center;
		box-sizing: border-box;
		flex-direction: column;
		gap: 24px;
		margin: 0 auto;
		max-width: 402px;
		padding: calc(57px + 170px) 20px calc(44px + 170px);
		width: 100%;
	}

	.site-footer__nav {
		width: 89px;
	}

	.site-footer__menu {
		flex-direction: column;
		flex-wrap: nowrap;
		gap: 24px;
		justify-content: center;
		margin: 0;
	}

	.site-footer__tagline {
		flex-basis: auto;
		font-size: 32px;
		letter-spacing: -0.01em;
		line-height: 1.1;
		max-width: 362px;
		order: -1;
		width: 100%;
	}

	.site-footer__legal {
		align-items: center;
		box-sizing: border-box;
		flex-direction: column;
		gap: 20px;
		margin: 0 auto;
		max-width: 402px;
		padding: 0 0 20px;
		text-align: center;
		width: 100%;
	}

	.site-footer__copyright,
	.site-footer__credits {
		font-size: 14px;
		letter-spacing: 0.1em;
		line-height: 1.8;
		text-align: center;
		white-space: normal;
	}
}