/* Image block (Elementor Image). Loaded only where the block is used; the lightbox <dialog> is created by image.js. */
:where(.ne-bm-image) { text-align: center; } /* zero specificity: the Alignment control always wins, whatever the CSS load order */
/* :where() keeps these defaults below the generated Width / Max Width / Height rules. */
:where(.ne-bm-image) img { display: inline-block; max-width: 100%; height: auto; vertical-align: middle; transition: opacity .3s, filter .3s, transform .3s; }
.ne-bm-image a { display: inline-block; }
.ne-bm-image .ne-bm-image__figure { margin: 0; }
.ne-bm-image .ne-bm-image__caption { display: block; }
:where(.ne-bm-image .ne-bm-image__caption) { margin-block-start: 8px; }

/* Hover animations (Elementor's elementor-animation-*) */
.ne-bm-img-anim-grow:hover img { transform: scale(1.1); }
.ne-bm-img-anim-shrink:hover img { transform: scale(.9); }
.ne-bm-img-anim-float:hover img { transform: translateY(-8px); }
.ne-bm-img-anim-sink:hover img { transform: translateY(8px); }
.ne-bm-img-anim-rotate:hover img { transform: rotate(4deg); }

/* Lightbox */
.ne-bm-image-dialog { max-width: 92vw; max-height: 92vh; padding: 0; border: 0; overflow: visible; background: transparent; }
.ne-bm-image-dialog::backdrop { background: rgba(0, 0, 0, .85); }
.ne-bm-image-dialog img { display: block; max-width: 92vw; max-height: 88vh; width: auto; height: auto; }
.ne-bm-image-dialog__close { position: absolute; top: -44px; right: 0; padding: 0 8px; border: 0; background: none; color: #fff; font-size: 36px; line-height: 40px; cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .ne-bm-image img { transition: none; } }

/* "After page load": a soft panel in the image's reserved box until assets/js/lazy-frame.js sets its src. */
.ne-bm-image img.ne-bm-lazy-frame { background-color: #f0f0f1; }