/* 
 *
 * common start 
 *
 */

/* good inside flex/grid */
picture, source { display: contents; }

/* / */


/* new search */
.srch {	position: relative; }
.srch form { display: contents; } 
.srch__inp { 
	width: 100%;
	box-sizing: border-box;
	border: none;
	padding: 10px 55px 10px 20px;
	background: #fff;
	font-size: 14px;
	font-weight: 300;
	letter-spacing: -0.02em;
	border-radius: 4px;
}
/* .srch__inp--mob { display: none; } */
.srch__inp::placeholder { color: #838383; }
.srch__but {
	position: absolute;
	inset: 0 0 0 auto;
	border: none;
	padding: 0 15px;
	background: transparent;
}
.srch__but svg {
	display: block; /* for vert centering */
	fill: none;
	width: 35px;
	height: 21px;
}
@media only screen and (max-width: 767.98px) {
	.srch__inp { 
		/* display: none;  */
		padding-left: 15px;
	}
	/* .srch__inp--mob { display: block; } */
}
/* if yandex inside */
.srch .ya-site-form { background-color: #fff; }
.srch .ya-site-form__form,
.srch .ya-site-form__wrap,
.srch .ya-site-form__search,
.srch .ya-site-form__search-input-layout {
	height: 100%; 
}
.srch #ya-site-form0#ya-site-form0 .ya-site-form__search-input { padding: 0; }
.srch #ya-site-form0#ya-site-form0 .ya-site-form__input-text {
	padding: 10px 55px 10px 20px;
	font-size: 14px!important;
	font-weight: 300!important;
	letter-spacing: -0.02em;	
}
.srch .ya-site-form__submit {
	position: absolute;
	inset: 0 0 0 auto;
	border: none;
	padding: 0 12px;
}
.srch .ya-site-form ~ svg {
	position: absolute;
	inset: 0 15px 0 auto;
	margin-block: auto;
	fill: none;
	width: 35px;
	height: 21px;	
	pointer-events: none;
}
/* / */


/* catalog popup (mobile) */
.cat_pop { display: none; }
@media only screen and (max-width: 767.98px) {	
	.cat_pop { 
		opacity: 0;
		z-index: 1;
		position: absolute;
		/* top: 100%; */
		top: -140px; /* ! */
		left: -200vw;		
		display: block; /* show */
		background-color: #fff;
		transition: opacity 0.2s;		
	}
	.cat_pop.is-active {
		z-index: 10;
		opacity: 1;
		left: -15px;
		right: -15px;
	}
	.cat_pop__hdr {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 5px 5px 5px 20px;
		color: #fff;
		background: #7276c0;
	}	
	.cat_pop__h { 
		font-size: 16px;
		line-height: 1.4;
		font-weight: bold;
		text-transform: uppercase;
	}
	.cat_pop__close {
		width: 40px;
		height: 40px;
		padding: 0;
		border: none;
		color: inherit;	
		background: transparent;
	}
	.cat_pop__close svg {
		display: block;
		margin: auto;
		width: 34px;
		height: 34px;
	}	
	.cat_pop__menu {
		padding: 0;
		margin: 0;
		list-style: none;
	}
	.cat_pop__menu li {
		margin: 0;
		border-bottom: 1px solid #dadada;
		font-size: 18px;
		font-weight: 500;
	}
	.cat_pop__menu a {
		display: block;
		padding: 15px 20px 18px;
		text-decoration: none;
	}
	.cat_pop__in {
		display: grid;
		gap: 30px;
		padding: 30px 20px;		
	}
	.cat_pop__lst {}
	.cat_pop__lst_h {
		margin-bottom: 15px;
		color: #7276C0;
		font-size: 11px;
		font-weight: 700;
		line-height: 1.2;
		letter-spacing: 0.3em;
		text-transform: uppercase;
	}
	.cat_pop__lst_in {
		display: grid; 
		gap: 16px;
	}
	.cat_pop__lst_in a {
		display: block;
		padding: 13px 15px;
		border: 1px solid #7276C0;
		background-color: #f1f2ff;
		font-size: 18px;
		font-weight: 500;
		line-height: 1.2;		
		text-transform: uppercase;
		text-decoration: none;
		border-radius: 4px;
	}
	/* mod with images */
	.cat_pop__lst--i a {
		position: relative;
		padding-right: 110px;
	}
	.cat_pop__lst--i img {
		position: absolute;
		right: 0;
		bottom: 0;
		width: 114px;
		height: auto;
	}
}
/* / */


/* fast search */
.fast_srch { 
	margin-bottom: 30px;
	background-color: #d9d9d9; 
}
.MainView .fast_srch {margin-bottom :0;}
.fast_srch__in {
	display: flex;
	gap: 15px;
	position: relative;
	padding-block: 23px;
}
.fast_srch__grp { display: contents; }
.fast_srch__cat { display: none; }
.fast_srch__srch {
	order: 1;
	flex-grow: 1;
	flex-basis: 0;
	display: flex; /* for height! */
	margin-left: auto;
	padding-left: 5px;
}
.fast_srch__h {
	align-self: center;
	width: min-content;
	font-size: 14px;
	line-height: 1.3;
	font-weight: 300;
	text-align: right;
}
.fast_srch__lst {
	display: flex;
	gap: 15px;
	margin: 0;
	list-style: none;
}
.fast_srch__itm {
	margin: 0;
}
.fast_srch__lnk {
	display: flex;
	align-items: center;
	position: relative;
	min-height: 40px;
	padding: 10px 20px;
	color: #7276C0;
	background-color: #fff;
	font-size: 15px;
	font-weight: bold;
	text-decoration: none;
	border-radius: 4px;
	transition: 
		color 0.2s,
		background 0.2s;	
}
.fast_srch__lnk:hover,
.fast_srch__itm.is-active .fast_srch__lnk {
	color: #fff;
	background-color: #7276C0;
}
.fast_srch__lnk:before {
	opacity: 0;
	content: ""; 
	position: absolute;
	left: 50%;
	top: 100%;
	width: 10px;
	height: 10px;
	background-color: inherit;
	transform: translate(-50%, -50%) rotate(45deg);
	transition: opacity 0.2s;
}
.fast_srch__lnk:hover:before,
.fast_srch__itm.is-active .fast_srch__lnk:before {
	opacity: 1; 
}
.fast_srch__lnk:after {
	content: "";
	display: block;
	width: 6px;
	height: 6px;
	margin-left: 8px;
	border: solid #000;
	border-width: 0 1px 1px 0;
	transform: translateY(-25%) rotate(45deg);
	transition:
	 border 0.2s,
	 transform 0.2s;
}
.fast_srch__lnk:hover:after,
.fast_srch__itm.is-active .fast_srch__lnk:after {
	border-color: #fff;
	transform: translateY(25%) rotate(225deg);
}

.fast_srch__drp {
	z-index: 3;
	position: absolute;
	inset: 100% 0 auto;
}
.fast_srch__drp_hdr { display: none; }
.fast_srch__drp_in {
	opacity: 0;
	/* z-index: 1; */
	position: absolute;
	top: 100%;
	left: -200vw;
	display: flex;
	background-color: #e5e5e5;
	transform: translateY(10px);
	transition: 
		opacity 0.2s,
		transform 0.2s;
}
.fast_srch__drp_in:before {
	content: "";
	position: absolute;
	inset: auto 0 100%;
	height: 5px;
	background-color: #7276C0;
}
.fast_srch__drp_in.is-active {
	opacity: 1;
	left: 0;
	right: 0;
	transform: translateY(0);
}
.fast_srch__drp_col:not(:first-child) {
	border-left: 1px solid #dadada;
}
.fast_srch__sub {
	padding: 27px 35px;
	border-bottom: 1px solid #dadada;
}
.fast_srch__sub_h {
	margin-bottom: 10px;
	color: #7276C0;
	font-size: 12px;
	font-weight: bold;
	white-space: nowrap;
}
.fast_srch__sub_h svg { display: none; }
.fast_srch__sub_lst {
}
.fast_srch__sub_lst ul { 
	display: grid;
	gap: 6px;
	margin: 0;
	color: #434343;
	font-size: 14px;
	font-weight: 500;
	list-style: none;
}
.fast_srch__sub_lst li { 
	margin: 0; 
	/* white-space: nowrap; */
}
.fast_srch__sub_lst a { color: inherit; }
.fast_srch__sub_lst a:hover { color: #000; }


@media only screen and (max-width: 1279.98px) {
	.fast_srch__in {
		justify-content: space-between;	
		flex-wrap: wrap;
	}
	.fast_srch__srch {
		flex-basis: auto;
		padding-left: 0;
		margin-left: 0;
	}
	.fast_srch__h { width: auto; }
	.fast_srch__lst {
		flex-grow: 1;
		justify-content: space-between;	
	}
	.fast_srch__lnk { height: 100%; }
	.fast_srch__drp_in { 
		flex-direction: column;
	}
	.fast_srch__drp_col:not(:first-child) { 
		border-left: none; 
	}	
	.fast_srch__sub_lst ul { 
		display: block;
		columns: 4;		
	}
}

@media only screen and (max-width: 767.98px) {
	.fast_srch {margin-bottom : 0;}
	.fast_srch__in { 
		gap: 11px;
		justify-content: start;
		padding: 10px 5px 20px;
	}
	.fast_srch__grp { 
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px;
		padding-inline: 10px;
		margin-inline: -20px;
		width: calc(100% + 40px); /* ! */
	}
	.fast_srch__cat { 
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 20px;
		height: 40px;
		border: none;
		color: #fff;
		background-color: #7276C0;
		font-size: 16px;
		font-weight: bold;
		text-transform: uppercase;
		border-radius: 4px;
	}
	.fast_srch__cat svg { 
		width: 11px;
		height: 9px;
		stroke: #fff;
		fill: none;
	}
	.fast_srch__h {
		width: 100%;
		font-size: 12px;
		line-height: 1;
		text-align: left;
	}
	.fast_srch__lst {
		flex-wrap: wrap;
		justify-content: start;
		gap: 10px;
	}
	.fast_srch__lnk {
		padding: 8px 12px;
		min-height: 30px;
		font-size: 12px;
		line-height: 1;
	}
	.fast_srch__drp {
		z-index: 10;
		left: -15px;
		right: -15px;
		top: -140px; /* ! */
	}
	.fast_srch__drp_hdr {
		display: none;
		align-items: center;
		justify-content: space-between;
		padding: 5px 5px 5px 20px;
		color: #fff;
		background: #7276c0;
	}
	.fast_srch__drp.is-active .fast_srch__drp_hdr {
		display: flex; 
	}
	.fast_srch__drp_in { 
		top: 0; 
		width: 100%;
		padding-block: 5px 35px;
		background-color: #fff;
		transform: none;
		transition: none;		
	}
	.fast_srch__drp_in.is-active { 
		position: relative; 
	}
	.fast_srch__drp_in:before { display: none; }	
	.fast_srch__drp_h { 
		font-size: 16px;
		line-height: 1.4;
		font-weight: bold;
		text-transform: uppercase;
	}
	.fast_srch__drp_close {
		width: 40px;
		height: 40px;
		padding: 0;
		border: none;
		color: inherit;	
		background: transparent;
	}
	.fast_srch__drp_close svg {
		display: block;
		margin: auto;
		width: 34px;
		height: 34px;
	}
	.fast_srch__sub {
		padding: 16px 20px;
	}
	.fast_srch__sub_h {
		display: flex;
		align-items: center;
		margin-bottom: 0;
		font-size: 18px;
		font-weight: 500;
	}
	.fast_srch__sub_h svg {
		display: block;
		margin-left: auto;
		width: 11px; 
		height: 9px;
		fill: #7276c0;
		stroke: #7276c0;
		transition: transform 0.2s;
	}
	.fast_srch__sub.is-active .fast_srch__sub_h svg {
		stroke: #7276c0;
		fill: #fff;
		transform: rotate(180deg);
	}
	.fast_srch__sub_lst {
		display: none;
	}
	.fast_srch__sub_lst ul {
		display: block;
		/* columns: 3; */
		columns: 2;
		padding-block: 8px 15px;
	}
	.fast_srch__sub_lst--one ul { columns: auto;}
	.fast_srch__sub_lst li {
		padding-top: 6px;
		white-space: normal;
		break-inside: avoid;
		word-wrap: break-word;
	}
}

/* mod for < 5 col */
.fast_srch__drp_col--sm .fast_srch__drp_col { flex-grow: 1;}


/* @media only screen and (min-width: 768px) { */
	/* .small-blocks .fast_srch__drp_col { */
		/* display: flex; */
		/* flex-direction: column; */
		/* flex-wrap: wrap; */
		/* max-height: 580px; */
		/* width: auto; */
		/* max-width: none; */
	/* } */
	
	/* .small-blocks .fast_srch__sub ul { */
		/* display: flex; */
		/* flex-direction: column; */
		/* flex-wrap: wrap; */
		/* max-height: 290px; */
	/* } */
	
	/* .small-blocks .fast_srch__sub ul li { */
		/* width: 100px; */
	/* } */
/* } */
/* / */


/* caro */
.caro {
	position: relative;
}
.caro__in {
	display: flex;
	overflow: hidden;
}
.caro__itm {
	flex-shrink: 0;
	position: relative;
	width: 100%;
}
.caro__itm img {
	position: absolute;
	inset: 0;
	width :100%;
	height: 100%;
	object-fit: cover;
}
.caro__arr {
	opacity: 0.6;
	z-index: 1;
	position: absolute;
	top: 50%;
	width: 50px;
	height: 50px;
	border: none;
	background: #7276c0;
	transform: translateY(-50%);
	transition: opacity 0.2s;
}
.caro__arr:hover { opacity: 1; }
.caro__arr:before { 
	content: "";
	display: block;
	width: 20px;
	height: 20px;
	border: solid #fff;
	border-width: 1px 1px 0 0;
	margin: auto;
}
.caro__prev { right: 100%; }
.caro__prev:before { transform: translateX(25%) rotate(-135deg); }
.caro__next { left: 100%; }
.caro__next:before { transform: translateX(-25%) rotate(45deg); }
.caro__nav {
	position: absolute;
	bottom: 30px;
	left: 50%;
	display: flex;
	gap: 22px;
	margin: 0 auto;
	list-style: none;
	transform: translateX(-50%);
}
.caro__nav li {
	--sz: 12px;
	margin: 0;
	width: var(--sz);
	height: var(--sz);
	background: #3f405c;
	cursor: pointer;
	transition: background 0.2s;
}
.caro__nav .slick-active {
	background: #fff;
}
.caro__nav button {
	display: block;
	width: 100%;
	height: 100%;
	border: none;
	background: transparent;
	font-size: 0;
}
@media only screen and (max-width: 1279.98px) {
	.caro__prev { left: 0; right: auto; }
	.caro__next { right: 0; left: auto; }
}
@media only screen and (max-width: 767.98px) {
	.caro__nav {
		bottom: 9px;
		gap: 7px;
	}
	.caro__nav li {
		--sz: 4px;
	}
}
.caro__in.slick-slider { 
	display: block; 
	overflow: visible;
	margin-bottom: 0;
}
.caro .slick-list,
.caro .slick-track,
.caro .slick-slide,
.caro .slick-slide > div,
.caro .slick-slide .caro__itm {
	height: 100%;
}
/* / */


/* caro_main */
.caro_main {
	margin-bottom: 53px;
	/* background-color: #222; */
}
.caro_main .caro__in {
	/* aspect-ratio: 1230 / 426; */
	aspect-ratio: 1230 / 355;
}
@media only screen and (max-width: 767.98px) {
	.caro_main { margin-bottom: 20px; }
	.caro_main .container { padding: 0; }
	.caro_main .caro__in { aspect-ratio: 360 / 137;	}
}
/* / */


/* popular makers */
.pplr_makers {
	margin-bottom: 80px;
}
.pplr_makers__h {
	margin-bottom: 38px;
	font-size: 32px;
	line-height: 1.4;
	font-weight: 500;
	letter-spacing: -0.04em;
}
.pplr_makers__lst {
	display: grid;
	grid-template-columns: repeat(4, calc(100% * 280 / 1230));
	justify-content: space-between;
}
.pplr_makers__itm {
	--h : 168px;
	--r : 84px;
	/* --r : calc(var(--h) / 2); */
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	height: var(--h);
	color: #fff;
	font-size: 22px;
	line-height: 1.2;
	font-weight: bold;
	text-align: center;
	letter-spacing: -0.02em;
	text-decoration: none;
}
.pplr_makers__itm:before {
	content: "";
	opacity: 0.5;
	position: absolute;
	inset: 0;
	background-color: #313131;
}
.pplr_makers__itm:nth-child(1) { 
	border-bottom-left-radius: var(--r); 
}
.pplr_makers__itm:nth-child(2) { 
	border-top-right-radius: var(--r); 
}
.pplr_makers__itm:nth-child(3) { 
	border-radius: var(--r) var(--r) 0 0; 
}
.pplr_makers__itm:nth-child(4) { 
	border-bottom-right-radius: var(--r); 
}
.pplr_makers__itm img {
	z-index: -1;
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.pplr_makers__itm span { 
	position: relative;
	width: min-content;
}
@media only screen and (max-width: 767.98px) {
	.pplr_makers { margin-bottom: 40px; }
	.pplr_makers__h { display: none; }
	.pplr_makers__lst { 
		margin-inline: -5px;
		grid-template-columns: 1fr; 
		gap: 20px;
	}
	.pplr_makers__itm { --h: 130px; }
}
/* / */

/* front__grid_catalog mod type 1 */
.front__grid_catalog--t1 { grid-template-rows: repeat(3, 80px); }
.front__grid_catalog--t1 .category-promo_small_min {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-block: 0;
}
.front__grid_catalog--t1 .category-promo_small_min .category-promo__title {
	font-size: calc(1rem * 20 / 14);
}
.front__grid_catalog--t1 .category-promo_small_max {
	padding-top: 55px;
}
.front__grid_catalog--t1 .category-promo_small_max .category-promo__title { 
	font-size: calc(1rem * 26 / 14);
}
@media only screen and (min-width: 768px) {
	.front__grid_catalog--t1 .main-catalog-link .catalog-link_vertical { width: 280px; }
}
/* / */