/* ==========================================================================
   Footer
   ========================================================================== */

.footer {
	position: relative;
	padding-top: clamp(4.5rem, 8vw, 7rem);
	padding-bottom: var(--space-5);
	background: var(--ace-navy-deep);
	color: var(--text-inverse);
	overflow: hidden;
}

.footer__top {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr));
	gap: var(--space-6);
	padding-bottom: clamp(3rem, 6vw, 5rem);
}

.footer__logo {
	display: inline-block;
	margin-bottom: var(--space-4);
}

.footer__statement {
	max-width: 36ch;
	color: var(--text-inverse-muted);
	font-size: var(--fs-small);
}

.footer__heading {
	margin-bottom: var(--space-4);
	font-family: var(--font-body);
	font-size: var(--fs-eyebrow);
	font-weight: 500;
	letter-spacing: var(--tracking-eyebrow);
	text-transform: uppercase;
	color: var(--ace-gold-soft);
}

.footer__list {
	display: grid;
	gap: 0.7rem;
	font-size: var(--fs-small);
}

.footer__list a {
	color: var(--text-inverse-muted);
	background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 1px;
	transition: color var(--dur-fast), background-size var(--dur-base) var(--ease-premium);
}

.footer__list a:hover,
.footer__list a:focus-visible {
	color: var(--ace-ivory);
	background-size: 100% 1px;
}

.footer__social {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.footer__social .icon {
	width: 1rem;
	height: 1rem;
}

/* Giant brand line */
.footer__display {
	display: flex;
	justify-content: space-between;
	gap: 0.3em;
	padding-block: clamp(1.5rem, 3vw, 2.5rem);
	border-top: var(--hairline-inverse);
	font-family: var(--font-display);
	font-weight: 300;
	font-size: clamp(2.5rem, 9.2vw, 9.5rem);
	line-height: 0.95;
	letter-spacing: -0.03em;
	color: transparent;
	-webkit-text-stroke: 1px rgba(246, 243, 236, 0.26);
	user-select: none;
	white-space: nowrap;
}

.footer__display span:nth-child(2) {
	font-style: italic;
}

.footer__bottom {
	display: flex;
	align-items: center;
	gap: var(--space-5);
	padding-block: var(--space-4);
	border-top: var(--hairline-inverse);
	font-size: var(--fs-xs);
	color: var(--text-inverse-muted);
}

.footer__legal {
	margin-inline: auto;
}

.footer__legal-list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-4);
}

.footer__legal-list a:hover,
.footer__top-link:hover {
	color: var(--ace-ivory);
}

.footer__top-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-left: auto;
	font-size: var(--fs-xs);
	letter-spacing: 0.04em;
	color: var(--text-inverse-muted);
	transition: color var(--dur-fast);
}

.footer__legal + .footer__top-link {
	margin-left: 0;
}

.footer__top-link .icon {
	width: 1rem;
	height: 1rem;
	transform: rotate(180deg);
}

.footer__fine {
	display: flex;
	justify-content: space-between;
	gap: var(--space-5);
	padding-top: var(--space-4);
	border-top: var(--hairline-inverse);
	font-size: 0.75rem;
	line-height: 1.6;
	color: rgba(246, 243, 236, 0.45);
}

.footer__disclaimer {
	max-width: 90ch;
}

.footer__credit {
	flex: none;
}