/* ==========================================================================
   Editorial WooCommerce catalog
   ========================================================================== */

body.post-type-archive-product {
	background: var(--lv-surface-page);
}

.lv-catalog {
	background: var(--lv-surface-page);
}

.lv-catalog-hero {
	position: relative;
	min-height: 22rem;
	overflow: hidden;
	border-bottom: 1px solid rgb(31 44 40 / 13%);
	background: var(--lv-surface-tint);
}

.lv-catalog-hero::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, #f3efe8 0%, rgb(243 239 232 / 94%) 35%, rgb(243 239 232 / 48%) 60%, rgb(243 239 232 / 5%) 100%);
	content: "";
}

.lv-catalog-hero__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 64% 62%;
}

.lv-catalog-hero__inner {
	position: relative;
	z-index: 1;
	display: grid;
	min-height: 22rem;
	align-content: center;
}

.lv-catalog-breadcrumb {
	position: absolute;
	top: 1.6rem;
	left: 0;
	display: flex;
	align-items: center;
	gap: 0.65rem;
	color: #5c645f;
	font-size: 0.78rem;
}

.lv-catalog-breadcrumb a {
	color: inherit;
	text-decoration: none;
}

.lv-catalog-hero__copy {
	width: min(100%, 35rem);
	padding-block: 4.8rem 2.5rem;
}

.lv-catalog-hero__copy .lv-eyebrow {
	margin-bottom: 0.65rem;
	color: #6f774b;
}

.lv-catalog-hero__copy h1 {
	margin-bottom: 0.55rem;
	font-family: var(--lv-font-display);
	font-size: clamp(2.75rem, 5vw, 4.4rem);
	line-height: 0.98;
}

.lv-catalog-hero__copy > p:last-child {
	max-width: 34rem;
	margin: 0;
	color: #4b534f;
	font-size: clamp(0.95rem, 1.35vw, 1.08rem);
	line-height: 1.55;
}

.lv-catalog-products {
	padding-block: 1rem clamp(3.5rem, 6vw, 6rem);
}

.lv-catalog-filters {
	display: flex;
	gap: 0.75rem;
	padding-block: 1rem;
	overflow-x: auto;
	border-bottom: 1px solid rgb(31 44 40 / 12%);
	scrollbar-width: thin;
}

.lv-catalog-filters button {
	min-width: 8.8rem;
	min-height: 2.8rem;
	padding: 0.65rem 1.2rem;
	border: 1px solid #cecac0;
	border-radius: 0.25rem;
	background: var(--lv-surface-card);
	color: #34403b;
	font-size: 0.72rem;
	font-weight: 650;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	white-space: nowrap;
	cursor: pointer;
	transition: background var(--lv-transition), color var(--lv-transition), border-color var(--lv-transition);
}

.lv-catalog-filters button:hover,
.lv-catalog-filters button.is-active {
	border-color: #263b34;
	background: var(--lv-surface-dark);
	color: #fff;
}

.lv-catalog-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-block: 1rem;
}

.lv-catalog-count {
	margin: 0;
	color: #69706c;
	font-size: 0.82rem;
}

.lv-catalog-toolbar .woocommerce-ordering {
	margin: 0;
}

.lv-catalog-toolbar .orderby {
	min-width: 13rem;
	min-height: 2.6rem;
	padding: 0.55rem 2.25rem 0.55rem 0.8rem;
	border: 1px solid #d0ccc2;
	border-radius: 0.25rem;
	background-color: var(--lv-surface-card);
	color: #3e4742;
	font-size: 0.78rem;
}

.lv-catalog-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(0.8rem, 1.6vw, 1.25rem);
}

.lv-catalog-card {
	display: flex;
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden;
	border: 0;
	border-radius: 0.6rem;
	background: linear-gradient(
		180deg,
		#ebe8e0 0%,
		#f8f5ef 56%,
		rgb(246 243 237 / 0%) 100%
	);
	box-shadow: none;
	flex-direction: column;
	transition: transform 220ms var(--lv-ease), box-shadow 220ms var(--lv-ease);
}

.lv-catalog-card:hover {
	box-shadow: none;
	transform: translateY(-3px);
}

.lv-catalog-card[hidden] {
	display: none;
}

.lv-catalog-card__media {
	position: relative;
	display: grid;
	aspect-ratio: 1 / 0.92;
	place-items: center;
	overflow: hidden;
	background: var(--lv-surface-tint);
	text-decoration: none;
}

.lv-catalog-card__media::after {
	position: absolute;
	right: 16%;
	bottom: 9%;
	left: 16%;
	height: 9%;
	border-radius: 50%;
	background: rgb(31 44 40 / 12%);
	filter: blur(14px);
	content: "";
}

.lv-catalog-card__media img {
	position: relative;
	z-index: 1;
	width: 86%;
	height: 88%;
	margin: 0 !important;
	object-fit: contain;
	transform: scale(1.02);
	transition: transform 280ms var(--lv-ease);
}

.lv-catalog-card:hover .lv-catalog-card__media img {
	transform: scale(1.07);
}

.lv-catalog-card__label {
	position: absolute;
	z-index: 2;
	top: 0.85rem;
	left: 0.85rem;
	padding: 0.32rem 0.62rem;
	border-radius: 999px;
	background: var(--lv-surface-page);
	color: #3c4943;
	font-size: 0.62rem;
	font-weight: 700;
	letter-spacing: 0.075em;
	text-transform: uppercase;
}

.lv-catalog-card__body {
	display: flex;
	min-height: 15.75rem;
	align-items: center;
	padding: 1.35rem 1.2rem 1.2rem;
	text-align: center;
	flex-direction: column;
}

.lv-catalog-card h3 {
	margin-bottom: 0.3rem;
	font-family: var(--lv-font-display);
	font-size: clamp(1.3rem, 1.7vw, 1.65rem);
	line-height: 1.04;
}

.lv-catalog-card h3 a {
	text-decoration: none;
}

.lv-catalog-card__subtitle {
	margin-bottom: 0.75rem;
	color: #68706b;
	font-size: 0.78rem;
}

.lv-catalog-card__price {
	margin-bottom: 1rem;
	color: #25332e;
	font-family: var(--lv-font-display);
	font-size: 1.35rem;
	line-height: 1.2;
}

.lv-catalog-card__price del {
	margin-right: 0.25rem;
	color: #777c77;
	font-size: 0.78em;
	opacity: 0.72;
}

.lv-catalog-card__price ins {
	text-decoration: none;
}

.lv-catalog-card__button {
	width: 100%;
	min-height: 2.8rem;
	margin-top: auto;
	font-size: 0.7rem;
}

.lv-catalog-guide {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(22rem, 0.8fr);
	align-items: center;
	gap: clamp(2rem, 5vw, 5rem);
	margin-top: clamp(1.5rem, 3vw, 2.5rem);
	padding: clamp(2rem, 4vw, 3.25rem);
	border: 1px solid #d2cec3;
	border-radius: 0.65rem;
	background:
		linear-gradient(100deg, rgb(237 234 226 / 96%), rgb(222 223 212 / 78%)),
		url("../images/home-hero-still-life-v2.webp") 78% 62% / cover;
}

.lv-catalog-guide h2 {
	max-width: 16ch;
	margin-bottom: 0.55rem;
	font-family: var(--lv-font-display);
	font-size: clamp(2rem, 3.6vw, 3.2rem);
}

.lv-catalog-guide p:last-child {
	max-width: 42rem;
	margin: 0;
	color: #5b635e;
}

.lv-catalog-guide ul {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 0;
	padding: 0;
	border: 1px solid rgb(31 44 40 / 14%);
	border-radius: 0.5rem;
	background: var(--lv-surface-card);
	list-style: none;
}

.lv-catalog-guide li {
	display: grid;
	min-height: 7.5rem;
	place-items: center;
	align-content: center;
	border-right: 1px solid rgb(31 44 40 / 13%);
}

.lv-catalog-guide li:last-child {
	border-right: 0;
}

.lv-catalog-guide strong {
	color: #293a34;
	font-family: var(--lv-font-display);
	font-size: 2.2rem;
	font-weight: 450;
	line-height: 1;
}

.lv-catalog-guide span {
	color: #69716c;
	font-size: 0.72rem;
}

.lv-catalog-trust {
	border-block: 1px solid rgb(31 44 40 / 14%);
	background: var(--lv-surface-tint);
}

.lv-catalog-trust__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lv-catalog-trust__item {
	display: grid;
	grid-template-columns: 2.8rem 1fr;
	min-height: 7.5rem;
	align-items: center;
	gap: 0.9rem;
	padding: 1.25rem;
	border-right: 1px solid rgb(31 44 40 / 13%);
}

.lv-catalog-trust__item:last-child {
	border-right: 0;
}

.lv-catalog-trust svg {
	width: 2.45rem;
	height: 2.45rem;
	color: #536047;
}

.lv-catalog-trust h3 {
	margin: 0 0 0.12rem;
	font-family: var(--lv-font-sans);
	font-size: 0.76rem;
	font-weight: 650;
	letter-spacing: 0.045em;
	text-transform: uppercase;
}

.lv-catalog-trust p {
	margin: 0;
	color: #66706a;
	font-size: 0.72rem;
	line-height: 1.35;
}

@media (max-width: 1050px) {
	.lv-catalog-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.lv-catalog-card__media {
		aspect-ratio: 1 / 0.8;
	}

	.lv-catalog-guide {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 760px) {
	.lv-catalog-hero,
	.lv-catalog-hero__inner {
		min-height: 25rem;
	}

	.lv-catalog-hero::after {
		background: linear-gradient(90deg, #f3efe8 0%, rgb(243 239 232 / 88%) 56%, rgb(243 239 232 / 18%) 100%);
	}

	.lv-catalog-hero__image {
		object-position: 65% center;
	}

	.lv-catalog-hero__copy {
		width: 76%;
		padding-block: 5rem 2rem;
	}

	.lv-catalog-toolbar {
		align-items: stretch;
		flex-direction: column;
	}

	.lv-catalog-toolbar .orderby {
		width: 100%;
	}

	.lv-catalog-trust__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.lv-catalog-trust__item:nth-child(2) {
		border-right: 0;
	}

	.lv-catalog-trust__item:nth-child(-n + 2) {
		border-bottom: 1px solid rgb(31 44 40 / 13%);
	}
}

@media (max-width: 560px) {
	.lv-catalog-hero,
	.lv-catalog-hero__inner {
		min-height: 26rem;
	}

	.lv-catalog-hero::after {
		background:
			linear-gradient(90deg, #f3efe8 0%, rgb(243 239 232 / 91%) 68%, rgb(243 239 232 / 48%) 100%),
			linear-gradient(180deg, transparent 45%, #f3efe8 100%);
	}

	.lv-catalog-hero__image {
		object-position: 58% center;
		opacity: 0.72;
	}

	.lv-catalog-hero__copy {
		width: 100%;
		align-self: end;
		padding-block: 6.2rem 2rem;
	}

	.lv-catalog-hero__copy h1 {
		max-width: 8ch;
		font-size: 3rem;
	}

	.lv-catalog-hero__copy > p:last-child {
		max-width: 22rem;
		font-size: 0.92rem;
	}

	.lv-catalog-filters {
		margin-inline: calc(var(--lv-gutter) * -1);
		padding-inline: var(--lv-gutter);
	}

	.lv-catalog-filters button {
		min-width: auto;
	}

	.lv-catalog-grid {
		grid-template-columns: 1fr;
	}

	.lv-catalog-card__media {
		aspect-ratio: 1 / 0.82;
	}

	.lv-catalog-card__body {
		min-height: 14rem;
	}

	.lv-catalog-guide {
		padding: 1.5rem;
	}

	.lv-catalog-guide ul {
		grid-template-columns: 1fr;
	}

	.lv-catalog-guide li {
		min-height: 5.5rem;
		border-right: 0;
		border-bottom: 1px solid rgb(31 44 40 / 13%);
	}

	.lv-catalog-guide li:last-child {
		border-bottom: 0;
	}

	.lv-catalog-trust__grid {
		grid-template-columns: 1fr;
	}

	.lv-catalog-trust__item,
	.lv-catalog-trust__item:nth-child(2) {
		border-right: 0;
		border-bottom: 1px solid rgb(31 44 40 / 13%);
	}

	.lv-catalog-trust__item:last-child {
		border-bottom: 0;
	}
}