/*
 * Site header and footer (template parts).
 */

/* ---------- Header ---------- */

header.wp-block-template-part {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0);
	z-index: 50;
}

.wp-block-group.biomasha-header {
	--header-gap: 25px;

	padding-block: 0;
	height: var(--wp--custom--header);
	color: var(--wp--custom--color--on-dark);
}

/* The doubled class outranks the flex gap WordPress prints for the block. */
.wp-block-group.biomasha-header__row {
	position: relative;
	gap: var(--header-gap);
	height: 100%;
}

@media (max-width: 1199px) {

	.wp-block-group.biomasha-header {
		--header-gap: 18px;
	}

	/* The header brand shrinks earlier than the footer one. */
	.biomasha-header .biomasha-brand {
		--brand-size: 23px;
	}
}

@media (min-width: 900px) and (max-width: 999px) {

	.biomasha-header .biomasha-brand {
		--brand-size: 22px;
	}
}

@media (max-width: 1100px) {

	.wp-block-group.biomasha-header {
		--header-gap: 17px;
	}
}

/* ---------- Footer ---------- */

.wp-block-group.biomasha-footer {
	--footer-pad-top: 50px;
	--footer-masthead-gap: 35px;
	--footer-masthead-pad: 36px;
	--footer-links-gap: 36px;
	--footer-links-pad: 40px 0 42px;
	--footer-column-gap: 12px;
	--footer-link-height: 32px;
	--footer-bottom-gap: 22px;

	padding-top: var(--footer-pad-top);
	padding-bottom: 22px;
	color: var(--wp--custom--color--on-dark-footer);
}

.biomasha-footer a {
	color: inherit;
	text-decoration: none;
}

.wp-block-group.biomasha-footer__masthead {
	gap: var(--footer-masthead-gap);
	padding-bottom: var(--footer-masthead-pad);
	border-bottom: 1px solid var(--wp--custom--color--line-dark);
}

.biomasha-footer__tagline {
	margin: 0;
	font-size: var(--wp--preset--font-size--ui);
	line-height: var(--wp--custom--line-height--ui);
	color: var(--wp--custom--color--on-dark-tagline);
}

.biomasha-footer .biomasha-footer__cta {
	margin-left: auto;
}

.biomasha-footer__cta .wp-block-button__link {
	font-size: 13px;
}

.biomasha-footer .biomasha-footer__links {
	display: grid;
	grid-template-columns: 1.2fr 1fr 1fr 1fr;
	gap: var(--footer-links-gap);
	margin-block: 0;
	padding: var(--footer-links-pad);
}

.biomasha-footer__column {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--footer-column-gap);
	min-width: 0;
}

.biomasha-footer__title {
	margin: 0 0 8px;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--body);
	font-weight: var(--wp--custom--font-weight--subsection);
	line-height: var(--wp--custom--line-height--tight);
	letter-spacing: -0.02em;
	color: var(--wp--custom--color--on-dark);
}

.biomasha-footer__list {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--footer-column-gap);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--wp--preset--font-size--ui);
	line-height: var(--wp--custom--line-height--ui);
	color: var(--wp--custom--color--on-dark-muted);
}

.biomasha-footer__list a {
	display: block;
	min-height: var(--footer-link-height);
	padding: 3px 0;
}

.biomasha-footer__list a:hover {
	color: var(--wp--custom--color--on-dark-hover);
	text-decoration: underline;
	text-underline-offset: 4px;
}

.wp-block-group.biomasha-footer__bottom {
	gap: var(--footer-bottom-gap);
	align-items: center;
	padding-top: 20px;
	padding-bottom: 6px;
	border-top: 1px solid var(--wp--custom--color--line-dark-bottom);
	font-size: var(--wp--preset--font-size--caption);
	line-height: var(--wp--custom--line-height--ui);
	color: var(--wp--custom--color--on-dark-fine);
}

.biomasha-footer__bottom p {
	margin: 0;
}

.biomasha-footer__bottom a:hover {
	text-decoration: underline;
}

.biomasha-footer .biomasha-footer__top {
	margin-left: auto;
}

@media (max-width: 1100px) {

	.wp-block-group.biomasha-footer {
		--footer-links-gap: 24px;
	}
}

@media (max-width: 899px) {

	.wp-block-group.biomasha-footer {
		--footer-masthead-gap: 26px;
		--footer-links-gap: 30px;
	}

	.biomasha-footer .biomasha-footer__links {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.biomasha-footer__cta .wp-block-button__link {
		padding-inline: 18px;
		font-size: 12px;
	}
}

@media (max-width: 599px) {

	.wp-block-group.biomasha-footer {
		--footer-pad-top: 32px;
		--footer-masthead-gap: 20px;
		--footer-masthead-pad: 29px;
		--footer-links-gap: 30px 20px;
		--footer-links-pad: 30px 0;
		--footer-column-gap: 7px;
		--footer-link-height: 40px;
		--footer-bottom-gap: 14px 18px;
	}

	.biomasha-footer__masthead {
		flex-wrap: wrap;
	}

	.biomasha-footer .biomasha-footer__tagline {
		max-width: 170px;
		margin-left: auto;
	}

	/* The mock-up keeps a slightly larger gap in the last column on phones. */
	.biomasha-footer__column:last-child {
		--footer-column-gap: 8px;
	}

	.biomasha-footer .biomasha-footer__cta {
		width: 100%;
		margin-left: 0;
	}

	.biomasha-footer__list a {
		display: flex;
		align-items: center;
	}

	.biomasha-footer__cta .wp-block-button,
	.biomasha-footer__cta .wp-block-button__link {
		width: 100%;
	}

	.biomasha-footer__title {
		margin-bottom: 7px;
	}

	.biomasha-footer__note {
		order: 5;
		width: 100%;
	}
}

@media (max-width: 359px) {

	.wp-block-group.biomasha-footer {
		--footer-links-gap: 25px 15px;
	}

	.biomasha-footer .biomasha-footer__tagline {
		margin-left: 0;
	}
}