@font-face {
	font-family: 'Aptos';
	src: url('/shared/fonts/Aptos/Aptos.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Black';
	src: url('/shared/fonts/Aptos/Aptos-Black.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Black.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Black Italic';
	src: url('/shared/fonts/Aptos/Aptos-Black-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Black-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Black-Italic.ttf') format('truetype');
	font-weight: 900;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Bold';
	src: url('/shared/fonts/Aptos/Aptos-Bold.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Bold.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Bold Italic';
	src: url('/shared/fonts/Aptos/Aptos-Bold-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Bold-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Bold-Italic.ttf') format('truetype');
	font-weight: 700;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Display';
	src: url('/shared/fonts/Aptos/Aptos-Display.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Display.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Display.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Display Bold';
	src: url('/shared/fonts/Aptos/Aptos-Display-Bold.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Display-Bold.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Display-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Display Bold Italic';
	src: url('/shared/fonts/Aptos/Aptos-Display-Bold-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Display-Bold-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Display-Bold-Italic.ttf') format('truetype');
	font-weight: 700;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Display Italic';
	src: url('/shared/fonts/Aptos/Aptos-Display-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Display-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Display-Italic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos ExtraBold';
	src: url('/shared/fonts/Aptos/Aptos-ExtraBold.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-ExtraBold.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-ExtraBold.ttf') format('truetype');
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos ExtraBold Italic';
	src: url('/shared/fonts/Aptos/Aptos-ExtraBold-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-ExtraBold-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-ExtraBold-Italic.ttf') format('truetype');
	font-weight: 800;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Italic';
	src: url('/shared/fonts/Aptos/Aptos-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Italic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Light';
	src: url('/shared/fonts/Aptos/Aptos-Light.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Light.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Light Italic';
	src: url('/shared/fonts/Aptos/Aptos-Light-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Light-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Light-Italic.ttf') format('truetype');
	font-weight: 300;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Mono';
	src: url('/shared/fonts/Aptos/Aptos-Mono.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Mono.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Mono.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Mono Bold';
	src: url('/shared/fonts/Aptos/Aptos-Mono-Bold.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Mono-Bold.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Mono-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Mono Bold Italic';
	src: url('/shared/fonts/Aptos/Aptos-Mono-Bold-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Mono-Bold-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Mono-Bold-Italic.ttf') format('truetype');
	font-weight: 700;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Mono Italic';
	src: url('/shared/fonts/Aptos/Aptos-Mono-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Mono-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Mono-Italic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Narrow';
	src: url('/shared/fonts/Aptos/Aptos-Narrow.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Narrow.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Narrow.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Narrow Bold';
	src: url('/shared/fonts/Aptos/Aptos-Narrow-Bold.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Narrow-Bold.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Narrow-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Narrow Bold Italic';
	src: url('/shared/fonts/Aptos/Aptos-Narrow-Bold-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Narrow-Bold-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Narrow-Bold-Italic.ttf') format('truetype');
	font-weight: 700;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Narrow Italic';
	src: url('/shared/fonts/Aptos/Aptos-Narrow-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Narrow-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Narrow-Italic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos SemiBold';
	src: url('/shared/fonts/Aptos/Aptos-SemiBold.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-SemiBold.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-SemiBold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos SemiBold Italic';
	src: url('/shared/fonts/Aptos/Aptos-SemiBold-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-SemiBold-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-SemiBold-Italic.ttf') format('truetype');
	font-weight: 600;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Serif';
	src: url('/shared/fonts/Aptos/Aptos-Serif.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Serif.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Serif.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Serif Bold';
	src: url('/shared/fonts/Aptos/Aptos-Serif-Bold.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Serif-Bold.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Serif-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Serif Bold Italic';
	src: url('/shared/fonts/Aptos/Aptos-Serif-Bold-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Serif-Bold-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Serif-Bold-Italic.ttf') format('truetype');
	font-weight: 700;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Aptos Serif Italic';
	src: url('/shared/fonts/Aptos/Aptos-Serif-Italic.woff2') format('woff2'),
		url('/shared/fonts/Aptos/Aptos-Serif-Italic.woff') format('woff'),
		url('/shared/fonts/Aptos/Aptos-Serif-Italic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}

.buttonX {
	width: 16px;
	height: 16px;
	cursor: pointer;
	-webkit-transition: 0.15s;
	-o-transition: 0.15s;
	transition: 0.15s;
	fill: black;
}
.buttonX:hover {
	fill: red;
	transform: rotate(90deg);
}
.buttonX:active {
	fill: red;
	transform: rotate(110deg);
}

.buttonX_hidden { display: none; }

.inputs{
	/*background-color: white;*/
	/*display: inline-flex;*/
}

.inputs_inlineFlex{ display: inline-flex; }

.inputs input,
.inputs select,
.inputs textarea {
	border: 1px #A9A9A9 solid;
	width: 100%;
	background-color: transparent;
	background-color: white;
}

.inputs input:focus,
.inputs select:focus,
.inputs textarea:focus {
	outline: 1px #aaa auto;
}


.inputs_autoValid{} /* если данный модификатор присутствует, то при наличии значения у компонента его фон будет изменяться на зеленый (автоматически применяться модификатор *_valid) */
.inputs_valid input,
.inputs_valid select,
.inputs_valid textarea{
	background-color: #c4ffcd;
}

.inputs_invalid input,
.inputs_invalid select,
.inputs_invalid textarea{
	background-color: #ffd4d4;
}

/*
Модификаторы:
	inputX_hidden			- понятно :);
	inputX_error			- подсвечивает фон input красным(розовым)
	inputX_filtered		- подсвечивает фон input салатовым
	inputX_disabled		- ставит атрибут disabled на input
	inputX_process		- анимация процесса (движется border у input)
	inputX_cleanValueOnEsc - делает возможность очистки input по Escape
	inputX_trim - val будет отдавать значение с обрезанными начальными и конечными пробелами
*/


.inputX{
	font-style: normal;
	position: relative;
	align-items: center;
}
.inputX.inputX_hasValue:hover .inputX--buttonX{ display: block; }

.inputX__input{
	padding-right: 20px;
}

.inputX__input_italic{ font-style: italic; }


.inputX__input::placeholder{ opacity:0.5; }
.inputX__input::-moz-placeholder{ opacity:1; color:#aaa; }
.inputX__input:-moz-placeholder{ opacity:0.5; }
.inputX__input::-ms-input-placeholder{ opacity:0.5; }
.inputX__input:-ms-input-placeholder{ opacity:0.5; }
.inputX__input::-webkit-input-placeholder{ opacity:0.5; }


/* Присутствие данного модификатора очищает значение поля input при нажатии Escape*/
.inputX_cleanValueOnEsc{}


.inputX_Filled {
	background-color: var(--admaxSelectedItemBG);
	/*background-color: #e9ffec;*/
}


/* Выравнивание */
.inputX_r .inputX__input{ text-align: right; }
.inputX_c .inputX__input{ text-align: center; }

/* делать placeholder курсивом. Если модификатор присутствует, то js меняет вид плейсхолдера */
.inputX_placeholderItalic {}
.inputX_placeholderItalic .inputX__input::placeholder{ font-style: italic; }


.inputX_disabled{}
.inputX_disabled .buttonX, .inputX_disabled .inputX__input{
	pointer-events: none;
	opacity: 0.5;
}

@keyframes ants { to { background-position: 100% 100% } } /*бегущие муравьи*/
.inputX_process .inputX__input{
	border: 1px solid transparent;
	animation: ants 12s linear infinite;
	background: linear-gradient(white, white) padding-box, repeating-linear-gradient(-45deg, black 0, black 25%, transparent 0, transparent 50%) 0 / .6em .6em;
}

.inputX .buttonX{
	position: absolute;
	right: 7px;
	top: calc(50% - 5px);
}

.inputX_disabled.inputX_process{
	position: relative;
}
.inputX_disabled.inputX_process:after{
	content: ' ';
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	background-color: #60602021;
}


.inputX_hidden{ display: none; }
.inputX_error .inputX__input{ background-color: #ffd4d4; }

.inputX_padding10_16 .inputX__input{ padding: 10px 16px; padding-right: 20px; }
.inputX_padding8 .inputX__input{ padding: 8px; padding-right: 20px; }
.inputX_padding6 .inputX__input{ padding: 6px; padding-right: 20px; }
.inputX_padding5 .inputX__input{ padding: 5px; padding-right: 20px; }
.inputX_padding4 .inputX__input{ padding: 4px; padding-right: 20px; }
.inputX_padding3 .inputX__input{ padding: 3px; padding-right: 20px; }
.inputX_padding2 .inputX__input{ padding: 2px; padding-right: 20px; }
.inputX_padding1 .inputX__input{ padding: 1px; padding-right: 20px; }

.inputX_radius2 .inputX__input{ border-radius: 2px; }
.inputX_radius3 .inputX__input{ border-radius: 3px; }
.inputX_radius4 .inputX__input{ border-radius: 4px; }
.inputX_radius5 .inputX__input{ border-radius: 5px; }
.inputX_radius6 .inputX__input{ border-radius: 6px; }


.inputX_required {  }
.inputX_required:before {
	content: "";
	position: absolute;
	z-index: 1;
	width: 100%;
	height: 1px;
	left: 0px;
	bottom: 0px;
	box-sizing: border-box;
	border-bottom: 3px #f007 solid;
}

.inputX_required2:before{
	content: '';
	position: absolute;
	left: 0px;
	top: 0px;
	width: 13px;
	height: 100%;
	background: linear-gradient(90deg, #ff00005c 0%, #f000 100%);
}
.inputX_required3:before{
	content: '•';
	font-family: arial;
	font-size: 20px;
	line-height: 0px;
	color: red;
	position: relative;
	width: 0px;
	left: 3px;
}

/*
	_filterActive можно использовать например, если поле является поисковым фильтром и если данные по фильтру найдены, то примять этот модификатор
*/
.inputX_filtered .inputX__input{ background-color: #c4ffcd; }

.inputX_required.inputs_valid:before {
	border-bottom-color: #00d11c;
}
.inputX_notSelectOnFocus{} /* Если модификатор установлен блоку, то при получении фокуса в input не будет выделяться весь текст (по умолчанию модификатор отсутствует и текст выделяется) */
.whereBuy{
	margin-bottom: 60px;
}
.whereBuy__h1{ margin: 30px 0 20px; }
.whereBuy__h2{ margin: 30px 0 20px; }
.whereBuy_table{
	width: 100%;
}

.whereBuy__scammersWidget{ margin-bottom: 24px; margin-top: 16px; }

.whereBuy__tr:nth-child(odd){ background-color: #eff6fb; }
.whereBuy__tr:hover{ background-color: #fff9c4; }
.whereBuy__td{ padding: 10px 8px; }
.whereBuy_tdIcons{ width: 68px; }
.whereBuy__iconsWrap{
	display: flex;
	justify-content: space-between;
}
.whereBuy_tdTel{ text-align: right; }
.whereBuy__icon{ opacity: 0.75; }

.whereBuy__selectCountry{
	margin-bottom: 18px;
}

.whereBuy__selectCountrySep{
	margin: 0 10px;
}

.whereBuy__selectCountryRus{
	width: 51px;
	display: inline-block;
}

.whereBuy__selectCountryBel{ }

.whereBuy__selectCountryFlg{
	margin-bottom: 4px;
	margin-right: 2px;
	outline: 1px solid #e1e1e1;
	outline-offset: -1px;
}

.whereBuy_selectCountryActive{
	color: #B21C2E;
	font-weight: bold;
	cursor: default;
}

.whereBuy_selectCountryInactive{
	cursor: pointer;
}

.whereBuy__selectCity{
	margin-left: -10px;
	z-index: 501;
	top: 150px;
	background-color: #fff;
	padding: 13px 0 6px;
	margin-top: -20px;
	margin-bottom: 2px;
	position: sticky;
	top: 2px;
}

.whereBuy__cityList{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-left: 10px;
	margin-right: -2px;
}

.whereBuy__cityListItem{
	display: inline-block;
	float: left;
	font-size: 12px;
	font-family: var(--ffRegular);
	text-transform: uppercase;
	background: #000;
	color: #fff;
	padding: 4px 12px;
	margin-right: 1px;
	border: 2px #fff solid;
	cursor: pointer;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	-ms-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
	border-radius: 4px;
}

.whereBuy__cityListShowAll{
	font-weight: bold;
	text-decoration: underline;
	padding-top: 10px;
	cursor: pointer;
	text-align: right;
	transition: all 0.5s ease-in;
	opacity: 0;
	filter: alpha(opacity=0);
}

.whereBuy__cityListShowAll_show {
	opacity: 1.0;
}

.whereBuy__tdFirstLetter {
	background-color: #fff;
	color: #B21C2E;
	font-size: 28px;
	font-weight: bold;
	font-family: 'Open Sans', arial;
	text-transform: uppercase;
}

.whereBuy_letterDisabled {
	background: #D6D6D6;
	cursor: default;
	border: 2px #fff solid;
}

.whereBuy_letterSelected {
	border: 2px #B21C2E solid;
	color: #B21C2E;
	background: #fff;
}

.whereBuy_732 __tBody {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.whereBuy_732 __tr {
	display: flex;
	flex-direction: column;
	align-items: center;
	border: 2px gray solid;
	box-sizing: border-box;
	margin-top: -2px;
	text-align: center;
	max-width: 310px;
	width: 50%;
	margin-left: -2px;
}
.whereBuy_732 __td { padding: 4px 8px; }
.whereBuy_732 __tdName { font-family: var(--ffBold); }
.whereBuy_732 __tr:nth-child(odd) { background-color: unset; }

.whereBuy_450 __tr {
	max-width: none;
	width: 100%;
	margin-left: 0px;
}
.whereBuy_450 __tr:nth-child(odd){ background-color: #eff6fb; }
.whereBuy_1080 __cityListItem { padding: 4px 8px; }
.whereBuy_859 __cityListItem { padding: 3px 6px; }
.whereBuy_754 __cityListItem { padding: 6px 12px; margin-bottom: 10px; }
.whereBuy_754 __cityList { justify-content: center; }

.whereBuy__containerBecomeDealer{
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}

.whereBuy__becomeDealerRequest{
	font-size: 25px;
	font-weight: bold;
}
.presentAPP{
	min-width: 80px;
	/* width: 25%; */
	width: 13%;
	margin: 15px;
}
.presentAPP__subRow{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	text-transform: uppercase;
	margin-top: 36px;
	font-size: 1em;
	line-height: 1.6em;
}
.presentAPP__left{}
.presentAPP__pril{
	/*font-size: 18px;*/
	font-size: 1.285em;
	font-family: var(--ffLight);
	color: #999999;
}
.presentAPP__name{
	/*font-size: 24px;*/
	font-size: 1.71429em;
	font-family: var(--ffExtrabold);
}
.presentAPP__right{
	display: flex;
	align-items: center;
	text-decoration: none;
	transition: 0.2s;
}
.presentAPP__right:hover{ text-decoration: none; transform: scale(1.1); }
.presentAPP__nastr{
	/*font-size: 16px;*/
	font-size: 1.143em;
	font-family: var(--ffBold);
	color: black;
}
.presentAPP__arrow{
	width: 16px;
	margin-left: 12px;
	filter: hue-rotate(51deg) brightness(1.7);
}

.presentAPP_medium .presentAPP__subRow{ font-size: 0.85em; margin-top: 26px; }
.presentAPP_small .presentAPP__subRow{ font-size: 0.7em; }
.presentAPP_small .presentAPP__arrow{ width: 14px; }
.presentAPP_smallest .presentAPP__subRow{ font-size: 0.6em; margin-top: 20px; }
.presentAPP_tiny .presentAPP__subRow{
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	margin-top: 12px;
	text-align: center;
	flex-direction: column;
	line-height: 2.2em;
}
.presentAPP_tiny .presentAPP__arrow{ width: 12px; margin-left: 6px; }

.iconAPP{
	max-width: 343px;
	width: 100%; /* размер можно устанавливать параметром $this->v->iconAPP__width*/
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.iconAPP:before{ /* для высоты, чтобы был квадратный */
	content: "";
	padding-top: 100%;
	float: left;
}

/*
@media screen and (max-width: px){
	.iconAPP {
		width: calc(var(--container_width) * 0.25);
		height: calc(var(--container_width) * 0.25);
	}
}
*/

.iconAPP:hover .iconAPP__img{ margin: 10%; }

.iconAPP__img{
	margin: 12.5%;
	transition: 0.2s;
}

.iconAPP_shadowed{
	border: 1px #ebebeb solid;
	border-radius: 19%;
	background-color: white;
	/* Было в оригинале: 	box-shadow: 0px 8px 35px 0px rgba(0, 0, 0, 0.17); */

	/* Масштабируемая тень, по материалам https://vc.ru/dev/178033-dinamicheskoe-masshtabirovanie-elementov-v-css */
	box-shadow: 0px 8px calc(8px + (38 - 8) * ((100vw - 500px) / (1920 - 500))) 0px rgb(0 0 0 / 17%);
}

.iconAPP_eHealth{
	background: #237df8;
	background: -moz-linear-gradient(-45deg,  #237df8 0%, #237df8 20%, #1a2ff1 52%, #1a2ff1 100%);
	background: -webkit-linear-gradient(-45deg,  #237df8 0%,#237df8 20%,#1a2ff1 52%,#1a2ff1 100%);
	background: linear-gradient(135deg,  #237df8 0%,#237df8 20%,#1a2ff1 52%,#1a2ff1 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#237df8', endColorstr='#1a2ff1',GradientType=1 );
}

.iconAPP_FITShow{
	/* background: linear-gradient(135deg, #fdfdfd 0%,#eaeaea 20%,#eaeaea 52%,#ccc 100%); */
	/* background: linear-gradient(135deg, #d1d1d1 0%,#c9c9c9 20%,#919191 52%,#5f5c5c 100%); */
	background: linear-gradient(135deg, #ededed 0%,#d9dde3 20%,#a0a4ab 52%,#848d97 100%);
}

.wareRowAPP{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	align-items: center;
	font-size: 1em;
}
.wareRowAPP__iconsApps{
	display: flex;
}
.wareRowAPP__appIconContainer{
	/*width: 69px;*/
	width: 5em;
}
.wareRowAPP__appIconContainer:not(:last-child){
	margin-right: 19px;
}
.wareRowAPP__nameComplex{
	text-transform: uppercase;
	flex: 0 0 30%;
}
.wareRowAPP__type{
	font-family: var(--ffLight);
	color: #999999;
	font-size: 1.285715em; /* 18px */
}
.wareRowAPP__bsm{
	font-size: 1.714285em; /* 24px */
	color: black!important;
	text-decoration: none;
}
.wareRowAPP__bsm:hover{ text-decoration: none; }
.wareRowAPP__serie{ font-family: var(--ffExtrabold); }
.wareRowAPP__model{ font-family: var(--ffExtrabold); }
.wareRowAPP__bluetooth{
	/*max-width: 372px;*/
	width: 35%;
	display: flex;
}
.wareRowAPP__bluetoothText{
	font-family: var(--ffLight);
	font-size: 1.285715em; /*18px*/
}
.wareRowAPP__bluetoothType{
	font-family: var(--ffBold);
}
.wareRowAPP__bluetoothIcon{
	height: 3.195em; /*41px*/
	margin-right: 1.5em; /*~32px;*/
}
.wareRowAPP_medium.wareRowAPP { font-size: 0.9em; }
.wareRowAPP_medium .wareRowAPP__bluetooth {
	margin-right: 16px;
	margin-left: 16px;
}
.wareRowAPP_small.wareRowAPP { font-size: 0.8em; }
.wareRowAPP_smallest.wareRowAPP{
	flex-direction: column;
	justify-content: center;
	margin-bottom: 40px;
	padding-bottom: 40px;
}
.wareRowAPP_smallest.wareRowAPP { font-size: 0.9em; }
.wareRowAPP_smallest .wareRowAPP__nameComplex{ text-align: center; margin-bottom: 24px; }
.wareRowAPP_smallest .wareRowAPP__bluetooth{ text-align: center; margin-bottom: 24px; width: auto; }
.wareRowAPP_smallest .wareRowAPP__bluetoothText{ text-align: left; }
.wareRowAPP_smallest .wareRowAPP_empty{ display: none; }

.selectorsCCAPP{
	display: flex;
	justify-content: space-between;
}
.selectorsCCAPP__one{
	position: relative;
	max-width: 258px;
	width: 19%;
	height: 19%;
	display: flex;
	align-items: flex-end;
	cursor: default;
}
.selectorsCCAPP__one:before{
	content: ""; padding-top: 100%; float: left;
}
.selectorsCCAPP__vCheckedBG{
	width: 25.19379845%;
	position: absolute;
	z-index: 2;
	background-color: white;
	top:43%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: 0.2s;
}
.selectorsCCAPP__one:hover .selectorsCCAPP__vCheckedBG{width: 28%;}
.selectorsCCAPP__vCheckedBG:before{ /* для высоты, чтобы был квадратный */
	content: ""; padding-top: 100%; float: left;
}
.selectorsCCAPP__vChecked{
	width: 65%;
	filter: grayscale(1) brightness(2.6);
}
.selectorsCCAPP__title{
	text-transform: uppercase;
	z-index: 2;
	position: relative;
	color: white;
	font-family: var(--ffExtrabold);
	font-size: 1.2em;
	margin-bottom: 7%;
	margin-left: 7%;
	width: 86%;
	line-height: 1.3em;
}
.selectorsCCAPP__bgImg{
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 3px;
	filter: grayscale(1) brightness(1.2);
}
.selectorsCCAPP_checked .selectorsCCAPP__vChecked{
	filter: hue-rotate(188deg) brightness(1.9) saturate(0.4);
}
.selectorsCCAPP_checked .selectorsCCAPP__bgImg { filter: grayscale(0) brightness(1); }
.selectorsCCAPP_medium .selectorsCCAPP__title { font-size: 1em; }
.selectorsCCAPP_small .selectorsCCAPP__title { font-size: 0.8em; line-height: 1em; }
.selectorsCCAPP_smallest .selectorsCCAPP__title { font-size: 0.7em; font-family: var(--ffRegular); }
.selectorsCCAPP_hidden { display: none; }
.pageAPPs{
	padding-bottom: 80px;
}
.pageAPPs_paddedMedium{
	padding-left: 30px;
	padding-right: 30px;
}
.pageAPPs_paddedSmall{
	padding-left: 15px;
	padding-right: 15px;
}
.pageAPPs__presentAPPs{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	/* gap: 40px 5%; */
	gap: 40px 3%;
}
.pageAPPs__wareRowAPP:not(:last-child){
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px #e4e4e4 solid;
}
/* @media screen and (max-width: 1400px) { .pageAPPs__presentAPPs{ justify-content: space-around; } } */
.pageAPPs_smallest .h2 {
	background-color: #f9f1d6;
	padding: 14px 0;
}
.menuMobile {
	position: fixed;
	background-color: white;
	left: 0;
	top: 0;
	height: 0;
	height: 100vh;
	width: 100vw;
	overflow: auto;
	transition: 0.3s;
	opacity: 1;
}
.menuMobile--cont {
	color: white;
	background-color: var(--bgColorFreeCanvas);
	min-height: 100%;
	padding-left: 21px;
	padding-top: 40px;
	transition: 0.5s;
	/* transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); */
	transition-timing-function: cubic-bezier(0, 1.17, 0.28, 1.32);
}
.menuMobile--catLinks {
	display: grid;
	gap: 1em;
	font-size: 1.5em;
	line-height: 1em;
	transition: 0.2s;
	transition-timing-function: cubic-bezier(0.18, 0.05, 0.35, 1.05);
	position: relative;
	left: 0;
}
.menuMobile--link {
	color: white;
	text-decoration: none;
	&:hover {
		/* text-decoration: underline; */
		color: #d2e8fb;
	}
}







.menuMobile_hidden { opacity: 0; }
.menuMobile_hidden .menuMobile--catLinks { left: -100vw;  }
.menuMobile_noscroll { overflow: hidden; }
.prodTopLinks {
	--gap: 39px;
	background-color: #e4e7ed;
	padding: 8px 0px;
	border-radius: 12px;
	box-shadow: 0px 1px 0px 0px #cdcdcd;
	overflow: hidden;
	max-height: 40px;
	position: relative;
	container-name: prodTopLinks;
	/* container-type: inline-size; */
}
.prodTopLinks--wrap {
	margin-inline: 29px;
}
@container prodTopLinks (width < 900px) {
	.prodTopLinks--wrap {
		outline: 2px red solid;
	}
}

.prodTopLinks--links {
	display: flex;
	align-items: center;
	gap: var(--gap);
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none; /* Для Firefox */
	-ms-overflow-style: none; /* Для IE и Edge */
	/* scroll-behavior: smooth; */
}
.prodTopLinks--links::-webkit-scrollbar {
	display: none!important;
}
.prodTopLinks--link {
	font-size: 12.5px;
	color: var(--mainColor);
	font-weight: bold;
	text-decoration: none;
	/* user-select: none; */
	&:hover{
		/* text-decoration: underline; */
		color: black;
	}
}

.prodTopLinks--leftRight {
	line-height: 0;
	display: flex;
	align-items: center;
	height: 40px;
	position: absolute;
	z-index: 10;
	cursor: pointer;
	user-select: none;
	&:hover { background-color: #eff1f4; }
	&:active { background-color: #d1d6e0; }
}
.prodTopLinks--left {
	padding: 0 9px 0 8px;
	border-right: 1px #dbdde2 solid;
	left: 0;
	top: 0;
}
.prodTopLinks--right {
	padding: 0 8px 0 9px;
	border-left: 1px #dbdde2 solid;
	right: 0;
	top: 0;
}

.prodTopLinks--arrowIcon { width: 8px; }
.prodTopLinks--leftIcon { rotate: 180deg; }
.prodTopLinks--rightIcon {  }





.prodTopLinks_hidden { display: none; }
.prodTopLinks_hasScrollLine { /* если у links появляется полоса скроллина, то ему присваивается этот модификатор */
	cursor: grab;
	user-select: none;
}
.prodTopLinks_grabbing { cursor: grabbing; }
.prodTopLinks_scrolled { }
.catLine {
	display: grid;
	grid-template-columns: auto 1fr auto 1fr auto;
	align-items: center;
	gap: 15px;
}
.catLine--searchPanel {
	position: absolute;
	/* background-color: #ffffff8a; */
	background-color: #ffffff47;
	background-color: #becde92e;
	top: 0px;
	left: 0px;
	z-index: 17;
	border-radius: 8px;
	width: 925px;
	/* height: 260px; */
	/* backdrop-filter: blur(11px); */
	backdrop-filter: blur(2px);
	box-shadow: 0px 3px 11px #00000026;
	display: grid;
	gap: 1px;
	align-items: start;
	grid-template-rows: max-content;
	padding-top: 8px;
	padding-bottom: 2em;
	max-height: 400px;
	overflow-y: auto;
}
.catLine--searchItem {
	display: flex;
	gap: 20px;
	align-items: start;
	text-decoration: none;
	color: black;
	padding: 0.5em 15px;
	border-radius: 2px;
	margin-inline: 20px;
	/* background-color: #28282e14; */
	background-color: #ffffffc7;
	box-shadow: 0px 1px 2px #00000024;
	&:hover {
		/* background-color: #28282e1f; */
		/* background-color: #fff5ccc7; */ /* желтый */
		/* background-color: white; */
		/* background-color: #ffffff66; */
		/* background-color: #ffffffb0; */
		background-color: #e7f0ffb3;
		/* outline: 1px gray dotted; */
	}
	&:hover .catLine--searchItemImg { scale: 1.05; }
	&:hover .catLine--searchItemTitle { color: black; }
	&:hover .catLine--searchItemPrice { color: black; }
}
.catLine--searchItemImg { width: 52px; transition: 0.15s; }
.catLine--searchItemRight {
}
.catLine--searchItemTitle {
	color: var(--mainColor);
}
.catLine--searchItemPrice {
	font-family: 'Aptos SemiBold Italic';
	color: var(--mainColor);
}
.catLine--catMenu {
	display: flex;
	align-items: center;
	gap: 6px;
	user-select: none;
	text-transform: uppercase;
	font-family: 'Aptos Bold';
	font-size: 15px;
	color: var(--mainColor);
	line-height: 0;
	cursor: pointer;
	border-radius: 12px;
	padding: 13px;
	background-color: transparent;
	transition: 0.15s all;
	&:hover {
		background-color: #e4e7ed;
		box-shadow: 0px 1px 0px 0px #cdcdcd;
	}
	&:hover * { filter: contrast(10);}
	& * { transition: 0.15s all; }
}
.catLine--catMenuIcon {
	width: 16px;
}
.catLine--searchWrap {
	justify-self: end;
	line-height: 0;
	margin-left: 20px;
}
.catLine--searchIcon {
	width: 19px;
	cursor: pointer;
	transition: all 0.15s;
	&:hover { filter: contrast(10); }
}
.catLine--compareWrap {
	line-height: 0;
}
.catLine--compareIcon {
	width: 25px;
	cursor: pointer;
	transition: 0.15s;
	&:hover { filter: contrast(10); }
}
.catLine--sales {
	text-decoration: none;
	display: flex;
	gap: 6px;
	align-items: center;
	user-select: none;
	font-family: 'Aptos';
	font-size: 12.5px;
	color: #6e7377;
	line-height: 0;
	cursor: pointer;
	border-radius: 12px;
	padding: 8.5px 13px;
	background-color: transparent;
	transition: 0.15s all;
	&:hover {
		background-color: #e4e7ed;
		box-shadow: 0px 1px 0px 0px #cdcdcd;
	}
	&:hover * { filter: contrast(10);}
	& * { transition: 0.15s all; }
}
.catLine--salesIcon {
	width: 22px;
}
.catLine--searchInputLine {
	position: absolute;
	/* z-index: 15; */
	height: 100%;
	width: 100%;
	background-color: white;
	display: flex;
	/* display: none; */
	align-items: center;
	transition: all 0.15s;
	opacity: 0;
}
.catLine--searchInput {
	width: 100%;
	background-color: #28282e;
	color: white;
	border-radius: 8px;
	border: 1px #cdcdcd solid;
	padding: 10px 28px;
	/* padding-left: 40px; */
	outline: none;
	&::placeholder {
		color: #b3b3b3;
		font-style: italic;
		font-family: 'Aptos', Arial, Helvetica, sans-serif;
		font-size: 14px;
	}
}
.catLine_searchMode .catLine--searchInputLine { opacity: 1; z-index: 15; }
.catLine_searchMode .catLine--searchIcon {
	/* position: relative;
	transform: translateX(45px);
	z-index: 20;
	width: 16px; */

	/* filter: sepia(1) saturate(86.5) hue-rotate(17deg) brightness(5); */
	transform: scale(1.35);
}






.catLine_hidden { display: none; }
.catLine_searchMode {  }

.mainBanner {
	--prevNextTop: 0px;
	--maxWidth: 1400px;

	line-height: 0px;
	margin-block: 30px;
	text-align: center;
	position: relative;
	max-width: var(--maxWidth);
	/* display: flex; */
	/* align-items: start; */
	/* justify-content: center; */
	&:hover .mainBanner--bRotate { opacity: 0.4; }
}

.mainBanner--list {
	--left: 0%;
	--animateDuration: 0.3s;
	--height: 371px;

	/* display: flex; */
	border-radius: 5px;
	white-space: nowrap;
	overflow: hidden;
	/* transition: 0.5s all;
	transition-timing-function: cubic-bezier(0.5, 0, 0.58, 0.99); */
	font-size: 1px;
	user-select: none;
}
.mainBanner--item {
	/* display: flex; */
	/* justify-content: center; */
	/* overflow: hidden; */
	display: inline-block;
	transition: 0.3s all;
	transition-duration: var(--animateDuration);
	transition-timing-function: cubic-bezier(0.5, 0, 0.58, 0.99);
	transition-timing-function: cubic-bezier(0, 0.45, 1, 1.01);
	height: var(--height);
	position: relative;
	/* transform: translateX(-99%); */
	left: var(--left);
}
.mainBanner--img {
	object-fit: none;
   object-position: center;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.mainBanner--bRotate {
	position: absolute;
	line-height: 0px;
	top: var(--prevNextTop);
	opacity: 0.2;
	cursor: pointer;
	transition: 0.15s all;
	&:hover{
		opacity: 0.8;
		scale: 1.05;
	}
}
.mainBanner--bPrev {
	left: 3%;
}
.mainBanner--bNext {
	transform: scaleX(-1);
	right: 3%;
}
.mainBanner--bPrevImg { }
.mainBanner--navi {
	--size: 10px;
	--inactive: #e3e0d7;
	--active: #bcaa93;
	display: flex;
	justify-content: center;
	gap: calc(var(--size) / 1);
	position: relative;
	/* bottom: calc(var(--size) * 2); */ /* если нужно снизу, но поверх баннеров */
	bottom: calc(var(--size) * -1.2);
}
.mainBanner--bNav {
	width: var(--size);
	height: var(--size);
	border-radius: 50%;
	cursor: pointer;
	/* background-color: black; */
	/* opacity: 0.3; */
	background-color: var(--inactive);
	&:hover { background-color: var(--active); }
}
.mainBanner--bNav_current { background-color: var(--active); cursor: default; pointer-events: none; }



.mainBanner_hidden { display:none; }

.aboutShort {
	--linkColor: #ffeca0;
	color: white;
	font-size: 22px;
	container-name: aboutShort;
	container-type: inline-size;
}
.aboutShort--wrap {
	display: grid;
	justify-content: center;
	place-items: center;
}
.aboutShort--logo {
	max-width: 296px;
}
.aboutShort--text {
	max-width: 998px;
}
@container aboutShort (width < 950px) {
	.aboutShort--text { text-align: justify; }
}
@container aboutShort (width < 622px) {
	.aboutShort--text { text-align: center; }
}
.aboutShort--more {
	display: inline-flex;
	gap: 12px;
	color: white;
	text-transform: uppercase;
	align-items: center;
	text-decoration: none;
	padding: 15px 36px;
	border-radius: 9px;
	user-select: none;
	&:hover {
		background-color: #ffeca012;
		outline: 1px #ffeca01f solid;
	}
	&:active {
		translate: 1px 1px;
	}
}
.aboutShort--moreImg {
	width: 27px;
}





.aboutShort_link { text-decoration: none; color: var(--linkColor); }


.brandsLogo {
	display: flex;
	align-items: center;
	justify-content: space-around;
	gap: 4%;
	overflow: hidden;
	overflow-x: auto;
	scrollbar-width: none; /* Для Firefox */
	-ms-overflow-style: none; /* Для IE и Edge */
}
.brandsLogo--item {
	height: 100%;
	display: flex;
	align-items: center;
}
.brandsLogo--img {
	max-width: 146px;
	max-height: 114px;
	/* min-width: 90px; */
	min-width: 40px;
	/* width: 100%; */
	width: clamp(40px, 9vw, 146px);
	object-fit: scale-down;
}

@media screen and (max-width: 900px) {
	/* .brandsLogo { justify-content: center; } */
}
@media screen and (max-width: 779px) {
	.brandsLogo { gap: clamp(23px, 30px, 40px); }
}

.twoFutures {
	--linkColor: #ffeca0;
	container: twoFutures / inline-size;
}
.twoFutures--wrap {
	display: flex;
	gap: 40px;
	align-items: start;
}
.twoFutures--item {
	overflow: hidden;
	line-height: 0px;
	position: relative;
	box-shadow: 0px 0px 2px #00000045;
	text-decoration: none;
	&:hover .twoFutures--img { scale: 1.05; }
	&:hover .twoFutures--text { color: var(--linkColor); background-color: #051d398c; }
}
.twoFutures--itemLeft {
	border-top-right-radius: 15px;
	border-bottom-right-radius: 15px;
}
.twoFutures--itemRight {
	border-top-left-radius: 15px;
	border-bottom-left-radius: 15px;
}
.twoFutures--img { width: 100%; transition: 0.5s; }

.twoFutures--text {
	position: absolute;
	left: 0px;
	bottom: 20px;
	width: 100%;
	background-color: #051d3963;
	text-align: center;
	z-index: 5;
	color: white;
	transition: 0.7s;
}
.twoFutures--title {
	--columns: 2;
	text-align: center;
	bottom: 96px;
	font-family: 'Aptos';
	/* font-family: 'Aptos Bold'; */
	text-transform: uppercase;
	font-size: clamp(1em, calc(4vw / var(--columns)), 1.7em);
}
.twoFutures--titleValue { line-height: 1.8em; }
.twoFutures--subTitle {
	font-family: 'Aptos Light';
	/* font-size: 0.75em; */
	font-size: clamp(12px, 0.7em, 16px);
	text-transform: initial;
	top: -6px;
	position: relative;
}


@container twoFutures (width < 671px) {
	.twoFutures--wrap { display: grid; }
	.twoFutures--itemLeft {
		border-top-right-radius: 0px;
		border-bottom-right-radius: 0px;
	}
	.twoFutures--itemRight {
		border-top-left-radius: 0px;
		border-bottom-left-radius: 30px;
		border-bottom-right-radius: 30px;
		box-shadow: 0px 2px 2px #00000096;
	}
	.twoFutures--wrap { gap: 2px; }
	.twoFutures--title { --columns: 1; }
}
.footerSF3 {
	--linkColor: #fbbb13;
}
.footerSF3--content {
}
.footerSF3--left {
	display: grid;
	gap: 34px;
}
.footerSF3--center {
}
.footerSF3--right {
}
.footerSF3--logoImg {
	width: 100%;
	max-width: 225px;
}
.footerSF3--phone {
	display: grid;
	gap: 9px;
}
.footerSF3--phoneTitle {
	font-family: 'Aptos Bold';
	font-size: 0.93em;
	text-transform: uppercase;
	line-height: 1em;
	color: white;
}
.footerSF3--phoneNo {
	font-family: 'Aptos Light';
	font-size: 2em;
	line-height: 1em;
	color: white;
}
.footerSF3--link {
	color: var(--linkColor);
	text-decoration: none;
	font-size: 0.94em;
	&:hover { text-decoration: underline; }
}
* {
	padding: 0px;
	margin: 0px;
	box-sizing: border-box;
}
body {
	padding-top: env(safe-area-inset-top); /* CSS-фикс, чтобы контент не заезжал под статус-бар  */
	background-color: #fff; /* Цвет фона статус-бара */
}
.layout {
	--contentWidth: 1440px;    /* Ширина Центральной колонки контентной */
	/* --scrollbarWidth: calc(100vw - 100%); */
	--scrollbarWidth: 17px; /* ширина скроллбара по умолчанию. Переписывается JS-ом */
	--indentContentSize: 20px; /* размер padding в колонке контента */
	--mainColor: #303031;
	--bgColor: white;
	--bgColorFreeCanvas: #28282e;
	--leftColSize: calc((100vw - var(--contentWidth)) / 2); /* размер левой колонки */
	--realContentIndent: calc((100vw - var(--scrollbarWidth) - var(--contentWidth) + (var(--indentContentSize) * 2)) / 2);

	--h1size: ;

	display: grid;
	grid-template-columns: 1fr auto 1fr;
	font-family: 'Aptos', Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 1.5em;
	background-color: var(--bgColorFreeCanvas);
}


b, strong {
	font-family: 'Aptos Bold';
}
h1 {
	font-size: 1.8em;
	margin: 0.7em 0px;
	line-height: 1.3em;
	font-family: 'Aptos Bold';
}
h2 {
	font-size: 1.6em;
	/* margin: 0.55em 0px 0.4em; */
	margin: 1.1em 0px 0.4em;
	line-height: 1.3em;
	font-family: 'Aptos Bold';
}
h3 {
	font-size: 1.35em;
	/* margin: 0.45em 0px 0.35em; */
	margin: 1.2em 0px 0.5em;
	line-height: 1.3em;
	font-family: 'Aptos Bold';
}
p {
	/* line-height: 1.7em; */
	line-height: 1.5em;
	margin: 1.0em 0;
}
div {
	line-height: 1.5em;
}
ul {
	line-height: 1.5em;
	margin-left: 1em;
}
ol {
	line-height: 1.5em;
	margin-left: 1em;
}
blockquote {
	padding-left: 1em;
	border-left: 4px gray solid;
	font-style: italic;
}



.layout--left {  }
.layout--central {
	max-width: var(--contentWidth);
	width: var(--contentWidth);
	display: grid;
	min-height: 100vh;
	grid-template-rows: auto auto 1fr auto;
}
@media screen and (max-width: 1458px) {
	.layout--central {
		/* width: calc(97vw - 17px); */
		width: calc(100vw - 17px);
	}
}
.layout--right {  }
.layout--body {
	width: 100%;
	padding-inline: var(--indentContentSize);
	padding-bottom: 20px;
}
.layout--foot {
	padding-inline: var(--indentContentSize);
}


.layout--topLine {
	display: grid;
	/* grid-template-columns: 1fr auto 0.8fr; */
	grid-template-columns: auto 1fr auto;
	align-items: center;
	/* margin: 7px 19px; */
	padding: 16px 16px;
	position: sticky;
	top: 0px;
	background-color: var(--bgColorFreeCanvas);
	z-index: 50;
	width: calc(100% + 1px);
}
.layout--bMenu {
	display: none;
	width: 20px;
	filter: brightness(5);
	cursor: pointer;
	user-select: none;
	/* z-index: 200; */
}
.layout--bMenuClose {
	display: none;
	width: 18.5px;
	filter: brightness(5);
	cursor: pointer;
	user-select: none;
	z-index: 200;
	transition: 0.5s all;
	opacity: 0;
}
.layout--bMenuClose_visible { display: initial; }
.layout--iconSearch {
	display: none;
	width: 19px;
	filter: brightness(5);
	cursor: pointer;
	user-select: none;
}
.layout--iconFavorite {
	display: none;
	width: 21px;
	filter: brightness(5);
	cursor: pointer;
	user-select: none;
}
.layout--section {
	background-color: var(--bgColor);
	color: var(--mainColor);
	border-radius: 20px;
	overflow: hidden;
}
.layout--head {
	display: grid; /* нужно для того чтобы контейнер баннера не выперал наружу, а был по ширине контента*/
	padding-inline: var(--indentContentSize);
}
.layout--logoMiniLink { display: none; width: fit-content; }
.layout--logoMini { width: 35px;
}
.layout--logoLink { display: inline-flex; }
.layout--logo {
	max-width: 160px;
	width: 160px;
}
.layout--topLinks {
	--gapV: 8px;
	--gapH: 52px;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--gapV) var(--gapH);
}
.layout--topLinkAddDialer { }
.layout--topLinkDialers { }
.layout--topLinkSrvCenters { }
.layout--topLinkSrv { display: none; }
.layout--topLinkSupply { }
.layout--topLinkAPP { }
.layout--topLinkVideo { }



.layout--topButtons {
	display: flex;
	gap: 19px;
	justify-content: end;
	align-items: center;
}

.layout--topLink {
	color: white;
	text-decoration: none;
	&:hover {
		/* text-decoration: underline; */
		/* color: #fef1cd; */ /* желтый */
		color: #daebf9; /* светло-голубой */
	}
	font-size: 12.5px;
}

.layout--iconCart {
	width: 22px;
	filter: invert();
}

.layout--bSignIn {
	background-color: white;
	border-radius: 10px;
	padding: 3px 20px;
	display: flex;
	gap: 3px;
	user-select: none;
}
.layout--iconUser { width: 13px; }
.layout--bSignInLabel {
	color: var(--mainColor);
	font-size: 0.75em;
}

.layout--catLine {
	margin-top: 20px;
	margin-right: 4px;
}



@media screen and (max-width: 899px) {
	.layout--topLinkAddDialer { display: none; }
	.layout--topLinkSrvCenters { display: none; }
	.layout--topLinkSrv { display: initial; }
	.layout--topLinkSupply { display: none; }
}

/* mobile view */
@media screen and (max-width: 679px) {
	.layout--catLine { display: none; }
	.layout--topLinks{ display: none; }
	.layout--topLine { grid-template-columns: auto auto; margin: 0px; padding: 16px 16px; }
	.layout--bMenu { display: initial; }
	.layout--bSignIn { display: none; }
	.layout--iconSearch { display: initial; }
	.layout--iconFavorite { display: initial; }
	.layout--logo { width: 71%; }
	.layout--head { padding-inline: initial; }
	.layout--mainBanner { margin-top: 0px; }
	.layout--brandsLogo { margin-inline: 1em; }
}
@media screen and (max-width: 399px) {
	.layout--logoMiniLink { display: initial; line-height: 0px; }
	.layout--logoLink { display: none; }
}
.layout--brandsLogo { margin-block: 2em 3em; }
.layout--menuMobile { z-index: 100;  }
.layout--footerSF3 { margin-top: 75px; margin-inline: 32px; }









.layout_hidden { display: none; }
.layout_em { font-family: 'Aptos Italic'; }
.layout_b { font-family: 'Aptos Bold'; }
.layout_bl { font-family: 'Aptos Black'; }
.layout_em_b,
.layout_b_em { font-family: 'Aptos Bold Italic'; }

/* Модификатор, который позволяет элементу в центральной колонке быть растянутым за пределы колонки - шириной на весь экран */
.layout_widthToViewport {
	margin-inline: calc(var(--realContentIndent) * -1);
	position: relative;
}

/* max-width здесь должна быть равна --contentWidth, нужно исправить вручную т.к. css не предусматривает это значение в media-правиле устанавливать через переменную. */
@media screen and (max-width: 1400px) {
	.layout_widthToViewport {
		margin-inline: calc(var(--indentContentSize) * -1);
	}
}

.layout_nonlink {
	pointer-events: none;
	cursor: default;
	text-decoration: none;
	color: inherit;
}

/* модификатор для слияния фона шапки и body */
.layout_solidHeadBody .layout--head {
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
}
.layout_solidHeadBody .layout--body { background-color: white; }

.serviceShort {
	font-size: 20px;
	display: flex;
	justify-content: center;
}
.serviceShort--content {
	max-width: 1050px;
}
.serviceShort--h2 {
	font-family: 'Aptos Bold';
	font-size: 31px;
	text-transform: uppercase;
	text-align: center;
}
.serviceShort--subTitle {
	font-family: 'Aptos SemiBold Italic';
	text-align: center;
}
.videosOnMain {
	container-name: videosOnMain;
	container-type: inline-size;
	color: var(--mainColor);
}
.videosOnMain--h3 {
	font-family: 'Aptos Light';
	font-size: 22px;
	place-self: center;
	margin-bottom: 34px;
}
.videosOnMain--items {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	grid-template-rows: auto auto;
	gap: 40px;
	margin-bottom: 40px;
}
.videosOnMain--item {
	aspect-ratio: 1920 / 1080;
	border-radius: 5px;
	overflow: hidden;
}
.videosOnMain--item:nth-child(1),
.videosOnMain--item:nth-child(2) {
	grid-column: span 3;
}
.videosOnMain--item:nth-child(3),
.videosOnMain--item:nth-child(4),
.videosOnMain--item:nth-child(5) {
	grid-column: span 2;
}


/* КНОПКА */

.videosOnMain--more {
	display: inline-flex;
	gap: 12px;
	font-size: 22px;
	color: var(--mainColor);
	text-transform: uppercase;
	align-items: center;
	text-decoration: none;
	padding: 15px 36px;
	border-radius: 9px;
	place-self: center;
	user-select: none;
	&:hover {
		background-color: #ebeff3;
	}
	&:active {
		translate: 1px 1px;
	}
}
.videosOnMain--moreImg {
	width: 27px;
	filter: brightness(0) contrast(0.7);
}



@container videosOnMain (width < 829px) {
	.videosOnMain--items {
		grid-template-columns: repeat(2, 1fr);
	}
	.videosOnMain--item:nth-child(1),
	.videosOnMain--item:nth-child(2),
	.videosOnMain--item:nth-child(3),
	.videosOnMain--item:nth-child(4) {
		grid-column: initial;
	}
	.videosOnMain--item:nth-child(5) { display: none; }
}

@container videosOnMain (width < 730px) {
	.videosOnMain--items { gap: 20px; }
}

@container videosOnMain (width < 647px) {
	.videosOnMain--items {
		grid-template-columns: 1fr;
		gap: 40px;
	}
}







.videosOnMain_centerIt {
	display: grid;
	place-items:center;
}
.mainPage {
	container-name: mainPage;
	container-type: inline-size;
	margin-inline: calc(var(--indentContentSize) * -1);
}
.mainPage--aboutShort {
	margin-top: 67px;
}
.mainPage--section {
	margin-top: 52px;
	overflow: hidden;
}
.mainPage--twoFutures {
	padding-block: 53px;
}
.mainPage--serviceShort { }
.mainPage--videosOnMain {
	margin-block: 70px 50px;
	/* padding-inline: 37px; */
	padding-inline: 2vw;
}


@container mainPage (width < 671px) {
	.mainPage--twoFutures {
		padding-top: 0px;
	}
}

@container mainPage (width < 1070px) {
	.mainPage--serviceShort {
		margin-inline: 20px;
	}
}
.futuresPage {
	container: futuresPage / inline-size;
}
.futuresPage--h1 {}
.futuresPage--h3 { margin-block: 0 25px; }
.futuresPage--section {
	padding: 30px 50px;
	background-color: #28282e;
	display: flex;
	justify-content: center;
	color: white;
	border-radius: 10px;
}
.futuresPage--sectionContent {
}
.futuresPage--sectionText {
	columns: 2;
	gap: 80px;
}
.futuresPage--sectionText p:first-child { margin-top: 0; }


@container futuresPage (width < 809px) {
	.futuresPage--sectionText { columns: 1; }
	.futuresPage--section{ padding: 30px clamp(20px, 5%, 50px); }
}








.futuresPage_some {
	color: #badfff;
	font-style: italic;
}
.about{}
.about__h1 { margin: 20px 0; }
.about_j { text-align: justify; }
.pageCatSF3 {

}
.pageCatSF3--h1 {
	text-align: center;
	font-family: 'Aptos Light';
	font-size: 22px;
	text-transform: uppercase;
	margin-bottom: 40px;
}
.pageCatSF3--items {
	display: flex;
	align-items: start;
	flex-wrap: wrap;
	gap: 67px 45px;
	justify-content: center;
}

.catTile {
	--width: 203px;
	--height: 237px;
	--bgColor: #f0f0f1;
	display: inline-block;
	text-align: center;
	max-width: var(--width);
	&:hover .catTile--title { color: black; }
	&:hover .catTile--overlay { opacity: 0.4; }
	&:hover .catTile--img { scale: 1.03; }
}
.catTile--link {
	text-decoration: none;
}
.catTile--bgBox {
	width: var(--width);
	height: var(--height);
	background-color: var(--bgColor);
	border-radius: 10px;
	position: relative;
	/* box-shadow: inset 0 0 63px rgb(0 0 0 / 9%); */
	box-shadow: inset 0 0 63px rgb(0 0 0 / 9%), 0 1px 1px #0000002b;
}
.catTile--imgWrap {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
}
.catTile--img {
	max-width: 70%;
	max-height: 70%;
	width: 700%;
	object-fit: contain;
	transition: 0.2s all;
}
.catTile--title {
	/* color: #28282e; */
	color: #46464f;
	font-size: 16px;
	text-transform: uppercase;
	font-family: 'Aptos Semibold';
	margin-top: 12px;
	transition: 0.2s all;
}
.catTile--overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(113, 112, 112, 0.76);
	mix-blend-mode: lighten;
	transition: 0.4s all;
}
