.stage{perspective:2000px;background:#fff;place-items:center;height:100%;display:grid;position:relative;overflow:hidden}.row{width:max-content;height:calc(var(--size) + 240px);transform-style:preserve-3d;transform:translateY(var(--shift));touch-action:pan-y;justify-self:start;position:relative}.tile{width:var(--size);height:calc(var(--size)*1.35);transform:translate3d(calc(var(--base) - var(--offset)),-50%,0);will-change:transform;pointer-events:auto;position:absolute;top:50%}.tileInner{transform-style:preserve-3d;cursor:pointer;opacity:1;transform:perspective(var(--persp))rotateY(var(--angle))skewY(var(--skewY))scale(1);transition:transform .35s cubic-bezier(.22,.7,.21,1),opacity .25s;position:absolute;inset:0}.tile:hover .tileInner{transform:perspective(var(--persp))rotateY(var(--hover-angle))skewY(var(--hover-skewY))scale(1)translate3d(0,calc(-1*var(--lift)),0);opacity:1}.tile:hover .caption{opacity:1;transform:translateY(0)}@media (max-width:768px){.tile.focused .tileInner{transform:perspective(var(--persp))rotateY(var(--hover-angle))skewY(var(--hover-skewY))scale(1)translate3d(0,calc(-1*var(--lift)),0);opacity:1}}.panel{opacity:0;background:#fff;animation:.6s ease-out forwards tileFadeIn;position:absolute;inset:0;overflow:hidden}.panel>div{width:100%;height:100%;position:relative}.tile:first-child .panel{animation-delay:0s}.tile:nth-child(2) .panel{animation-delay:.1s}.tile:nth-child(3) .panel{animation-delay:.2s}.tile:nth-child(4) .panel{animation-delay:.3s}.tile:nth-child(5) .panel{animation-delay:.4s}.tile:nth-child(6) .panel{animation-delay:.5s}.tile:nth-child(7) .panel{animation-delay:.6s}.tile:nth-child(8) .panel{animation-delay:.7s}.tile:nth-child(9) .panel{animation-delay:.8s}.tile:nth-child(10) .panel{animation-delay:.9s}.tile:nth-child(n+11) .panel{animation-delay:1s}@keyframes tileFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.panel video{object-fit:cover;backface-visibility:hidden;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;transform:translateZ(0)}.panel img{object-fit:cover;backface-visibility:hidden;pointer-events:none;transform:translateZ(0)}.caption{text-align:center;color:#000;opacity:0;pointer-events:none;background:linear-gradient(#fff0,#fff 25%);padding:14px 0 18px;font-size:16px;font-weight:800;transition:opacity .22s,transform .22s;position:absolute;bottom:-52px;left:0;right:0;transform:translateY(8px)}.mobileArrows{display:none}@media (max-width:768px){.mobileArrows{z-index:50;pointer-events:none;justify-content:space-between;padding:0 18px;display:flex;position:absolute;bottom:20px;left:0;right:0}.mobileArrows .arrow{pointer-events:auto}.arrow{cursor:pointer;touch-action:manipulation;pointer-events:auto;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.arrowIcon{width:40px;height:40px}.arrow:active{transform:scale(.9)}}