До наведения на блок стили выглядят так:
#GFCatalog .categories-item__card-wrapper {
overflow: hidden;
box-shadow: 0 2px 6px 0 rgba(188, 191, 185, 0.5);
border-radius: 10px;
max-height: 260px;
padding: 10px 15px;
position: absolute;
width: 100%;
background-color: white;
transition: max-height 0.2s ease;
}
А когда hover, то корректируются эти свойства:
#GFCatalog .categories-item__card-wrapper:hover {
max-height: 1000px;
z-index: 10;
transition: max-height 1s linear, box-shadow .3s;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15), 0 3px 5px rgba(0, 0, 0, 0.1);
}
Чтобы работал эффект, вам нужно изменить max-height и z-index (чтобы блок не заехал под другой соседний блок). Изменение transition, box-shadow - декоративные примочки.
PS: Используйте инструмент :hov на вкладке Стили в панели разработчика F12, чтобы выяснять такие подробности.
