.header {
	position: relative;
	z-index: 4;
	margin-bottom: 3rem;
}

.header__content {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding-top: 1.6875rem;
	padding-bottom: 1.6875rem;
}

.header__logo {
	position: relative;
	z-index: 4;
	font-family: "Thabit";
	font-weight: 700;
	font-size: 1.3125rem;
	line-height: 100%;
	letter-spacing: 0;
	color: rgb(43, 44, 106);
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.header__menu {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: end;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-flex: 1;
	-ms-flex: auto;
	flex: auto;
}
.menu__body {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	width: 100%;
	max-width: 51.5625rem;
	margin-left: 1.875rem;
	gap: 1.875rem;
}

.menu__list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 2.25rem;
	padding: 0.75rem 1.125rem;
	background-color: #fff;
	border-radius: 3.125rem;
}

.menu__link {
	font-weight: 500;
	font-size: 0.875rem;
	line-height: 0.875rem;
	letter-spacing: 0;
	color: rgb(43, 44, 106);
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.menu__profile {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	background-color: #fff;
	border-radius: 3.125rem;
	padding: 0.25rem 0.5rem;
	gap: 0.75rem;
}

.menu__profile-text {
	font-weight: 500;
	font-size: 0.875rem;
	line-height: 0.875rem;
	letter-spacing: 0;
	color: rgb(43, 44, 106);
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}
@media (max-width: 29.99875em) {
	.header__content {
		padding-top: 0.875rem;
		padding-bottom: 0.875rem;
	}

	.header__logo {
		font-size: 0.75rem;
	}
}
@media (max-width: 71.875em) {
	.menu__body {
		max-width: 46.875rem;
	}
}
@media (max-width: 29.99875em) {
	.header__content {
		padding-top: 0.875rem;
		padding-bottom: 0.875rem;
	}

	.header__logo {
		font-size: 0.75rem;
	}

	.menu__link {
		font-size: 1.125rem;
	}

	.menu__profile {
		padding: 0.25rem 0.5rem;
	}

	.menu__profile-text {
		font-size: 1.125rem;
	}
}
@media (max-width: 61.99875em) {
	.menu__bg {
		display: none;
		position: fixed;
		z-index: -5;
		background-color: rgba(35, 26, 86, 0);
		height: 250rem;
		width: calc(100% + 1.25rem);
		opacity: 0;
		margin-right: -1.25rem;
		-webkit-transition: all 0.5s ease 0s;
		transition: all 0.5s ease 0s;
	}

	.menu-open .menu__bg {
		opacity: 1;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		background-color: rgba(35, 26, 86, 0.6);
	}

	.menu__body {
		/* padding: 5.25rem 1rem 1rem 1rem; */
		position: fixed;
		z-index: 3;
		max-width: unset;
		width: 100%;
		/* min-height: 25.4375rem; */
		top: 0;
		right: -100%;
		-webkit-transition: all 0.3s ease 0s;
		transition: all 0.3s ease 0s;
		overflow: auto;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		align-items: start;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: start;
		background-color: #f0eeff;
		-webkit-box-shadow: 0px 4px 27.9px 0px rgba(59, 51, 101, 0);
		box-shadow: 0px 4px 27.9px 0px rgba(59, 51, 101, 0);
		gap: 2.25rem;

		padding: 0;
        min-height: auto;
        height: 100%;
	}

	.menu-open .menu__body {
		right: 0;
		-webkit-box-shadow: 0px 4px 27.9px 0px rgb(59, 51, 101);
		box-shadow: 0px 4px 27.9px 0px rgb(59, 51, 101);
		padding-top: 2rem;
		padding-bottom: 2rem;
		z-index: 4;
	}

	.menu__list {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		align-items: start;
		gap: 2.25rem;
		overflow: auto;
		background-color: unset;
		overflow: unset;
	}

	.menu__link {
		font-size: 1.5rem;
	}

	.menu__profile {
		padding: 0.5rem 1rem;
		margin-left: 1rem;
		margin-bottom: 2rem;
		margin-top: 2rem;
	}

	.menu__profile-text {
		font-size: 1.5rem;
	}
	.icon-menu {
		display: block;
		position: relative;
		width: 1.875rem;
		height: 1.125rem;
		z-index: 5;
	}

	.icon-menu span,
	.icon-menu::before,
	.icon-menu::after {
		content: "";
		-webkit-transition: all 0.3s ease 0s;
		transition: all 0.3s ease 0s;
		right: 0;
		position: absolute;
		width: 100%;
		height: 0.125rem;
		background-color: #4834b4;
		border-radius: 0.125rem;
	}

	.icon-menu::before {
		top: 0;
	}

	.icon-menu::after {
		bottom: 0;
	}

	.icon-menu span {
		top: calc(50% - 0.0625rem);
	}

	.menu-open .icon-menu span {
		width: 0;
	}

	.menu-open .icon-menu::before {
		top: calc(50% - 0.0625rem);
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}

	.menu-open .icon-menu::after {
		bottom: calc(50% - 0.0625rem);
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}
@media (any-hover: hover) {
	.header__logo:hover {
		color: rgb(123, 125, 194);
	}
    .menu__link:hover {
		color: rgb(123, 125, 194);
	}
	.menu__profile:hover .menu__profile-text {
		color: rgb(123, 125, 194);
	}
}