/* Preview affordance shared by certificate cards and product main images. */
.image-preview{display:block;color:inherit;text-decoration:none;cursor:zoom-in;border-radius:var(--radius-media-compact)}
.image-preview__media{position:relative;overflow:hidden;outline:1px solid transparent;outline-offset:-1px;transition:outline-color var(--duration-fast) var(--ease-feedback)}
.image-preview__cue{position:absolute;right:12px;bottom:12px;width:36px;height:36px;display:grid;place-items:center;background:var(--paper);border:1px solid var(--line);border-radius:50%;color:var(--muted);transition:color var(--duration-fast) var(--ease-feedback),border-color var(--duration-fast) var(--ease-feedback)}
.image-preview:is(:hover,:focus-visible) .image-preview__media{outline-color:var(--field-line)}
.image-preview:is(:hover,:focus-visible) .image-preview__cue{color:var(--accent);border-color:var(--field-line)}
.image-preview:focus-visible{outline:2px solid var(--control-focus);outline-offset:6px}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .image-preview__media>img{transition:transform var(--duration-media) var(--ease-feedback)}
 .image-preview:is(:hover,:focus-visible) .image-preview__media>img{transform:scale(1.02)}
}
/* One quiet, image-only overlay for documents, products and editorial images. */
.image-viewer{position:fixed;inset:0;margin:0;padding:0;width:100%;height:100dvh;max-width:none;max-height:none;border:0;background:transparent;color:#fff;overflow:hidden}
.image-viewer::backdrop{background:rgb(12 14 16 / 92%)}
.image-viewer__canvas{position:absolute;inset:56px 72px 40px;display:flex;align-items:center;justify-content:center;overflow:auto;overscroll-behavior:contain}
.image-viewer__zoom{display:block;flex-shrink:0;max-width:100%;padding:0;border:0;background:none;line-height:0;cursor:zoom-in}
.image-viewer__zoom img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 96px);object-fit:contain}
.image-viewer__zoom img[hidden]{display:none}
.image-viewer__canvas.is-zoomed{display:block;text-align:center}
.image-viewer__canvas.is-zoomed .image-viewer__zoom{display:inline-block;max-width:none;cursor:zoom-out}
.image-viewer__canvas.is-zoomed img{width:var(--viewer-image-width);max-width:none;max-height:none}
.image-viewer__control{position:absolute;z-index:1;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:rgb(255 255 255 / 10%);color:inherit;cursor:pointer;transition:background var(--duration-fast)}
.image-viewer__control:hover{background:rgb(255 255 255 / 22%)}
.image-viewer__control[hidden]{display:none}
.image-viewer :is(button,a):focus-visible{outline:2px solid #fff;outline-offset:4px}
.image-viewer__close{top:12px;right:16px}
.image-viewer__prev,.image-viewer__next{top:calc(50% - 22px)}
.image-viewer__prev{left:16px}.image-viewer__next{right:16px}
.image-viewer__back{transform:rotate(180deg)}
.image-viewer__status{position:absolute;top:50%;left:20px;right:20px;transform:translateY(-50%);text-align:center;font-size:var(--text-small);line-height:1.8;pointer-events:none}
.image-viewer__status p{margin:0}.image-viewer__status a{color:inherit;pointer-events:auto;text-decoration:underline;text-underline-offset:4px}
.article-reading img[data-image-viewer-trigger]{cursor:zoom-in}
.article-reading img[data-image-viewer-trigger]:focus-visible{outline:2px solid var(--control-focus);outline-offset:4px}
html.image-viewer-open,html.image-viewer-open body{overflow:hidden}
@media(max-width:600px){
 .image-viewer__canvas{inset:64px 16px}
 .image-viewer__zoom img{max-height:calc(100dvh - 128px)}
 .image-viewer__close{right:12px}
 .image-viewer__prev,.image-viewer__next{top:auto;bottom:10px}
 .image-viewer__prev{left:calc(50% - 52px)}.image-viewer__next{right:calc(50% - 52px)}
}
@media(prefers-reduced-motion:reduce){.image-preview__media,.image-preview__cue,.image-viewer__control{transition:none}}
