.sessa-lightbox-open { overflow: hidden; }
.sessa-lightbox[hidden] { display: none; }
.sessa-lightbox { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; color: #fff; font-family: var(--sans, Arial, sans-serif); }
.sessa-lightbox__backdrop { position: absolute; inset: 0; background: rgba(8, 14, 24, .94); }
.sessa-lightbox__dialog { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(42px, 68px) minmax(0, 1fr) minmax(42px, 68px); grid-template-rows: minmax(0, 1fr) auto; align-items: center; width: min(1200px, 100vw); height: min(94vh, 100vh); padding: 32px 18px 18px; outline: none; }
.sessa-lightbox__figure { grid-column: 2; grid-row: 1; display: grid; place-items: center; min-width: 0; min-height: 0; margin: 0; }
.sessa-lightbox__image { display: block; max-width: 100%; max-height: calc(94vh - 112px); width: auto; height: auto; object-fit: contain; }
.sessa-lightbox__caption { max-width: 80ch; margin: 12px auto 0; color: #f4f1ec; font-size: 14px; line-height: 1.45; text-align: center; }
.sessa-lightbox__caption[hidden] { display: none; }
.sessa-lightbox__counter { grid-column: 2; grid-row: 2; margin: 12px 0 0; color: #d9d5ce; font-size: 13px; text-align: center; }
.sessa-lightbox__close, .sessa-lightbox__previous, .sessa-lightbox__next { appearance: none; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; background: rgba(8,14,24,.6); color: #fff; cursor: pointer; line-height: 1; }
.sessa-lightbox__close { position: absolute; top: 5px; right: 18px; z-index: 2; width: 40px; height: 40px; font-size: 30px; }
.sessa-lightbox__previous, .sessa-lightbox__next { grid-row: 1; width: 46px; height: 46px; font-size: 38px; }
.sessa-lightbox__previous { grid-column: 1; }
.sessa-lightbox__next { grid-column: 3; }
.sessa-lightbox button:hover, .sessa-lightbox button:focus-visible { border-color: #fff; background: rgba(184,90,103,.9); }
.sessa-lightbox button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 600px) {
  .sessa-lightbox__dialog { grid-template-columns: 42px minmax(0, 1fr) 42px; width: 100vw; height: 100vh; padding: 42px 5px 14px; }
  .sessa-lightbox__image { max-height: calc(100vh - 112px); }
  .sessa-lightbox__previous, .sessa-lightbox__next { width: 36px; height: 36px; font-size: 29px; }
  .sessa-lightbox__close { right: 8px; }
}
@media (prefers-reduced-motion: reduce) { .sessa-lightbox__image { scroll-behavior: auto; } }