$(document).ready(function () {
let block = document.querySelector("#content");
let items = [...block.querySelectorAll("div.tera")];
let cols = getComputedStyle(block).gridTemplateColumns.split(' ').length;
block.addEventListener('click', (ev) => {
let target = ev.target.closest('.tera');
if (!target) return;
items.forEach((item) => { item.classList.remove('posyactiv'); });
target.classList.add('posyactiv');
let index = items.indexOf(target);
block.style.setProperty('--display', (index % cols == 0 ? 'none' : 'block'));
block.style.setProperty('--column', `1/${(index + 1 == cols) ? 0 : cols - (index % cols) + 1}`);
$('html,body').animate({scrollTop:$('.posyactiv').offset().top+"px"},{duration:1E3});
});
});
как раз инверсия не нужна, но похоже нету норм решения.