.phone-wheel{--phone-scale: 1;--phone-translate-x: 0;--phone-translate-y: 0;--phone-border-radius: 30px}.phone-wheel .phone{position:absolute;height:440px;width:262px;border-radius:var(--phone-border-radius);left:50%;top:8px;transform:translate(-50%) translate(var(--phone-translate-x),var(--phone-translate-y)) scale(var(--phone-scale));transition:all 1.2s;opacity:.7;background-size:cover;background-position:top center;background-repeat:no-repeat}.phone-wheel .phone.phone-0{opacity:0;--phone-scale: .6;--phone-translate-x:calc(-257.5% - 52px);--phone-translate-y: 10%}.phone-wheel .phone.phone-1{opacity:.7;--phone-scale: .8;--phone-translate-x:calc(-187.5% - 32px);--phone-translate-y: 5%}.phone-wheel .phone.phone-2{opacity:.7;--phone-scale: .95;--phone-translate-x:calc(-97.5% - 20px)}.phone-wheel .phone.phone-3{opacity:1}.phone-wheel .phone.phone-4{opacity:.7;--phone-scale: .95;--phone-translate-x:calc(97.5% + 20px)}.phone-wheel .phone.phone-5{opacity:.7;--phone-scale: .8;--phone-translate-x:calc(187.5% + 32px);--phone-translate-y: 5%}.phone-wheel .phone.phone-6,.phone-wheel .phone.phone-7,.phone-wheel .phone.phone-8{opacity:0;--phone-scale: .6;--phone-translate-x:calc(257.5% + 52px);--phone-translate-y: 10%}@media (max-width: 768px){.phone-wheel .phone.phone-2,.phone-wheel .phone.phone-4{--phone-translate-y: 4%}.phone-wheel .phone.phone-1,.phone-wheel .phone.phone-5{--phone-translate-y: 16%}}
