.logo-bar {
	 display: flex;
	 align-items: center;
	 font-size: 26px;
	 font-weight: bold;
	 line-height: 40px;
}
 .logo-bar img {
	 height: 40px;
	 margin-right: 5px;
}
 nav ul {
	 display: flex;
	 column-gap: clamp(28px, 2vw, 46px);
	 align-items: center;
	 justify-content: center;
}
 nav ul li {
	 font-size: clamp(12px, 0.83vw, 16px);
	 color: white;
	 transition: color 0.4s ease;
}
 nav ul li:hover {
	 color: var(--primary-color);
}
 .lang-btn {
	 width: clamp(18px, 1.15vw, 22px);
	 height: clamp(18px, 1.15vw, 22px);
	 background-image: url('../assets/icons/lang.png');
	 background-size: cover;
	 cursor: pointer;
}
 .lang-btn.active .lang-menu {
	 max-height: 122px;
	 transition: max-height 0.5s;
}
 .lang-btn .lang-menu {
	 z-index: 1000;
	 position: absolute;
	 right: 0;
	 margin-top: 30px;
	 padding: 0;
	 width: 160px;
	 max-height: 0;
	 overflow: hidden;
	 box-sizing: border-box;
	 border-radius: 6px;
	 background: white;
	 box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
}
 .lang-btn .lang-menu li {
	 position: relative;
	 display: flex;
	 align-items: center;
	 gap: 14px;
	 padding: 0 12px;
	 margin: 3px;
	 height: 50px;
	 border-radius: 6px;
	 box-sizing: border-box;
	 font-size: 16px;
	 color: black;
}
 .lang-btn .lang-menu li:hover {
	 background: var(--primary-color);
}
 .lang-btn .lang-menu li .dot {
	 position: absolute;
	 right: 12px;
	 width: 6px;
	 height: 6px;
	 background: var(--primary-color);
	 border: 1px solid #f8faff;
	 border-radius: 6px;
}
 .lang-btn .lang-menu .line {
	 display: block;
	 width: calc(100% - 6px);
	 height: 1px;
	 margin: 0 3px;
	 box-sizing: border-box;
	 border-bottom: solid 1px lightgray;
}
 @media screen and (max-width: 1024px) {
	 .logo-bar {
		 font-size: 22px;
	}
	 .logo-bar img {
		 height: 28px;
	}
	 nav {
		 position: absolute;
		 left: 0;
		 right: 0;
		 top: 100%;
		 max-height: 0;
		 background: #fff;
		 box-shadow: 0 3px 20px rgba(0, 0, 0, 0.2);
		 overflow: hidden;
	}
	 nav ul {
		 flex-direction: column;
		 align-items: center;
		 justify-content: center;
		 row-gap: 20px;
		 padding: 20px 0;
		 margin: 0;
	}
	 nav ul li::after {
		 content: none !important;
	}
	 nav ul a {
		 font-size: 20px;
	}
	 .mobile-menu-btn {
		 display: block !important;
		 width: 24px;
	}
	 .mobile-menu-btn .menu-icon {
		 width: 24px;
		 zoom: 0.6;
		 -webkit-transition: all 0.2s ease-in;
		 -moz-transition: all 0.2s ease-in;
		 -o-transition: all 0.2s ease-in;
		 transition: all 0.2s ease-in;
	}
	 .mobile-menu-btn .menu-icon span {
		 display: block;
		 height: 4px;
		 background: white;
		 border-radius: 1px;
		 -webkit-transition: all 0.4s ease-out;
		 -moz-transition: all 0.4s ease-out;
		 -o-transition: all 0.4s ease-out;
		 transition: all 0.4s ease-out;
	}
	 .mobile-menu-btn .menu-icon:hover span.bar2 {
		 margin: 6px 0;
	}
	 .mobile-menu-btn .menu-icon span.bar2 {
		 margin: 4px 0;
	}
}