/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/


.header-menu-modal {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 20px;
	padding: 0 20px;
	margin-top: 32px;
	list-style-type: none;
	height: auto;
	margin-bottom: 30px;
}

.header-menu-modal__item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

.menu-modal-services__list {
	display: none;
	margin-top: 16px;
	flex-direction: column;
	gap: 15px;
	transition: opacity .2s ease-in-out;
}

.menu-modal-services__list-item {
	font-family: 'Intro';
	font-size: 12px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	padding-bottom: 15px;

	color: rgba(51, 51, 51, 0.6);
	border-bottom: 1px solid rgba(51, 51, 51, 0.1);
}

.menu-modal-services__list-item:first-child {
	padding-top: 15px;
	border-top: 1px solid rgba(51, 51, 51, 0.1);
}

.menu-modal-services__list-item._selected {
	color: var(--color-red);
}

.menu-modal-services__list-item._selected .menu-modal-services__title {
	color: inherit;
}

.menu-modal--link {
	position: relative;
}

.header-menu-modal__item.has-sub .menu-modal--link::after {
	content: '';
	-webkit-mask-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='8' height='5' viewBox='0 0 8 5' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath opacity='0.4' d='M0.75 0.75L3.75 3.75L6.75 0.75' stroke='%23333333' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e ");
	mask-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='8' height='5' viewBox='0 0 8 5' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath opacity='0.4' d='M0.75 0.75L3.75 3.75L6.75 0.75' stroke='%23333333' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e ");
	background-color: rgba(51, 51, 51, 0.4);
	position: absolute;
	width: 8px;
	height: 5px;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
}

.header-menu-modal__item.has-sub .menu-modal--link._active::after {
	background-color: rgba(51, 51, 51, 1);
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}

.menu-modal--link._active {
	color: var(--color-red);
}

.menu-modal--link._selected {
	color: var(--color-red);
}

.menu-modal--link._active + .menu-modal-services__list {
	display: flex;
}