килограммы на километры
.cls {
padding-top: calc(100% - 10rem)
}
А что у вас в школе по физике было?
Там была такая штука как единицы измерения.
Хотя это чисто общего образования.
Ошибка вообще конечно не в этом.
Ваша проблема решается на js путем сравнения двух (или четырех, в зависимости от верстки) размеров.
IntersectionObserver
API обеспечивает вызов определенной функции каждый раз при пересечении целевого элемента с root или viewport.