.case-chain{--lean-dir: 1;display:flex;flex-direction:column}[dir=ltr] .case-chain{--lean-dir: -1}.case-chain-item{transition:transform .5s cubic-bezier(.22,1,.36,1)}.case-chain-item.is-start{transform:translate(calc(var(--lean-dir) * 1.5%)) rotate(calc(var(--lean-dir) * .6deg))}.case-chain-item.is-end{transform:translate(calc(var(--lean-dir) * -1.5%)) rotate(calc(var(--lean-dir) * -.6deg))}.case-chain-ribbon{position:relative;align-self:center;display:block;width:2.25rem;height:3rem;margin-block:.25rem;border-radius:.5rem;overflow:hidden;background:repeating-linear-gradient(90deg,transparent 0 5px,rgb(255 255 255 / .22) 5px 7px),linear-gradient(180deg,var(--brand-magenta),var(--brand-teal));opacity:.85;animation:case-ribbon-glow 3.2s ease-in-out infinite}.case-chain-ribbon.is-end{transform:skew(calc(var(--lean-dir) * 18deg))}.case-chain-ribbon.is-start{transform:skew(calc(var(--lean-dir) * -18deg))}.case-chain-ribbon:after{content:"";position:absolute;inset-inline:0;top:-60%;height:60%;background:linear-gradient(180deg,transparent,rgb(255 255 255 / .9) 45%,color-mix(in srgb,var(--brand-teal) 80%,#fff) 55%,transparent);filter:blur(1px);animation:case-ribbon-current 1.9s cubic-bezier(.45,0,.25,1) infinite}.case-chain-ribbon:nth-of-type(2n):after{animation-delay:.7s}@keyframes case-ribbon-current{0%{transform:translateY(0);opacity:0}15%{opacity:1}85%{opacity:1}to{transform:translateY(270%);opacity:0}}@keyframes case-ribbon-glow{0%,to{box-shadow:0 0 18px color-mix(in srgb,var(--brand-teal) 40%,transparent)}48%{box-shadow:0 0 26px color-mix(in srgb,var(--brand-teal) 60%,transparent),0 0 8px color-mix(in srgb,var(--brand-magenta) 45%,transparent)}52%{box-shadow:0 0 14px color-mix(in srgb,var(--brand-teal) 35%,transparent)}}@media(min-width:768px){.case-chain-ribbon{height:3.5rem}}@media(prefers-reduced-motion:reduce){.case-chain-ribbon,.case-chain-ribbon:after{animation:none}.case-chain-ribbon:after{opacity:0}.case-chain-item{transition:none}}