.catalog-good-card {
  --global-content-width: 1920px;
  --photo-thumbs-width: 140px;
  --photo-thumbs-height: 170px;
}

.site-main {
	.product {
		display: flex;
		justify-content: space-between;
		margin-top: 160px;
	
		.photo-icons {
			flex-grow: 1;
	
			.photos {
				display: flex;
	
				.main-gallery {
					background-color: white;
					z-index: 2;
					position: relative;
	
					.swiper-wrapper {
						width: var(--photo-thumbs-width);
						height: 565px;
					}
					.photo {
						img {
							border: 1px solid #939393;
							border-radius: 10px;
							max-width: var(--photo-thumbs-width);
							width: 100%;
						}
					}
				}
							.main-photo-wrap {
					width: calc(100% - var(--photo-thumbs-width));
					display: flex;
					justify-content: center;
	
					.main-photo {
						background-color: white;
						z-index: 1;
						position: relative;
						margin: 0 15px;
						max-width: 600px;
						overflow: hidden;
	
						.swiper-wrapper {
							width: 100%;
							max-width: 600px;
						}
					}
				}
			}
			.product-achievements {
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;
				align-items: center;
				margin: 0 30px;
				
				.product-achiev {
					display: flex;
					flex-direction: column;
					position: relative;
					padding: 0 30px;
					max-width: 180px;
					min-width: 150px;
					margin: 15px 0;
	
					.icon {
						margin-bottom: 10px;
	
						img {
							margin: 0 auto;
						}
					}
					.value {
						font: normal normal 400 16px/18px Rubik;
						color: black;
						text-align: center;
						margin: 10px 0;
					}
					.name {
						font: normal normal 400 12px/14px Rubik;
						color: #939393;
						text-align: center;
					}
				}
				.sep {
					display: block;
					height: 80px;
					width: 2px;
					background-color: #CFCFCF;
				}
				.sep:last-child {
					display: none;
				}
			}
		}
		.data {
			max-width: 820px;
			flex-grow: 1;
	
			.data-wrap {
				max-width: 600px;
			}
			h1.product_title {
				font: normal normal 500 48px/48px Rubik;
				text-transform: none;
				margin-bottom: 15px;
			}
			.product_title_bottom {
				font: normal normal 400 25px/25px Rubik;
				margin: 15px 0;
			}
			.description {
				font: normal normal 400 15px/18px Inter;
				margin: 35px 0px;
			}
			.buy-block {
				display: flex;
				align-items: center;
				flex-wrap: wrap;
				margin: 60px 25px;
	
				.price {
					display: inline-block;
					background-color: black;
					border-radius: 10px;
					padding: 0 15px;
					margin-right: 20px;
					text-wrap: nowrap;
	
					span {
						font: normal normal bold 45px/78px Rubik;
						color: white;
					}
					del {
						margin-right: 15px;
						text-decoration: none;
						position: relative;
						opacity: 1;
						padding: 0 15px;
						display: inline-block;
					}
					del:after {
						content: "";
						position: absolute;
						left: 0;
						right: 0;
						top: calc(50% - 2px);
						height: 4px;
						background: red;
					}
				}
				.buy-btn {
					display: flex;
	
					button {
						background: linear-gradient(0deg, #f6eaf7 0%, #e8f8f8 100%);
						border: 0;
						color: black;
						font: normal normal 500 30px/78px Rubik;
						text-wrap: nowrap;
						padding: 0 15px;
						margin: 0;
						text-transform: uppercase;
					}
				}
			}
		}
	}
	.product-info {
		margin-top: 45px;

		.tabs {
			background: linear-gradient(0deg, #f6eaf7 0%, #e8f8f8 100%);
			padding: 15px 30px;
			margin: 0 -25px;
			display: flex;
			justify-content: center;
			gap: 30px;
			flex-wrap: wrap;
      
			
			.tab {
				background: transparent;
				border: 0;
				cursor: pointer;
				text-transform: uppercase;
				font: normal normal 400 20px/20px Rubik;
				color: black;
				text-align: center;
				opacity: 0.65;

				&.is-active {
					opacity: 1;
				}
			}
		}
		.tabs-content {
			margin-top: 50px;

			.tab-panel {
				display: none;

				&.is-active {
					display: block;
				}
			}

			.props {
				.props-grid {
					display: grid;
  				grid-template-columns: repeat(2, 1fr); 
  				gap: 10px 60px;
					
					.prop-item {
						display: flex;
						flex-direction: row;
						justify-content: space-between;
						border-radius: 5px;
						overflow: hidden;
						padding: 9px 15px;

						.prop-name, .prop-value {
							font: normal normal 500 20px/20px Inter;
							color: black;
							text-align: left;
						}
						.prop-value {
							text-align: right;
							margin-left: 5px;
						}
					}
					/* 1-я строка окрашена, 2-я нет, затем повтор */
					.prop-item:nth-child(4n + 1),
					.prop-item:nth-child(4n + 2) {
						background: linear-gradient(0deg, #f6eaf7 0%, #e8f8f8 100%);	
					}
				}
			}

			.tab-panel-placeholder {
				min-height: 80px;
			}
		}
	}
}
@media (max-width: 1279px) {
  .product {
    .photos {
      flex-direction: column-reverse;
      margin-right: 15px;

      .main-gallery {
        width: calc(100% - 4px);

        .swiper-wrapper {
          max-height: calc(var(--photo-thumbs-height) + 2px);
        }
      }

      .main-photo-wrap {
        width: 100%;
        padding-bottom: 15px;
      }
    }
  }
}
@media (max-width: 1023px) {
  .content-area.catalog-good-card {
    margin-top: 15px;
  }
  .product {
    flex-direction: column;
  }
	.site-main .product-info .tabs-content .props .props-grid {
		grid-template-columns: repeat(1, 1fr);

		/* Сбрасываем desktop-полосы с той же специфичностью */
		.prop-item:nth-child(n) {
			background: none;
		}
		/* В 1 колонке: 1 окрашена, 2 нет, и так далее */
		.prop-item:nth-child(2n + 1) {
			background: linear-gradient(0deg, #f6eaf7 0%, #e8f8f8 100%);	
		}
	}
}
@media (max-width: 550px) {
	.site-main .product .photo-icons .product-achievements .sep {
		display: none;
	}
}