.clickable-image{cursor:zoom-in;transition:filter .18s ease,transform .18s ease}
.clickable-image:hover{filter:brightness(.96)}
.clickable-image:focus-visible{outline:3px solid #77a88a;outline-offset:4px}
.app-preview.clickable-image{position:relative}
.app-preview.clickable-image:after,.industry-photo.clickable-image:after{content:'⌕';position:absolute;right:11px;top:11px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#123d30db;color:#fff;border:1px solid #ffffff5c;font-size:17px;box-shadow:0 5px 18px #0003;pointer-events:none;z-index:3}
.industry-photo.clickable-image:after{top:auto;bottom:9px;right:10px;width:27px;height:27px;font-size:15px}
html.lightbox-open{overflow:hidden}
dialog.image-lightbox{padding:0;border:0;width:min(1400px,calc(100vw - 48px));max-width:none;height:min(900px,calc(100dvh - 48px));max-height:none;background:transparent;color:#fff;border-radius:22px;overflow:visible;box-shadow:none}
dialog.image-lightbox::backdrop{background:#07130fdf;backdrop-filter:blur(10px)}
.lightbox-shell{height:100%;display:grid;grid-template-rows:minmax(0,1fr) auto;position:relative;background:#10211bcc;border:1px solid #ffffff24;border-radius:22px;box-shadow:0 30px 100px #0009;overflow:hidden}
.lightbox-stage{position:relative;min-height:0;padding:48px 72px 22px;overflow:hidden;background:radial-gradient(circle at 50% 40%,#ffffff12,transparent 60%)}
.lightbox-scroll{width:100%;height:100%;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;touch-action:pan-x pan-y;border-radius:10px}
.lightbox-scroll:focus-visible{outline:3px solid #8da4ed;outline-offset:3px}
.lightbox-scroll::-webkit-scrollbar{width:11px;height:11px}
.lightbox-scroll::-webkit-scrollbar-track{background:#e5eaf2;border-radius:10px}
.lightbox-scroll::-webkit-scrollbar-thumb{background:#8fa2c5;border:3px solid #e5eaf2;border-radius:10px}
.lightbox-image{display:block;max-width:100%;max-height:none;width:auto;height:auto;margin:0 auto;object-fit:contain;border-radius:10px;box-shadow:0 20px 70px #0008;background:#f5f7f4}
.lightbox-close,.lightbox-nav{position:absolute;z-index:2;border:1px solid #ffffff36;background:#122a22d9;color:#fff;display:grid;place-items:center;box-shadow:0 8px 25px #0004;backdrop-filter:blur(8px);transition:background .15s,transform .15s}
.lightbox-close:hover,.lightbox-nav:hover{background:#245943;transform:scale(1.04)}
.lightbox-close{right:18px;top:18px;width:43px;height:43px;border-radius:50%;font-size:26px;line-height:1}
.lightbox-nav{top:50%;transform:translateY(-50%);width:46px;height:58px;border-radius:13px;font-size:25px}
.lightbox-nav:hover{transform:translateY(-50%) scale(1.04)}
.lightbox-prev{left:15px}.lightbox-next{right:15px}
.lightbox-meta{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:17px 24px 19px;border-top:1px solid #ffffff1e;background:#0c1d17e8}
.lightbox-caption{font-size:13px;line-height:1.5;color:#edf5ef;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lightbox-counter{flex:none;font-size:11px;letter-spacing:1px;color:#b8c9bd;background:#ffffff0e;border-radius:20px;padding:5px 10px}
@media(max-width:650px){dialog.image-lightbox{width:calc(100vw - 20px);height:calc(100dvh - 28px);border-radius:16px}.lightbox-shell{border-radius:16px}.lightbox-stage{padding:58px 10px 16px}.lightbox-close{right:12px;top:12px}.lightbox-nav{top:auto;bottom:12px;width:42px;height:42px;border-radius:50%}.lightbox-prev{left:12px}.lightbox-next{right:12px}.lightbox-meta{padding:14px 62px;min-height:68px;justify-content:center}.lightbox-caption{text-align:center;font-size:11px}.lightbox-counter{display:none}}
