{
const p = $refs.variantsPanel, buy = $refs.purchaseRow, nw = $refs.nameWrap;
const h = Math.min(p ? p.scrollHeight : 120, 260);
$el.style.setProperty('--product-card-variants-height', h + 'px');
// Між назвою і ціною вже є auto-margin зазор (ціна притиснута до низу
// рівновисокої картки) — панель заповнює його, а ціну штовхаємо ЛИШЕ на
// переповнення. Міряємо через offset* (не залежить від transform) на
// наступному кадрі, коли hover-розкладка устоялась.
requestAnimationFrame(() => {
if (!buy || !nw) return;
const gap = buy.offsetTop - (nw.offsetTop + nw.offsetHeight);
$el.style.setProperty('--product-card-variants-push', Math.max(0, Math.round(h + 6 + 8 - gap)) + 'px');
});
})()"
>