/**
 * Shared MEXTURA components.
 */

.mextura-header {
	position: relative;
	z-index: 20;
}

.mextura-header__inner {
	min-height: 3.75rem;
	gap: 1rem;
}

.mextura-brand-logo {
	flex: 0 0 auto;
	margin: 0;
}

.mextura-brand-logo a {
	display: inline-block;
}

.mextura-brand-logo img {
	height: auto;
}

.mextura-primary-nav {
	margin-left: auto;
}

.mextura-primary-nav .wp-block-navigation-item__content,
.mextura-footer-nav .wp-block-navigation-item__content {
	color: var(--wp--preset--color--navy);
	text-decoration: none;
}

.mextura-primary-nav .wp-block-navigation-item__content:hover,
.mextura-footer-nav .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--petrol-dark);
}

.wp-block-button__link:hover {
	background-color: var(--wp--preset--color--petrol-dark);
	color: var(--wp--preset--color--white);
}

.wp-block-button.is-style-outline .wp-block-button__link {
	border: 0.125rem solid var(--wp--preset--color--navy);
	color: var(--wp--preset--color--navy);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--petrol-dark);
	background: var(--wp--preset--color--petrol-dark);
	color: var(--wp--preset--color--white);
}

.mextura-footer__top {
	gap: clamp(2rem, 6vw, 5rem);
}

.mextura-footer h2 {
	margin-top: 0;
}

.mextura-footer-nav {
	align-items: flex-start;
	gap: 0.45rem;
}

.mextura-legal-links {
	margin: 0;
	padding: 0;
	list-style: none;
}

.mextura-legal-links li + li {
	margin-top: 0.45rem;
}

.mextura-footer__bottom {
	color: var(--wp--preset--color--neutral-700);
}

.mextura-footer__bottom > * {
	margin: 0;
}

.mextura-whatsapp {
	position: fixed;
	right: calc(1rem + env(safe-area-inset-right));
	bottom: calc(1rem + env(safe-area-inset-bottom));
	z-index: 19;
	display: grid;
	width: 3.25rem;
	height: 3.25rem;
	place-items: center;
	border: 0.125rem solid var(--wp--preset--color--white);
	border-radius: 50%;
	background: var(--wp--preset--color--navy);
	box-shadow: var(--wp--preset--shadow--soft);
	text-decoration: none;
}

.mextura-whatsapp img {
	display: block;
	width: 2rem;
	height: 2rem;
}

.mextura-whatsapp:hover {
	background: var(--wp--preset--color--slate);
}

.mextura-whatsapp:focus-visible {
	outline-color: var(--wp--preset--color--petrol);
	box-shadow: 0 0 0 0.125rem var(--wp--preset--color--white), var(--wp--preset--shadow--soft);
}

@media (max-width: 63.999rem) {
	.mextura-whatsapp {
		right: calc(0.75rem + env(safe-area-inset-right));
		bottom: calc(0.75rem + env(safe-area-inset-bottom));
		width: 3rem;
		height: 3rem;
	}

	.mextura-whatsapp img {
		width: 1.875rem;
		height: 1.875rem;
	}

	.mextura-brand-logo img {
		max-width: min(11.875rem, 54vw);
	}

	.mextura-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none;
	}

	.mextura-header .wp-block-navigation__responsive-container-open {
		display: flex;
		min-width: 2.75rem;
		min-height: 2.75rem;
		align-items: center;
		justify-content: center;
	}

	.mextura-header .wp-block-navigation__responsive-container.is-menu-open {
		padding: max(1.25rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) 2rem max(1rem, env(safe-area-inset-left));
	}

	.mextura-header .wp-block-navigation__responsive-container-content {
		align-items: flex-start;
		padding-top: 3rem;
	}

	.mextura-header .wp-block-navigation__container {
		width: 100%;
		align-items: flex-start;
		gap: 0.25rem;
	}

	.mextura-header .wp-block-navigation-item,
	.mextura-header .wp-block-navigation-item__content {
		width: 100%;
	}

	.mextura-header .wp-block-navigation-item__content {
		display: flex;
		min-height: 2.75rem;
		align-items: center;
		padding: 0.55rem 0;
		font-size: clamp(1.125rem, 4vw, 1.35rem);
	}

	.mextura-header .wp-block-navigation__responsive-container-close {
		display: flex;
		min-width: 2.75rem;
		min-height: 2.75rem;
		align-items: center;
		justify-content: center;
	}
}

@media (min-width: 64rem) {
	.mextura-header .wp-block-navigation__responsive-container-open {
		display: none;
	}

	.mextura-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: block;
	}

	.mextura-primary-nav {
		font-size: 0.82rem;
	}

	.mextura-primary-nav .wp-block-navigation__container {
		gap: clamp(0.65rem, 1.05vw, 1.15rem);
	}
}