.project-topbar {
	position: sticky;
	top: 0;
	z-index: 9999;
	background: rgba(255, 255, 255, .96);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid #e6e9ef;
	box-shadow: 0 10px 30px rgba(20, 24, 33, .06);
	font-family: Inter, Montserrat, Segoe UI, Arial, sans-serif
}

.project-nav-wrap {
	width: min(1180px, calc(100% - 36px));
	margin: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 22px;
	padding: 12px 0
}

.project-logos {
	display: flex;
	align-items: center;
	gap: 16px;
	text-decoration: none;
	min-width: 260px
}

.project-logos img {
	display: block;
	height: auto
}

.project-logo-fokisuli {
	width: 160px
}

.project-logo-kex {
	width: 170px;
	max-height: 54px;
	object-fit: contain
}

.project-divider {
	width: 1px;
	height: 42px;
	background: #d8deea
}

.project-nav-links {
	display: flex;
	gap: 9px;
	flex-wrap: wrap;
	justify-content: flex-end
}

.project-nav-links a {
	color: #235096;
	text-decoration: none;
	font-weight: 500;
	font-size: 16px;
	padding: 9px 12px;
	border-radius: 999px;
	border: 1px solid transparent;
	white-space: nowrap
}

.project-nav-links a:hover {
	background: #edf3ff;
	border-color: #dce5f7
}

.project-nav-links a.active {
	background: #235096;
	color: #fff;
	border-color: #235096
}

@media(max-width:900px) {
	.project-nav-wrap {
		align-items: flex-start;
		flex-direction: column
	}

	.project-nav-links {
		justify-content: flex-start
	}

	.project-logos {
		flex-wrap: wrap
	}

	.project-logo-fokisuli {
		width: 145px
	}

	.project-logo-kex {
		width: 155px
	}
}

@media(max-width:520px) {
	.project-nav-wrap {
		width: min(100% - 24px, 1180px)
	}

	.project-logo-fokisuli {
		width: 130px
	}

	.project-logo-kex {
		width: 145px
	}

	.project-nav-links a {
		font-size: 12px;
		padding: 8px 10px
	}

	.project-divider {
		display: none
	}
}