h2{
	font-family:system-ui, sans-serif;	
}	
:root{
	--y-move:0;
	--x-move:0;/* горизонт */
	--scale:2;
	--fbold:'system-ui';
	--fitalic:'system-ui';
	--fwbold:unset;	
	--fstyle:unset;	
}
h1{
	font-family: var(--font-headername), system-ui, sans-serif;	font-weight:var(--font-weight-caption);
	font-size: 1.4em;text-align:center;	padding: 0 1em;margin: 0.5em 0;
}
.wrap_logo{min-height: 84px;text-align: center;}
.logo{margin: 0 auto;height:auto;object-fit: contain;}

.liker{				
	position: absolute; display:inline-block;z-index:5;		
	background-image:url(../img_system/heart_black.svg);background-repeat: no-repeat;background-position:center;background-size: cover;		
	right: 2em; top: 2em; width: 2.5em;height: 2.5em;
	opacity:0.7;		
	input{display:none;}
}
.liker:has(input:checked){background-image:url(../img_system/heart_red.svg);}	

.link-category{position: absolute;font-family: Verdana, system-ui, sans-serif;color: grey; font-size: small;text-transform: lowercase;width: -webkit-fill-available;    padding:0 1em;}

.box_pictures{
	display: flex; flex-direction: column;	gap: 3px; 	align-items: center;
	margin: 2px 2px 40px 2px;
	.main_image{
		min-width: 200px;
		width: 100%;
		img{
			margin-top: 5px; width: 100%; height: auto; max-height: 50vh;	object-fit: cover;	border-radius: 4px;
		}
	}  
	.other_image{
		display: flex; 
		flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: center; align-content: center; gap: 3px;		
		img{
			object-fit: cover;
			transition: all 0.4s;
			position:relative;
			border-radius: 4px;
			width:calc(100% / 3 - 6px);
			height: auto;
            aspect-ratio: 1 / 1;
		}		
		summary{font-size: larger;color: blue;list-style-type: none;margin: 1em;text-align:center;}
	}	
	
}
/* DISCOUN */
.label_discount{	
	display: flex; justify-content: center;  align-items: center; text-align:center; /*transition: all 2s;*/
    height: 100px;  width: 300px; margin-bottom: 0.5em;
	padding: 0 1em; font-size: 22px;background-color: #d13138; border-radius: 10px; border: 4px dotted white; outline: 4px solid #c63c42;
    color: white; font-weight: bold; user-select: none;
    flex-direction: column;	animation: anime-discount 1.1s infinite;
}
@keyframes anime-discount {    
	0%  {border-color:#fff700; box-shadow: inset 0 0 10px 0px #ff8554;}	
	50% {border-color:#ff3838; box-shadow: none;}	
	100%{border-color:#fff700; box-shadow: inset 0 0 10px 0px #ff8554;}    
}

.article_price{
	text-align:center;
	color:var(--cl-price);
	font-size:larger; font-weight: 600;
}

.article_description{
	font-family: var(--font-descript-full), system-ui, sans-serif;
	/*font-size: large;*/
	margin: 0 1em 1em;
	width: fit-content;
	/*color: #333;*/
	text-align: justify;	
    b{font-weight: bold; }
	/*[i]{font-style:italic;}*/
	[red]{color:red}	
	[ident]{text-indent: 2em;}
	[justify]{	text-align:justify;	}
	[left]{text-align:left;}
	[center]{text-align:center;}
	[right]{text-align:right;}
	[nobr]{white-space:nowrap;}
	[small]{font-size:small;}
	[col2]{column-width : 48% ; column-count : 2 ; column-gap : 4%; }
	table{margin:0 auto;width:100%}
	ul{	padding-left: 1.5em; text-align:left;}
	ul[p0]{	padding-left: 0;}/*без отступа*/
	ul[p1]{	padding-left: 1em;}
	ul li{padding-left: 5px;}
	ul[m-n] li{list-style-type: none;}
	ul[m-o] li{list-style-type: circle;}
	ul[m-v] li{list-style-type: '\2705';}/* галочка в зел квадрате */
	ul[m-r] li{list-style-type: square;}
	ul[m-dec] li{list-style-type: decimal;}
	ul[m-vb] li{list-style-type: '\2714';}
	ul[m-vr] li{list-style-type: '\2714';}	ul[m-vr] li::marker{color:red;}
	ul[m-xr] li{list-style-type: '\2717';}	ul[m-xr] li::marker{color:red;}/* крестик красный */
	ul[m-vg] li{list-style-type: '\2714';}	ul[m-vg] li::marker{color:#00ad00;}
	ul[m-vblue] li{list-style-type: '\2714';} ul[m-vblue] li::marker{color:#002eff;}
	a{color:blue;}
}
dl dt{text-align: center;border-top: 1px dotted #777;padding-top: 5px;font-family:var(--fbold); font-weight:bold;}
dl dt h3{font-size:medium;font-family:Tahoma, sans-serif;}
dl dt a{color:#000;}
dl dd{text-align: center;overflow-x: auto;font-style:var(--fstyle); font-family:var(--fitalic);margin-top:0.5em;font-size: 0.9em; }
dl img{float: left; margin: 2px 0.5em 0 0.5em;border-radius:5px;}
dl[rang] dd:nth-child(odd){	
	img{float:right;}
}

.video-box{
	height: 640px;margin: 0 auto;width: -webkit-fill-available;
	iframe {	  
	  width: 100%; height: 100%;
	}
}
.fs_large{font-size:large;}

.wrap_location{
	display: flex;
    flex-direction: row;    
    align-items: center;
    margin-top: 1em;
}
/*
.location::before{
	content: '';
	display: inline-block;
    height: 1.2em;
    width: 1.2em;
	background-image: url('../img_system/location_black.svg');
	background-repeat: no-repeat;
	background-size:cover;
	background-position: center;
    margin-right: 1em;	
}
*/	
.box_location{
	padding: 0.5em; text-align: center; 
	[data-contact]{color: #005777;font-weight:bold;cursor:pointer;}
}	

.transform{transform-origin: center;object-fit:contain;transform: matrix(var(--scale), 0, 0, 2, var(--x-move), var(--y-move)); 	z-index:20;}
#modal_image{
	background: none;	box-shadow:none;padding: 0;	
	figure{
		transition: all .4s; opacity: 0.1; transform: scale(0.1);
	}	
	.vis{opacity: 1; transform: scale(1);}
	img{width: 100%; max-height: 95vh;	object-fit:contain;	transition: all .2s; }	
}
/*#modal_image[open]{	figure{opacity: 1; transform: none;}}*/
#modal_image:not[open]{	figure{opacity: 0.1; transform: scale(0.1);}}

#modal_image::backdrop{
    backdrop-filter: blur(3px);
}
#modal_image:focus-visible{
	outline: none;	
}
/*footer*/
.contacts{
	position: sticky;background-color: #2f2f2f; 
	a{background-color: white;}
}
footer{
	[data-contact="share"]{
		background: linear-gradient(180deg, #434343, transparent);
		width: -webkit-fill-available; padding: 0.5em;
        border: none;color: white;font-size: 16px;text-transform: uppercase;
	}
	[data-contact="share"]::before{
		content:'';
		position:absolute;left:0.5em; width:1em; height:1em;
		display:block;
		background-image:url(../img_system/share_white.svg);background-size: contain;background-repeat: no-repeat;
	}
}
.up{bottom: 0;}	
.capt_footer{
	display:flex;
	margin: 0.5em 0.5em 0 0.5em;font-weight: bold;letter-spacing: 4px;font-size: 16px;color: whitesmoke;text-transform: uppercase;
	cursor:default;
}
/*Animation strelka*/
.arrow{    	
	display: flex;align-items: center;
	span {
		display: block;	width: 10px;height: 10px;		
	}	
}
.a-right{	
	margin-right: 2em;
	span{transform: rotate(-45deg); animation: arrow-right 2s infinite;border-bottom: 1px solid #c3c3c3;border-right: 1px solid #c3c3c3;		}
}	
.a-left{	
	margin-left: 2em;
	span{transform: rotate(45deg);animation: arrow-left 2s infinite;border-bottom: 1px solid #c3c3c3;border-left: 1px solid #c3c3c3;}
}		
.a-right span:nth-child(2){animation-delay: -0.2s;}
.a-right span:nth-child(3){animation-delay: -0.4s;}
.a-left span:nth-child(2){animation-delay: -0.2s;}
.a-left span:nth-child(1){animation-delay: -0.4s;}

@keyframes arrow-right{
    0%{opacity: 0;transform: rotate(-45deg) translate(-20px,-20px);}
    50%{opacity: 1;}
    100%{opacity: 0;transform: rotate(-45deg) translate(20px, 20px);}
}
@keyframes arrow-left{
    0%{opacity: 0;transform: rotate(45deg) translate(20px,-20px);}
    50%{opacity: 1;}
    100%{opacity: 0;transform: rotate(45deg) translate(-20px,20px);}
}


/*если вход с мобильного*/
@media screen and (max-width : 768px) {	
	.box_pictures{		
		gap: 0;
		.other_image{	
			justify-content: center;			
			gap: 2px;
			.w12{width:calc(100% / 2 - 4px);}
			.w13{width:calc(100% / 3 - 6px);}			
		}
		
	}
	.box_map{
	    margin: 0 1em;
	}
	.article_description{		
		letter-spacing: normal;
	}	
}
