body.image-viewer-open { overflow: hidden !important; }
img:not([data-no-lightbox]) { cursor: zoom-in; }
.hero-visual, .product-card:has(img), .technology-media, .solution-card:has(img) { cursor: zoom-in; }
.image-viewer {
  position: fixed; z-index: 5000; inset: 0; display: grid; grid-template-columns: 74px minmax(0, 1fr) 74px;
  grid-template-rows: 78px minmax(0, 1fr) 76px; color: #f6f6f2; background: rgba(10,11,10,.96);
  opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s; overscroll-behavior: contain;
}
.image-viewer.is-open { opacity: 1; visibility: visible; }
.image-viewer__top { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,.11); }
.image-viewer__meta { min-width: 0; display: grid; gap: 2px; }
.image-viewer__meta strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.image-viewer__meta span { color: rgba(255,255,255,.55); font-size: 11px; }
.image-viewer__top-actions { display: flex; align-items: center; gap: 7px; }
.image-viewer button, .image-viewer__original {
  display: grid; place-items: center; min-width: 42px; height: 42px; padding: 0 12px; border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; font: 700 14px/1 "Segoe UI", Arial, sans-serif;
  text-decoration: none; cursor: pointer; transition: background .18s ease, transform .18s ease;
}
.image-viewer button:hover, .image-viewer__original:hover { background: rgba(255,255,255,.16); transform: translateY(-1px); }
.image-viewer__original { min-width: auto; font-size: 11px; }
.image-viewer [data-image-close] { font-size: 24px; font-weight: 400; }
.image-viewer__stage {
  position: relative; grid-column: 2; grid-row: 2; min-width: 0; min-height: 0; display: grid; place-items: center;
  place-self: center; width: min(100%, calc((100vh - 154px) * 16 / 9)); height: auto; max-height: 100%; aspect-ratio: 16 / 9;
  overflow: hidden; touch-action: none; cursor: zoom-in; background: #050605; border-radius: 4px;
}
.image-viewer__stage[data-ratio="9-16"] { width: auto; height: 100%; max-width: 100%; aspect-ratio: 9 / 16; }
.image-viewer__stage.is-zoomed { cursor: grab; }
.image-viewer__stage.is-zoomed:active { cursor: grabbing; }
.image-viewer__stage img {
  width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; cursor: inherit;
  transform-origin: center; transition: transform .08s linear; will-change: transform; user-select: none; -webkit-user-drag: none;
}
.image-viewer__loader { position: absolute; width: 38px; height: 38px; border: 3px solid rgba(255,255,255,.18); border-top-color: #d76a2d; border-radius: 50%; opacity: 0; animation: image-viewer-spin .7s linear infinite; }
.image-viewer__stage.is-loading .image-viewer__loader { opacity: 1; }
.image-viewer__stage.is-loading img { opacity: .25; }
@keyframes image-viewer-spin { to { transform: rotate(360deg); } }
.image-viewer__nav { align-self: center; justify-self: center; width: 48px; height: 64px !important; padding: 0 !important; border-radius: 14px !important; font-size: 40px !important; font-weight: 300 !important; }
.image-viewer__nav--prev { grid-column: 1; grid-row: 2; }
.image-viewer__nav--next { grid-column: 3; grid-row: 2; }
.image-viewer__nav.is-hidden { opacity: 0; pointer-events: none; }
.image-viewer__controls { grid-column: 1 / -1; grid-row: 3; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 12px; border-top: 1px solid rgba(255,255,255,.09); }
.image-viewer__controls button { height: 38px; min-width: 38px; padding: 0 10px; }
.image-viewer__controls .image-viewer__zoom { min-width: 68px; font-size: 11px; }
.image-viewer__ratio { display: flex; gap: 4px; margin-left: 8px; padding-left: 8px; border-left: 1px solid rgba(255,255,255,.14); }
.image-viewer__ratio button { min-width: 52px; font-size: 11px; letter-spacing: .03em; }
.image-viewer__ratio button.is-active { border-color: #d76a2d; background: #d76a2d; color: #fff; }
.image-viewer__controls > span { margin-left: 8px; color: rgba(255,255,255,.5); font-size: 10px; }

@media (max-width: 700px) {
  .image-viewer { grid-template-columns: 54px minmax(0, 1fr) 54px; grid-template-rows: 66px minmax(0, 1fr) 68px; }
  .image-viewer__top { padding: 10px 12px; }
  .image-viewer__original { display: none; }
  .image-viewer__top-actions { gap: 5px; }
  .image-viewer button { min-width: 38px; height: 38px; }
  .image-viewer__nav { width: 40px; height: 54px !important; font-size: 34px !important; }
  .image-viewer__controls > span { display: none; }
  .image-viewer__stage { width: min(100%, calc((100vh - 134px) * 16 / 9)); }
  .image-viewer__stage[data-ratio="9-16"] { width: auto; height: 100%; }
  .image-viewer__ratio { margin-left: 2px; padding-left: 6px; }
  .image-viewer__ratio button { min-width: 46px; padding: 0 7px; }
}