/* assets/css/components/header.css */
header {
	padding: 15px 0;
	position: fixed;
	width: 100%;
	top: 0;
	z-index: 1000;
	transition: all 0.3s ease;
	background: transparent;
}

header.scrolled {
	border-bottom: 1px solid rgba(221, 227, 233, 0.5);
	transition: all 0.3s ease;
	background: #30588e !important;
}

header.scrolled .text-muted a,
header.scrolled .text-muted span {
	color: #fff;
}

header.scrolled .header-menu a {
	color: #fff;
}

header.scrolled .services-btn {
	color: #123262 !important;
}

header.scrolled .header-search input {
	background: rgba(248, 250, 253, 0.25);
	color: #fff;
	border: none;
}

header.scrolled .header-search input::placeholder {
	color: #fff;
}

header.scrolled .search-btn svg {
	stroke: #fff;
}

header.scrolled .services-menu__list a {
	color: #121212;
}


header.scrolled .text-muted__details svg path {
	fill: #cde4ff;
}

header.scrolled .header-logo svg path {
	fill: #FFFFFF;
}

header.scrolled .burger svg path {
	stroke: #FFFFFF;
}

.text-muted__details {
	display: flex;
	gap: 8px;
	align-items: center;
}

.text-muted {
	display: flex;
	gap: 25px;
}

.text-muted a,
.text-muted span {
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 14px;
	line-height: 171%;
	color: #121212;
	text-decoration: none;
}

.header-top {
	border-bottom: 1px solid rgba(248, 250, 253, 0.25);
	padding-bottom: 10px;
}

.header-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.header-logo svg {
	max-height: 72px;
	height: 100%;
}

.header-search {
	position: relative;
	width: 400px;
	flex-shrink: 0;
}

.header-search input {
	width: 100%;
	border-radius: 24px;
	padding: 7px 12px 7px 44px;
	background: rgba(255, 255, 255, 0.25);
	font-size: 15px;
	color: #333;
	outline: none;
	border: 1px solid rgba(248, 250, 253, 0.5);
}


.search-btn {
	position: absolute;
	top: 50%;
	left: 12px;
	transform: translateY(-50%);
	border: none;
	background: none;
	cursor: pointer;
	padding: 0;
}

.header-main {
	padding-top: 12px;
}

@media (max-width: 768px) {
	header {
		padding: 0;
	}

	.text-muted {
		justify-content: space-between;
		width: 100%;
	}

	.header-logo {
		z-index: 1200;
	}

	.header-logo svg {
		max-height: 52px;
		width: auto;
	}

	.header-top {
		padding-top: 10px;
		padding-bottom: 10px;
	}

	.header-main {
		margin-top: 10px;
	}

	.text-muted a,
	.text-muted span {
		line-height: 143%;
	}
}