[data-lightbox] { cursor: zoom-in; }

.lb { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; background: rgba(8, 11, 22, .92); padding: 56px 72px; }
.lb.open { display: flex; }
.lb-fig { margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.lb-fig img { max-width: 100%; max-height: calc(100vh - 260px); object-fit: contain; border-radius: 10px; box-shadow: 0 20px 60px rgba(0,0,0,.5); background: #111; }
.lb-fig figcaption { display: flex; flex-direction: column; align-items: center; gap: 6px; max-width: 640px; color: #e2e8f0; font-size: .95rem; text-align: center; }
.lb-fig figcaption strong { color: #fff; font-size: 1.1rem; }
.lb-fig figcaption p { margin: 0; color: #cbd5e1; font-size: .9rem; line-height: 1.6; }
.lb-cat { padding: 3px 12px; border-radius: 999px; font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #fff; background: rgba(255,255,255,.16); }
.lb-fig figcaption:empty { display: none; }
.lb-btn { position: absolute; width: 44px; height: 44px; border-radius: 50%; border: none; background: rgba(255,255,255,.12); color: #fff; cursor: pointer; font-size: 1rem; transition: background .2s; }
.lb-btn:hover { background: rgba(255,255,255,.28); }
.lb-close { top: 16px; right: 16px; }
.lb-prev { left: 16px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 16px; top: 50%; transform: translateY(-50%); }
.lb.single .lb-prev, .lb.single .lb-next { display: none; }
.lb-count { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); color: #cbd5e1; font-size: .85rem; }

@media (max-width: 640px) {
    .lb { padding: 56px 12px; }
    .lb-prev, .lb-next { top: auto; bottom: 12px; transform: none; }
    .lb-prev { left: calc(50% - 100px); }
    .lb-next { right: calc(50% - 100px); }
    .lb-count { bottom: 24px; }
}