/* The reveal and image move in opposite directions, like a sliding print. */
.motion-heading{overflow:visible}
.motion-char-mask{display:inline-block;overflow:hidden;vertical-align:top;padding:.08em .02em .12em;margin:-.08em -.02em -.12em;line-height:1.2}
.motion-char{display:inline-block;transform-origin:left bottom}
.motion-reveal{opacity:0;clip-path:none;translate:0 14px;transition:translate .4s cubic-bezier(.22,1,.36,1),opacity .3s ease;transition-delay:0ms}
.motion-reveal.motion-shown{opacity:1;clip-path:none;translate:0 0}
.library-visual.motion-reveal:not(.library-long)>img{transform:translateY(8px);transform-origin:center;transition:transform .45s cubic-bezier(.22,1,.36,1);transition-delay:0ms}
.library-visual.motion-shown:not(.library-long)>img{transform:translateY(0) scale(1)}
.library-card{perspective:1100px}
.library-card-image{transform:rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transform-origin:center;transition:transform .65s cubic-bezier(.22,1,.36,1),box-shadow .65s}
.library-card.pointer-active .library-card-image{box-shadow:0 24px 45px #0002}
.library-card-caption{translate:var(--caption-x,0px) 0;transition:translate .55s cubic-bezier(.22,1,.36,1),color .2s!important}
.library-card-caption h2{transition:translate .5s cubic-bezier(.22,1,.36,1)}
.library-card:hover .library-card-caption h2{translate:8px 0}
.motion-cursor{position:fixed;left:0;top:0;z-index:35;width:82px;height:82px;margin:-41px 0 0 -41px;border-radius:50%;display:grid;place-items:center;background:#090909;color:#fff;pointer-events:none;opacity:0;scale:.35;transition:scale .4s cubic-bezier(.34,1.56,.64,1),opacity .2s}
.motion-cursor span{font:38px Arial,sans-serif}
.motion-cursor.is-active{opacity:1;scale:1}
.library-exit,.sam-back-top b,.library-return b{transition:translate .5s cubic-bezier(.22,1,.36,1),transform .45s,background .3s,color .3s}
.next-case>img{translate:var(--next-x,0px) var(--next-y,0px);rotate:-6deg;transition:clip-path .6s cubic-bezier(.76,0,.24,1),opacity .4s,translate .65s cubic-bezier(.22,1,.36,1),rotate .6s,transform .65s!important}
.next-case:hover>img{rotate:4deg}
@media(hover:hover) and (pointer:fine){.library-card,.next-case{cursor:none}.library-card .library-open{display:none}}
@media(max-width:700px){.motion-cursor{display:none}.motion-reveal{translate:0 14px}.library-card-image{transform:none!important}.library-card-caption{translate:none!important}.library-card:hover .library-card-caption h2{translate:none}}
@media(prefers-reduced-motion:reduce){.motion-reveal{opacity:1;translate:none;clip-path:none}.motion-char{opacity:1!important;transform:none!important}.motion-cursor{display:none}.library-visual.motion-reveal>img{transform:none!important}.library-card-image{transform:none!important}.library-card-caption{translate:none!important}}