.header {
	background: var(--main-color);
	z-index: 1000;
	padding: 8px 5px;
}

.header__flex {
	display: flex;
	align-items: center;
	color: var(--white-color);
	font-size: 1.2rem;
}

.header__nav {
	display: flex;
	align-items: center;
	margin-right: 8%;
}

.header-logo {
	display: flex;
	gap: 0.5rem;
	width: 65px;
}


.links {
	display: flex;
	gap: 3rem;
}

.auth {
	display: flex;
	gap: 1rem;
	margin-left: auto; /* теперь блок уходит вправо */
}

.menu-toggle {
	padding: 4px 8px;
	outline: none;
	border: none;
	background: #0142b1;
	color: white;
	font-size: 22px;
	cursor: pointer;
	border-radius: 4px;
	display: none;
}

.header-menu {
	display: none;
	position: absolute;
	padding: 20px;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #0142b1;
	z-index: 1000;
}

.header-menu.open {
	display: block;
}

.header-menu-close {
	position: absolute;
	top: 20px;
	right: 20px;
	cursor: pointer;
	transition: all 0.3s all;
}

.header-menu-close:hover {
	color: gray;
}

.header-menu-content {
	margin-top: 20px;
	display: flex;
	flex-direction: column;
}

.header-menu-links {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.header-menu-links a {
	padding: 5px;
}
.header-menu-links a:hover {
	background: #023791;
}

@media (max-width: 435px) {
	.logo,
	.auth,
	.links {
		display: none;
	}

	.header {
		background: white;
	}

	.header__flex {
		display: flex;
		justify-content: end;
	}

	.menu-toggle {
		display: inline-block;
	}
}

.menu-logo {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 1.5rem;
}

.menu-logo-img {
  width: 36px;
  height: auto;
}

.menu-logo-text {
  font-family: "Inter", sans-serif;
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
}
