.product.preview {
	border: 1px solid #efefef;
	display: grid;
	text-align: center;
	width: 240px;
	& > a {
		display: grid;
		gap: 0.5em;
		grid-template-columns: 100%;
		padding: 8px;
		& > * {
			& > * {
				padding: 0 8px;
			}
		}
		& .cover {
			border-bottom: 1px solid #efefef;
			display: flex;
			height: 222px;
			width: 222px;
			& img {
				margin: auto;
				max-height: 85%;
				max-width: 85%;
				transition: .4s;
			}
		}
		& div {
			color: #000;
			&.name {
				color: var(--color1);
				font-weight: bold;
			}
		}
	}
	& form.cart {
		border-top: 1px solid #efefef;
		background-color: var(--color2);
		display: grid;
		grid-template-columns: 50% 50%;
		& .price {
			align-items: center;
			display: flex;
			justify-content: center;
			padding: 4px 8px;
		}
	}

	&:hover {
		& .cover>img {
			max-height: 100%;
			max-width: 100%;
		}
	}
}


.productpage {
	display: grid;
	gap: 1em;
	grid-template-columns: auto 1fr;
}
.productpage h2 {
	color: #000;
	text-align: left;
}
.productpage .instock[data-instock="1"]::before {
	color: green;
	content: "В наличии";
}
.productpage .instock[data-instock="0"]::before {
	color: red;
	content: "Нет на складе";
	display: block;
	padding: 0.25em 0;
}
.productpage > * {
	margin: 0;
	padding: 1em;
}
.productpage .info {
	background: linear-gradient(90deg, #e7ecff, #f0f9fe);
	display: grid;
	gap: 0.5em;
	grid-template-rows: auto 1fr auto;
}
.productpage .info * {
	margin: 0;
}
.productpage .info .characteristics {
	border-bottom: 2px solid #d9e0ea;
	border-top: 2px solid #d9e0ea;
	column-count: 2;
	padding: 0.5em;
	text-align: center;
	width: 100%;
}
.productpage .info .cart {
	align-items: center;
	display: grid;
	gap: 1em;
	grid-template-columns: auto auto;
	text-align: center;
}
.productpage .cart .price {
	color: var(--color1);
	font-size: 1.3em;
}
.productpage .cart .price::before {
	content: "Цена:";
	display: block;
}
.productpage .description {
	background: linear-gradient(90deg, #e7ecff, #f0f9fe);
	grid-column: span 2;
}