/** Architect Catalog — offset frame, diagonal media edge and sliding index rail. */
.ln-products-style--catalog {
	--ln-pc-link-bottom: 124px;
	--ln-pc-price: var(--ln-pc-secondary);
	--ln-pc-button-bg: var(--ln-pc-surface);
	--ln-pc-shadow: 6px 7px 0 color-mix(in srgb, var(--ln-pc-accent) 24%, transparent);
	--ln-pc-shadow-hover: 10px 12px 0 color-mix(in srgb, var(--ln-pc-secondary) 18%, transparent);
}

.ln-products-style--catalog ul.products li.product {
	border: 1px solid color-mix(in srgb, var(--ln-pc-secondary) 25%, transparent);
	border-radius: max(10px, calc(var(--ln-pc-radius) - 5px));
	background: var(--ln-pc-surface);
}

.ln-products-style--catalog ul.products li.product::before {
	position: absolute;
	z-index: 5;
	top: 0;
	right: 0;
	width: 7px;
	height: 38%;
	background: var(--ln-pc-secondary);
	content: "";
	pointer-events: none;
	transition: height var(--ln-pc-motion-duration) var(--ln-pc-motion-ease), background-color var(--ln-pc-motion-duration) ease;
}

.ln-products-style--catalog ul.products li.product::after {
	position: absolute;
	z-index: 4;
	top: 50%;
	right: 0;
	width: 42px;
	height: 3px;
	background: var(--ln-pc-accent);
	content: "";
	pointer-events: none;
	transform: translateX(22px);
	transition: transform var(--ln-pc-motion-duration) var(--ln-pc-motion-ease);
}

.ln-products-style--catalog ul.products li.product:hover::before { height: 64%; background: var(--ln-pc-accent); }
.ln-products-style--catalog ul.products li.product:hover::after { transform: translateX(0); }

.ln-products-style--catalog ul.products li.product a img {
	clip-path: polygon(0 0, 100% 0, 100% 89%, 0 100%);
	background: linear-gradient(145deg, color-mix(in srgb, var(--ln-pc-media) 88%, white), var(--ln-pc-media));
}

.ln-products-style--catalog ul.products li.product:hover a img {
	transform: translateY(var(--ln-pc-image-shift)) scale(var(--ln-pc-image-scale)) rotate(-0.6deg);
}

.ln-products-style--catalog ul.products li.product .onsale {
	top: 12px;
	right: auto;
	left: 12px;
	border-radius: 6px;
}

.ln-products-style--catalog ul.products li.product .ln-product-category {
	margin-top: 8px;
	font-size: 9.5px;
	letter-spacing: 0.06em;
	color: color-mix(in srgb, var(--ln-pc-accent) 58%, var(--ln-pc-secondary));
}

.ln-products-style--catalog ul.products li.product .woocommerce-loop-product__title {
	padding-right: 10px;
	border-right: 2px solid color-mix(in srgb, var(--ln-pc-accent) 44%, transparent);
	font-weight: 820;
}

.ln-products-style--catalog ul.products li.product .price {
	right: 18px;
	bottom: 70px;
	left: 18px;
	justify-content: flex-start;
	padding: 5px 10px;
	border-right: 3px solid var(--ln-pc-accent);
	background: color-mix(in srgb, var(--ln-pc-media) 54%, transparent);
	text-align: right;
}

.ln-products-style--catalog ul.products li.product .ln-loop-cart {
	border-color: var(--ln-pc-secondary);
	border-radius: 7px;
	background: var(--ln-pc-surface);
	color: var(--ln-pc-secondary);
}

.ln-products-style--catalog ul.products li.product .ln-loop-cart:hover,
.ln-products-style--catalog ul.products li.product .ln-loop-cart.added {
	background: var(--ln-pc-secondary);
	color: var(--ln-pc-button-text);
}

@media (max-width: 520px) {
	.ln-products-style--catalog ul.products li.product a.woocommerce-LoopProduct-link { padding-bottom: 100px; }
	.ln-products-style--catalog ul.products li.product .price { right: 10px; bottom: 52px; left: 10px; }
	.ln-products-style--catalog ul.products li.product .ln-loop-cart { right: 9px; bottom: 8px; left: 9px; }
}
