/** navigation-footer */

.page-foot {
	--title-size: var(--font-size-2);
	position: relative;
	margin: -1px auto;
	padding-block: .5rem var(--spacer);
	color: var(--color-title);
	background-image: linear-gradient(to bottom in oklch, var(--panel-background-color-a) 72%, transparent);
	contain: paint layout;
}

.page-foot .menu-item {
	outline: none;
	border-radius: unset;
}

@media (pointer:coarse) {
	.page-foot .menu-item {
		padding-block: 0.6ex;
	}
}

.footer-main {
	--column-layout: repeat(auto-fit, minmax( calc(100% / var(--columns, 2)),	1fr) );
	padding: calc(var(--title-size) * .5) var(--spacer);
	margin-inline: auto;
}
@media (max-width: 35.999em), (pointer:coarse) {
	.footer-main {
		padding-inline: unset;
	}
}

.footer-section :any-link {
	&:active,
	&:hover,
	&:focus-visible {
		text-decoration: underline;
	}
}

.footer-section {
	--font-lineheight-3: var(--sizem-5);
	@media (max-width: 35.999em), (pointer:coarse) {
		margin-inline: var(--size-5);
		margin-bottom: var(--sizem-5)
	}
	:is(.text-sm, .menu-link) {
		font-size: var(--font-root);
	}
}

.footer-title {
	margin-block: 0 var(--title-size);
	font-size: var(--title-size);
	font-weight: 400;
	font-stretch: condensed;
	> span {
		white-space: nowrap;
	}
}
footer .-newsletter form {
	gap: 1ex;
	display: flex;
	flex-direction: column;
}
footer .-copyright {
	grid-column: 1/-1;
	place-self: center;
}

@media (min-width: 36em)  {
	.page-foot::before {
		position: absolute;
		content:'';
		display: block;
		top: 0;
		left: -2rem; 
		right: -2rem;
		/* puts footer heading in a drop-panel */
		height: calc(var(--title-size) * 2.5);
		box-shadow: inset 0 10px 20px #0003, 0 2px 8px #fff3;
	}
	.footer-main {
		display: flex;
		gap: 1rem;
		justify-content: space-between;
	}
}



/* html.gecko.css-has #nav-socials, */
html.safari[data-lacks*="css-has"] #nav-socials {
	:any-link:nth-of-type(1)::before {filter: none}
}

/* html.gecko.css-where #nav-socials, */
html.safari[data-lacks*="css-where"] #nav-socials {
	:any-link:nth-of-type(2)::before {filter: none}
}

/* html.gecko.nesting #nav-socials, */
html.safari[data-lacks*="nesting"] #nav-socials {
	:any-link:nth-of-type(3)::before {filter: none}
}

/* html.gecko.container #nav-socials, */
html.safari[data-lacks*="container"] #nav-socials {
	:any-link:nth-of-type(4)::before {filter: none}
}