/*
 * Site header (template-parts/header.php), rebuilt from the former JetThemeCore header.
 * Dimensions are taken 1:1 from Elementor template 39. The pages pull their first section
 * under the header with a negative margin-top, so keep the header height unchanged
 * (desktop/tablet 199.4px, phone 94.4px). Breakpoints match Elementor: 1024 / 767.
 */

@font-face {
	font-family: "Coming Soon";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("fonts/coming-soon-400.woff2") format("woff2");
}

.voth-header {
	margin: -15px 0 -1px;
	padding: 10px 0 20px;
}

.voth-header__inner {
	display: flex;
	max-width: 1140px;
	margin: 0 auto;
}

.voth-header__brand {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	flex: 0 0 35.78%;
	max-width: 35.78%;
	padding-left: 15px;
}

.voth-header__logo {
	display: block;
}

.voth-header__logo-img {
	max-width: 100%;
	height: auto;
}

.voth-header__nav {
	position: relative;
	z-index: 3;
	box-sizing: border-box;
	flex: 1 1 auto;
	min-width: 0;
	padding: 10px 12px 0 39px;
}

.voth-menu {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}

.voth-menu > li {
	margin: 0 10px;
	padding: 0;
	list-style: none;
}

.voth-menu > li > a {
	display: flex;
	padding: 8px 11px 1px 5px;
	color: #000;
	font-family: "Coming Soon", sans-serif;
	font-size: 16px;
	font-style: italic;
	font-weight: 500;
	line-height: 1.643em;
	letter-spacing: 0;
	text-decoration: none;
	text-transform: uppercase;
}

.voth-menu > li > a:hover,
.voth-menu > li > a:focus {
	color: #000;
}

.voth-header__toggle,
.voth-header__close {
	display: none;
	box-sizing: content-box;
	min-width: 0;
	height: auto;
	margin: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	cursor: pointer;
}

.voth-header__toggle:hover,
.voth-header__toggle:focus,
.voth-header__close:hover,
.voth-header__close:focus {
	background: none;
	box-shadow: none;
}

.voth-header__icon {
	display: block;
	height: 1em;
}

.voth-header__icon--bars {
	width: 0.875em;
}

.voth-header__icon--times {
	width: 0.6875em;
}

@media (min-width: 768px) and (max-width: 1024px) {
	.voth-header__brand {
		flex-basis: 23%;
		max-width: 23%;
	}

	.voth-header__nav {
		flex: 0 0 75%;
		max-width: 75%;
	}
}

@media (max-width: 1024px) {
	.voth-header__nav {
		padding: 17px 12px 0 13px;
	}

	.voth-menu > li > a {
		padding: 0;
		font-size: 13px;
	}
}

@media (max-width: 767px) {
	.voth-header {
		margin: 0;
		padding: 20px 0;
	}

	.voth-header__inner {
		margin-top: -22px;
	}

	.voth-header__brand {
		flex-basis: 20%;
		max-width: 20%;
	}

	.voth-header__nav {
		display: flex;
		flex: 0 0 80%;
		justify-content: flex-end;
		max-width: 80%;
	}

	.voth-header__toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 95px;
		height: 40px;
		padding: 0;
		color: #f20909;
		font-size: 35px;
	}

	.voth-header__toggle:hover,
	.voth-header__toggle:focus {
		color: #f20909;
	}

	.voth-header__panel {
		position: fixed;
		top: 0;
		right: 0;
		z-index: 9999;
		box-sizing: border-box;
		width: 214px;
		height: 100%;
		padding: 35px 0 0;
		overflow-y: auto;
		background-color: #fffac6;
		box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
		visibility: hidden;
		transform: translateX(calc(100% + 12px));
		transition: transform 0.3s ease, visibility 0s linear 0.3s;
	}

	.voth-header--open .voth-header__panel {
		visibility: visible;
		transform: none;
		transition: transform 0.3s ease, visibility 0s;
	}

	.voth-header__close {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		padding: 10px;
		color: #3b3d42;
		font-size: 21px;
	}

	.voth-header__close:hover,
	.voth-header__close:focus {
		color: #3b3d42;
	}

	.voth-menu {
		display: block;
	}

	.voth-menu > li > a {
		font-size: 16px;
	}
}
