/* Shared case-study image viewer. The artwork keeps its original colours. */
.MagicCase .MagicCase__zoom{position:fixed;inset:0;margin:0;width:100%;height:100svh;max-width:none;max-height:none;box-sizing:border-box;padding:72px max(24px,4vw) 36px;border:0;background:transparent;overflow:hidden;transform:none}
.MagicCase .MagicCase__zoom[open]{display:grid;place-items:center}
.MagicCase .MagicCase__zoom::backdrop{background:rgb(2 5 6 / 0);backdrop-filter:blur(0);transition:background .32s ease,backdrop-filter .32s ease}
.MagicCase .MagicCase__zoom[data-visible]::backdrop{background:rgb(2 5 6 / .92);backdrop-filter:blur(6px)}
.MagicCase .MagicCase__zoom img{width:auto;height:auto;max-width:100%;max-height:calc(100svh - 108px);object-fit:contain;aspect-ratio:auto;background:transparent;margin:auto;box-shadow:0 20px 80px #0005;opacity:0;transform:translateY(24px) scale(.975);transition:opacity .3s ease,transform .42s cubic-bezier(.2,.75,.25,1)}
.MagicCase .MagicCase__zoom[data-visible][data-ready] img{opacity:1;transform:translateY(0) scale(1)}
.MagicCase .MagicCase__zoom>button{position:absolute;top:max(18px,env(safe-area-inset-top));right:max(20px,env(safe-area-inset-right));width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid #ffffff30;border-radius:50%;background:#ffffff08;color:#fff;cursor:pointer;transition:background .2s ease,border-color .2s ease,transform .2s ease}
.MagicCase .MagicCase__zoom>button:hover{background:#ffffff18;border-color:#ffffff70;transform:rotate(90deg)}
.MagicCase .MagicCase__zoom>button:focus-visible{outline:2px solid white;outline-offset:4px}
.MagicCase .MagicCase__zoom>p{display:none}
@media(max-width:600px){.MagicCase .MagicCase__zoom{padding:76px 12px 24px}.MagicCase .MagicCase__zoom img{max-height:calc(100svh - 100px)}}
@media(prefers-reduced-motion:reduce){.MagicCase .MagicCase__zoom::backdrop,.MagicCase .MagicCase__zoom img,.MagicCase .MagicCase__zoom>button{transition:none;transform:none}}