1:root {
2  --lerp-0: 1;
3  --lerp-1: calc(sin(30deg));
4  --lerp-2: calc(sin(20deg));
5}
6.blocks {
7  display: flex;
8}
9.block {
10  flex: calc(0.2 + (var(--lerp) * 1.5));
11}
12.block__item {
13  translate: 0 calc(var(--lerp) * -75%);
14}
15.block:hover {
16  --lerp: var(--lerp-0);
17}
18.block:has(+ .block:hover),
19.block:hover + .block {
20  --lerp: var(--lerp-1);
21}
22.block:has(+ .block + .block:hover),
23.block:hover + .block + .block {
24  --lerp: var(--lerp-2);
25}