/* Center project and partners image modals above the current viewport. */
.project-lightbox,
.partner-more-lightbox {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  padding: clamp(16px, 4vw, 40px) !important;
  background: rgba(3, 8, 18, 0.88) !important;
  backdrop-filter: blur(16px) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.1) !important;
  overflow: hidden !important;
}

.project-lightbox::before,
.partner-more-lightbox::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 18%, rgba(212, 175, 55, 0.16), transparent 36%),
    linear-gradient(180deg, rgba(7, 16, 31, 0.08), rgba(7, 16, 31, 0.72));
}

.project-lightbox img,
.partner-more-lightbox img {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: auto !important;
  max-width: min(92vw, 1080px) !important;
  max-height: min(82dvh, 820px) !important;
  object-fit: contain !important;
  border-radius: 24px !important;
  border: 1px solid rgba(212, 175, 55, 0.24) !important;
  background: rgba(7, 16, 31, 0.82) !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.58), 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
}

.project-lightbox .lightbox-close,
.partner-more-lightbox .lightbox-close {
  position: fixed !important;
  top: calc(18px + env(safe-area-inset-top, 0px)) !important;
  inset-inline-end: calc(18px + env(safe-area-inset-right, 0px)) !important;
  z-index: 1000000 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(212, 175, 55, 0.34) !important;
  color: #fff !important;
  background: rgba(9, 15, 30, 0.88) !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.38) !important;
  cursor: pointer !important;
  transition: transform 180ms ease, background 180ms ease, border-color 180ms ease !important;
}

.project-lightbox .lightbox-close:hover,
.partner-more-lightbox .lightbox-close:hover {
  transform: scale(1.06) !important;
  background: rgba(201, 168, 76, 0.22) !important;
  border-color: rgba(212, 175, 55, 0.62) !important;
}

@media (max-width: 640px) {
  .project-lightbox,
  .partner-more-lightbox {
    padding: 68px 14px 22px !important;
    align-items: center !important;
  }

  .project-lightbox img,
  .partner-more-lightbox img {
    max-width: 94vw !important;
    max-height: 76dvh !important;
    border-radius: 18px !important;
  }

  .project-lightbox .lightbox-close,
  .partner-more-lightbox .lightbox-close {
    width: 44px !important;
    height: 44px !important;
    top: calc(14px + env(safe-area-inset-top, 0px)) !important;
    inset-inline-end: calc(14px + env(safe-area-inset-right, 0px)) !important;
  }
}
