body {
	display: flex;
	flex-direction: column;
}
.page-header-wrapper,
.breadcrumbs,
.page-footer-wrapper {
	flex-shrink: 0;
}
main {
	flex-grow: 1;
}


/* region images */
.product-images {
	overflow: hidden;
	user-select: none;
}
.product-image {
	display: block;
	width:100%;
	height: auto;
	border-radius: var(--border-radius-s);
}
.product-image-wrapper {
	padding: 0 5px;
}

.product-images-container {
	margin-left: -5px;
	margin-right: -5px;
}

.product-images .tns-liveregion {
	display: none;
}
.product-images .tns-controls-custom {
	position: absolute;
	pointer-events: none;
	inset:0;
	height: auto;
}
.product-images .tns-control-custom {
	position: absolute;
	top:50%;
	margin-top: calc(var(--tns-control-height) / -2);
}

.product-images .tns-control-custom[aria-disabled="true"] {
	display: none;
}
.product-images-arrow_left {
	left:5px;
}
.product-images-arrow_right {
	right:5px;
}

.product-images .tns-controls-custom button:before {
	content: '';
	display: block;
	position: relative;
	width: 90%;
	aspect-ratio: 1 / 1;
	border-radius: var(--border-radius);
}


@media all and (max-width: 499px) {
	.product-images-gallery:not(.tns-slider) .product-image-wrapper:not(:first-child) {
		display: none;
	}
}

@media all and (min-width: 500px) {
	.product-images-gallery:not(.tns-slider) {
		display: flex;
	}
	.product-images-gallery:not(.tns-slider) .product-image-wrapper {
		flex-shrink: 0;
	}
}

@media all and (min-width: 500px) and (max-width: 759px) {
	.product-images-gallery:not(.tns-slider) .product-image-wrapper {
		width: 50%;
	}
	.product-images-gallery:not(.tns-slider) .product-image-wrapper:nth-child(2) ~ .product-image-wrapper {
		display: none;
	}
}

@media all and (min-width: 760px) and (max-width: 1499px) {
	.product-images-gallery:not(.tns-slider) .product-image-wrapper {
		width: 33.3333%;
	}
	.product-images-gallery:not(.tns-slider) .product-image-wrapper:nth-child(3) ~ .product-image-wrapper {
		display: none;
	}
}

@media all and (min-width: 1500px) {
	.product-images-gallery:not(.tns-slider) .product-image-wrapper {
		width: 25%;
	}
	.product-images-gallery:not(.tns-slider) .product-image-wrapper:nth-child(4) ~ .product-image-wrapper {
		display: none;
	}
}
/* endregion */

/* region badges */
.product-badges {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap:0.3em 0.5em;
}
.product-badge {
	border-radius: 0.5em;
	padding: 0.35em 0.71em;
	line-height: 1.1;
	font-weight: 800;
}
.product-badge svg {
	fill: currentColor;
	height: 1.2em;
	position: absolute;
	top:50%;
	margin-top: -0.6em;
	left:0;
}
.product-badge__with-svg {
	padding-left: 1.5em;
}
.product-badge_new {
	background: var(--notice-message-bg);
	color: var(--notice-message-color);
}
.product-badge_discount {
	background: var(--success-message-bg);
	color:var(--success-message-color);
	display: flex;
	gap:0.5em;
	flex-wrap: wrap;
	align-items: baseline;
}
/* endregion */

/* region offer */
.product-offer {
	display: flex;
	gap:1em;
}

.product-price {
	font-size: 1.5714rem;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
}

.product-offer:not(:last-child) {
	margin-bottom: 3em;
}
.product-price {
	background: var(--bg-main-darken5);
	border-radius: var(--border-radius);
	padding: 0.5em 1em;
}
.product-price-note {
	font-style: italic;
	color: var(--text-color3);
}

.product-info-box {
	display: flex;
	align-items: center;
	gap:0.5em;
}
.product-info-box__icon-wrapper {
	width: 1.5em;
	height: 1.2em;
	display: flex;
	align-items: center;
	justify-content: center;
	
}
.product-info-box__icon {
	max-width: 100%;
	max-height: 100%;
	fill: var(--bg-blue-dark);
}
/* endregion */


@media all and (max-width: 619px) {
	.product-info-box {
		width: 100%;
	}
	.product-price,
	.product-offer-btn {
		flex-grow:1;
	}
}

@media all and (min-width: 620px) and (max-width: 1199px) {
	.product-info-box {
		background: var(--bg-main-darken5);
		border-radius: var(--border-radius);
		padding: 0.5em 1em;
	}
}

@media all and (max-width: 1199px) {
	.product-offer {
		margin-top: 2em;
		flex-wrap: wrap;
	}
	.product-price-note {
		width: 100%;
		order:10;
	}
}

@media all and (min-width: 1200px) {
	.product-top {
		display: flex;
		gap: 5%
	}
	
	.product-images {
		flex-grow: 1;
	}
	.product-offer {
		width: min(40%, 350px);
		flex-shrink: 0;
	}
	.product-offer {
		flex-direction: column;
	}
	.product-price {
		flex-grow: 1;
	}
	.product-offer-btn {
		width: 100%;
	}
}


/* region characteristics */
.product-characteristics-wrapper {
	container: product-characteristics / inline-size;
}
.product-characteristics {
	font-size: clamp(1rem, 6cqw, 1.25rem);
	max-width: 100%;
}
.product-characteristics th {
	text-align: left;
	font-weight: 600;
}
.product-characteristics td {
	color:var(--text-color2);
}

@container product-characteristics (width <= 240px) {
	.product-characteristics,
	.product-characteristics tbody,
	.product-characteristics tr,
	.product-characteristics td,
	.product-characteristics th {
		display: block;
		width: 100%;
	}
	.product-characteristics th:after {
		content: ':';
	}
	.product-characteristics tr {
		margin-top: 0.5em;
	}
}

@container product-characteristics (width > 240px) {
	.product-characteristics th,
	.product-characteristics td {
		padding-top: 0.35em;
		padding-bottom: 0.35em;
		vertical-align: bottom;
	}
	.product-characteristics th:after,
	.product-characteristics td:before {
		content: '';
		display: block;
		position: absolute;
		bottom:0.45em;
		right: 0;
		border-bottom: 1px dashed var(--bg-main-darken10);
	}
	.product-characteristics th:after {
		left:2em;
	}
	.product-characteristics td:before {
		left:0;
	}
	.product-characteristics th > span > span,
	.product-characteristics td > span > span {
		background: var(--bg-main);
		z-index: 1;
	}
	.product-characteristics th > span > span {
		padding-right: 0.1em;
	}
	.product-characteristics th {
		padding-right: 1em;
	}
	.product-characteristics td {
		text-align: right;
	}
}

@container product-characteristics (width > 700px) {
	.product-characteristics {
		display: block;
	}
	.product-characteristics tbody {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}
	.product-characteristics tr {
		display: contents;
	}
	.product-characteristics tr:nth-child(odd) td {
		padding-right: 1.15em;
	}
	.product-characteristics tr:nth-child(even) th {
		padding-left: 1.15em;
	}
	.product-characteristics tr:nth-child(even) th:before,
	.product-characteristics tr:nth-child(odd) td:after {
		content: '';
		display: block;
		position: absolute;
		top:0;
		bottom:0;
		width: 1.15em;
		background:var(--bg-main);
		z-index: 1;
	}
	.product-characteristics tr:nth-child(even) th:before {
		left:0;
	}
	.product-characteristics tr:nth-child(odd) td:after {
		right: 0;
	}
	.product-characteristics td,
	.product-characteristics th {
		display: flex;
		align-items: flex-end;
	}
	.product-characteristics td {
		justify-content: flex-end;
	}
}
/* endregion */


.product-about-wrapper {
	container: product-about / inline-size;
}
.product-about {
	font-size: clamp(1rem, 3cqw, 1.14rem);
}


.product-section-title {
	font-size: clamp(1.8rem, 6.5vw, 2.2857rem);
	margin-bottom: 0.8em;
	margin-top: 2.5em;
}


@media all and (max-width: 1199px) {
	.product-about-wrapper,
	.product-characteristics-wrapper {
		width: 100%;
	}
}

@media all and (min-width: 1200px) {
	.product-info {
		display: flex;
		gap:5%;
	}
	
	.product-characteristics-wrapper {
		width: min(50%, 360px);
		flex-shrink: 0;
	}
	.product-about-wrapper {
		flex-grow: 1;
	}
}


/* region type other */
.product-type-other {
	background: var(--bg-blue-dark);
	color:white;
	border-radius: var(--border-radius);
	padding: 47px 51px;
}
.product-type-other__title {
	font-size: clamp(1.28rem, 5.3cqw, 2.28rem);
	font-weight: 600;
	margin-bottom: 0.71875em;
}
.product-type-other__description {
	font-size: clamp(0.85rem, 3cqw, 1.2857rem);
	font-weight: 300;
}

.product-type-other__info {
	container: product-type-other-info / inline-size;
}

.product-type-other__right {
	container: product-type-other-right / inline-size;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.product-type-other__people {
	display: flex;
	gap:min(5cqw, 18px);
	margin-bottom: 17px;
}
.product-type-other__person {
	width: min(16cqw, 70px);
	height: min(16cqw, 70px);
	border-radius: 50%;
	border: 1px solid white;
	background: white 50% 50% / cover no-repeat;
}


@container site-container (width <= 920px) {
	.product-type-other__info,
	.product-type-other__right {
		width: 100%;
	}
	.product-type-other__info {
		margin-bottom: 50px;
		text-align: center;
	}
}

@container site-container (width > 920px) {
	.product-type-other {
		display: flex;
		align-items: center;
		gap:min(10cqw, 150px);
	}
	.product-type-other__info {
		width: 50%;
		flex-shrink: 0;
	}
	.product-type-other__right {
		flex-grow: 1;
	}
}
/* endregion */