header {
	padding: 25px 0;
	width: 100%;
	display: block;
	position: fixed;
	z-index: 999;
	top: 0;
	left: 0;
	width: 100vw;
	background-color: var(--color-white);
}

header>.search,
header>.top,
header .conteudo .btn-search,
header .conteudo .nav-desktop {
	display: none;
}

header .conteudo {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

header .conteudo .logo {
	display: block;
	max-height: 62px;
	max-width: min(252px, 66%);
}

header .conteudo .logo img {
	width: 100%;
	display: block;
}

header .conteudo .btn-nav {
	cursor: pointer;
	line-height: 1;
	color: var(--color-destaque);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.2);
	background: var(--color-white);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius: 10px;
}

header .conteudo .btn-nav svg {
	width: 18px;
	height: 18px;
}

header .conteudo .navbar {
	max-height: 100vh;
	min-height: 100vh;
	position: fixed;
	right: 0;
	top: 0;
	width: 300px;
	padding-right: 30px;
	max-width: 100%;
	z-index: 99;
	border-radius: 0px;
	-webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
	transform: translateX(101%);
	background: var(--color-white);
	opacity: 0;
	visibility: hidden;
}

header .conteudo .navbar .conteudo {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	height: min-content;
	max-height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
	position: absolute;
	padding-right: 25px;
}

header .conteudo .navbar.active {
	transform: translateX(0);
	opacity: 1;
	visibility: visible;
}

header .conteudo .navbar .menu-backdrop {
	position: absolute;
	top: 0;
	left: calc(-100vw);
	width: calc(100vw);
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	content: " ";
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

header .conteudo .navbar.active .menu-backdrop {
	opacity: 1;
	visibility: visible;
}

header .conteudo .navbar .logo {
	max-width: calc(100% - 50px);
	padding: 16px 0 25px 25px;
	max-height: none;
}

header .conteudo .navbar .logo img {
	max-width: 188px;
	max-height: 46px;
}

header .conteudo .navbar .btn-close {
	fill: var(--color-destaque-2);
	transform: translateY(29px) translateX(-10px);
	cursor: pointer;
}

header .conteudo .navbar .form-busca {
	margin: 0px 0 25px 25px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #ecf6fa;
}

header .conteudo .navbar .form-busca input,
header .conteudo .navbar .form-busca button {
	margin-bottom: 0;
	border: none;
	border-radius: 0;
	background: transparent;
}

header .conteudo .navbar .form-busca button {
	width: 50px;
	cursor: pointer;
}

header .conteudo .navbar .form-busca button svg {
	width: 18px;
	height: 18px;
}

header .conteudo .navbar .nav {
	width: 100%;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

header .conteudo .navbar .nav li {
	position: relative;
	display: block;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}

header .conteudo .navbar .nav li.active>a {
	color: var(--color-destaque-2);
}

header .conteudo .navbar .nav li a {
	position: relative;
	display: block;
	line-height: 1.5;
	padding: 10px 15px 10px 25px;
	font-size: 16px;
	font-weight: 500;
	color: var(--color-destaque);
	text-transform: capitalize;
	-webkit-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
	border: none;
	text-transform: uppercase;
}

header .conteudo .navbar .nav li.active>a::before {
	content: " ";
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	-webkit-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
	width: 2px;
	background: var(--color-destaque-2);
	pointer-events: none;
}

header .conteudo .navbar .nav li>svg {
	position: absolute;
	top: 7px;
	right: 0;
	background: #ecf6fa;
	padding: 9px;
	width: 30px;
	height: 30px;
	cursor: pointer;
}

header .conteudo .navbar .nav li>.subcategoria {
	display: none;
	padding-left: 15px;
}

header .conteudo .navbar .nav li>.subcategoria li a {
	text-transform: none;
}

header .conteudo .navbar .contatos {
	height: auto;
	padding: 25px 0px 25px 25px;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	gap: 5px;
}

header .conteudo .navbar .contatos a,
header .conteudo .navbar .contatos p.endereco {
	color: var(--color-destaque);
	font-size: 14px;
}

header .conteudo .navbar .contatos h4 {
	color: var(--color-destaque);
	font-weight: 700;
	font-size: 18px;
	padding-top: 25px;
	display: none;
	width: 100%;
}

header .conteudo .navbar .contatos h4:first-child {
	border-top: 1px solid var(--color-destaque-2);
}

header .conteudo .navbar .contatos .redes-sociais {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 10px;
	margin-top: 10px;
}

header .conteudo .navbar .contatos .redes-sociais a svg {
	fill: var(--color-destaque);
}

@media only screen and (min-width: 769px) {

	header>.search,
	header>.top,
	header .conteudo .btn-search {
		display: block;
	}

	header .conteudo .btn-search {
		cursor: pointer;
		line-height: 1;
		color: var(--color-destaque);
		display: flex;
		align-items: center;
		justify-content: center;
		width: 50px;
		height: 50px;
		align-items: center;
		justify-content: center;
		font-size: 18px;
		box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.2);
		background: var(--color-white);
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		-o-border-radius: 10px;
		-ms-border-radius: 10px;
		border-radius: 10px;
		margin: 0 20px 0 auto;
	}

	header {
		padding-top: 0;
	}

	header>.search {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		background-color: var(--color-white);
		transform: translateY(calc(-100% - 80px));

		transition-delay: 0s;
		z-index: 99999999;
		padding-top: 70px;
		padding-bottom: 100px;
		backdrop-filter: blur(10px);
		transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	}

	header>.search.active {
		transform: translateY(0%);
	}

	header>.search .btn-close-search {
		position: absolute;
		top: 10%;
		right: 2%;
		z-index: 2;
		cursor: pointer;
	}

	header>.search .btn-close-search svg {
		fill: var(--color-destaque-2);
		width: 20px;
		height: 20px;
	}

	header>.search .form-busca {
		position: relative;
	}

	header>.search .form-busca input {
		width: 100%;
		height: 100%;
		background-color: transparent;
		border: 0;
		border-bottom-width: 0px;
		border-bottom-style: none;
		border-bottom-color: currentcolor;
		outline: 0;
		font-size: 24px;
		color: var(--color-destaque);
		border-bottom: 1px solid transparent;
		padding: 0;
		padding-right: 0px;
		padding-right: 30px;
		border-bottom: 1px solid var(--color-destaque-2);
		border-radius: 0;
		margin-bottom: 0px;
	}

	header>.search .form-busca button {
		position: absolute;
		background: transparent;
		border: navajowhite;
		color: var(--color-destaque-2);
		right: 0;
		top: 0px;
		font-size: 25px;
		padding: 0;
		width: 50px;
		line-height: 50px;
	}

	header>.search .form-busca button svg {
		width: 22px;
		height: 22px;
	}

	header>.top {
		background-color: #0E104B;
		margin-bottom: 25px;
		padding: 12px 0;
	}

	header>.top .conteudo {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 10px;
	}

	header>.top .conteudo .contatos {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 15px;
	}

	header>.top .conteudo .contatos a,
	header>.top .conteudo .horario {
		color: var(--color-white);
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 5px;
		font-size: 14px;
	}

	header>.top .conteudo .contatos a {
		transition: var(--transition-time);
	}

	header>.top .conteudo .contatos a:hover {
		color: var(--color-destaque-2);
	}

	header>.top .conteudo .contatos a:hover>svg {
		fill: var(--color-destaque-2);
	}

	header>.top .conteudo .contatos a svg,
	header>.top .conteudo .horario svg {
		fill: var(--color-white);
		transition: var(--transition-time);
		opacity: 0.7;
	}
}

@media only screen and (min-width:992px) {
	header>.top .conteudo {
		flex-direction: row;
		justify-content: space-between;
	}
}

@media only screen and (min-width:1160px) {
	header {
		padding-bottom: 0;
	}

	header>.top {
		margin-bottom: 0px;
	}

	header .conteudo .nav-desktop {
		display: flex;
		margin: 0 0 0 auto;
		position: relative;
		gap: 15px;
	}

	header .conteudo .nav-desktop>li {
		position: relative;
		padding: 40px 0;
	}

	header .conteudo .nav-desktop>li>a {
		color: var(--color-destaque);
		text-transform: uppercase;

	}

	header .conteudo .nav-desktop>li>svg {
		display: none;
	}

	header .conteudo .nav-desktop li>.subcategoria {
		position: absolute;
		left: 0;
		top: 100%;
		min-width: 230px;
		border: 1px solid #f5f5f5;
		background: var(--tg-color-white-default);
		margin: 0;
		-webkit-transform: scale(1, 0);
		-moz-transform: scale(1, 0);
		-ms-transform: scale(1, 0);
		-o-transform: scale(1, 0);
		transform: scale(1, 0);
		transform-origin: 0 0;
		-webkit-transition: all 0.3s ease-out 0s;
		-moz-transition: all 0.3s ease-out 0s;
		-ms-transition: all 0.3s ease-out 0s;
		-o-transition: all 0.3s ease-out 0s;
		transition: all 0.3s ease-out 0s;
		background-color: var(--color-white);
		-webkit-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
		-moz-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
		box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
		-o-border-radius: 6px;
		-ms-border-radius: 6px;
		border-radius: 6px;
		padding: 18px 0;
		display: block;
		visibility: hidden;
		opacity: 0;
		z-index: 9;
	}

	header .conteudo .nav-desktop li:hover>.subcategoria {
		visibility: visible;
		opacity: 1;
		transform: scale(1, 1);
	}

	header .conteudo .nav-desktop li>.subcategoria li {
		margin-left: 0;
		text-align: left;
		display: block;
	}

	header .conteudo .nav-desktop li>.subcategoria li a {
		padding: 8px 15px 8px 25px;
		line-height: 1.4;
		display: block;
		color: var(--color-destaque);
		transition: var(--transition-time);
	}

	header .conteudo .nav-desktop li>.subcategoria li a:hover {
		color: var(--color-destaque-2);
	}

	header .conteudo .navbar .form-busca,
	header .conteudo .navbar .nav {
		display: none;
	}

	header .conteudo .navbar .contatos h4 {
		display: block;
	}
}

@media only screen and (min-width:1400px) {
	header .conteudo .nav-desktop {
		gap: 45px;
	}
}