/* 25 — Home vibe cards: phone-only taller ratio (Bach 2026-10-05, Ludwig OK 8:54/9:05 PM; Debussy's 3 rules).
   Leo flagged ~198px of dead air under "View all vibes" at 390 (202 @375, 190 @414): Top Sellers/Save Big set the
   delta-0 row height. Taller phone cards (0.9 -> 0.78) let Shop Vibes fill its reserved cell, so there's no jump on tab swaps.
   Rules (Debussy): bg + decal stay object-fit cover, centred (patch 24); product slots keep the same width % and
   their 0.8 shape, positioned from the BOTTOM so the extra height becomes air above the garments (not stretched
   slots); the icon stays square, sized by width (patch 24 vars). Desktop/tablet untouched. */
/* v2 (9:25 PM): one flat 0.78 overgrew Shop Vibes at tablet widths (+164 @600, +291 @767). The ideal fill ratio climbs
   with width (0.775 @375, 0.792 @414, 0.847 @600, 0.876 @767), so step it; each band stays within ~20px of the row height. */
@media (max-width: 767px) {
	.vs-hm .vs-hm__cards--overlay .vs-hm__card-media {
		aspect-ratio: 0.87 / 1;
	}
}
@media (max-width: 660px) {
	.vs-hm .vs-hm__cards--overlay .vs-hm__card-media {
		aspect-ratio: 0.85 / 1;
	}
}
@media (max-width: 560px) {
	.vs-hm .vs-hm__cards--overlay .vs-hm__card-media {
		aspect-ratio: 0.83 / 1;
	}
}
@media (max-width: 470px) {
	.vs-hm .vs-hm__cards--overlay .vs-hm__card-media {
		aspect-ratio: 0.8 / 1;
	}
}
@media (max-width: 400px) {
	.vs-hm .vs-hm__cards--overlay .vs-hm__card-media {
		aspect-ratio: 0.78 / 1;
	}
}

@media (max-width: 767px) {

	/* Slot bottom edge stays where it sits on the 0.9 card (3.6% + 54% = 57.6% from the top, i.e. 42.4% from the bottom). */
	.vs-hm .vs-hm__cards--overlay .vs-hm__layer--product-a,
	.vs-hm .vs-hm__cards--overlay .vs-hm__layer--product-b {
		top: auto;
		bottom: 42.4%;
		height: auto;
		aspect-ratio: 0.8 / 1;
	}
}
