/* Картка товару (кадри 02/06 каталогу; розмір фото задає контейнер через --vv-card-h). */
.vv-card { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.vv-card__media { display: block; height: var(--vv-card-h, 216px); background: var(--vv-sand); overflow: hidden; }
.vv-card--care .vv-card__media { background: var(--vv-white); }
.vv-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--vv-ease); }
.vv-card:hover .vv-card__media img { transform: scale(1.03); }
.vv-card__meta { display: flex; flex-direction: column; gap: 2px; margin-top: 4px; min-width: 0; }
.vv-card__name { font: 500 15px/22px var(--vv-font); color: var(--vv-black); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vv-card__name a { display: block; color: inherit; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vv-card__caption { font: 400 12px/20px var(--vv-font); color: var(--vv-stone); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vv-card__shades { display: flex; gap: 6px; }
.vv-card__shade { flex: none; width: 12px; height: 12px; border-radius: 50%; }
.vv-card__shade.is-on { box-shadow: 0 0 0 1px var(--vv-white), 0 0 0 2px var(--vv-wine); }
.vv-card__price { font: 600 15px/22px var(--vv-font); color: var(--vv-black); }
.vv-card.is-out .vv-card__media img { opacity: .6; }

@media (min-width: 1024px) {
	.vv-card { gap: 16px; }
	.vv-card__meta { gap: 8px; margin-top: 0; }
	.vv-card__name { font-size: 19px; line-height: 26px; }
	.vv-card__caption { font-size: 14px; line-height: 24px; }
	.vv-card__shades { gap: 8px; }
	.vv-card__shade { width: 16px; height: 16px; }
	.vv-card__price { font-size: 19px; line-height: 26px; }
}

/* «Бестселери» (порожній кошик, 404): телефон — 2 колонки на тлі слонової кістки, ПК — 4 компактні картки. */
.vv-best { background: var(--vv-ivory); }
.vv-best__in { display: flex; flex-direction: column; gap: 24px; padding-top: 40px; padding-bottom: 48px; }
.vv-best__grid { --vv-card-h: 216px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 15px; }
.vv-grid--compact .vv-card__shades { display: none; }
.vv-best .vv-sec-title { font: 700 24px/28px var(--vv-font); text-transform: uppercase; }
@media (min-width: 1024px) {
	.vv-best { background: var(--vv-white); border-bottom: 1px solid var(--vv-line-soft); }
	.vv-best__in { gap: 40px; padding-top: 80px; padding-bottom: 96px; }
	/* 1024: стрічка карток по 288 px, що виходить за край; ≥1280 — чотири колонки */
	.vv-best__grid { --vv-card-h: 360px; display: flex; gap: 24px; margin-right: calc(var(--vv-gutter) * -1); overflow: hidden; }
	.vv-best__grid > .vv-card { flex: none; width: 288px; }
	.vv-grid--compact .vv-card__caption { display: none; }
	.vv-grid--compact .vv-card__meta { gap: 0; }
	.vv-best .vv-sec-title { font-size: 34px; line-height: 40px; letter-spacing: .01em; }
}
@media (min-width: 1280px) {
	.vv-best__grid { --vv-card-h: 400px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-right: 0; overflow: visible; }
	.vv-best__grid > .vv-card { width: auto; }
}