#ru-projects .detail .project-photo-grid {
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:clamp(24px,4vw,64px) clamp(14px,2.5vw,40px);
  align-items:center;
  padding:20px 0 48px;
}
#ru-projects .detail .project-photo {
  display:block;
  grid-column:span 6;
  width:100%;
  min-width:0;
  margin:0;
  padding:0;
  border:0;
  background:none;
  cursor:zoom-in;
}
#ru-projects .detail .project-photo:nth-child(4n+2) {grid-column:span 5}
#ru-projects .detail .project-photo:nth-child(4n+3) {grid-column:span 7}
#ru-projects .detail .project-photo.photo-portrait {grid-column:span 5}
#ru-projects .detail .project-photo.photo-portrait:nth-child(even) {grid-column:span 7;max-width:85%;justify-self:center}
#ru-projects .detail .project-photo.photo-wide {grid-column:1/-1}
#ru-projects .detail .project-photo:first-child {grid-column:1/-1;max-width:100%}
#ru-projects .detail .project-photo:first-child.photo-portrait {max-width:64%;justify-self:center}
#ru-projects .detail .project-photo img {
  display:block;
  width:100%;
  height:auto!important;
  margin:0!important;
  max-width:100%;
  transform:none!important;
}
#ru-projects .detail .project-photo:focus-visible {outline:2px solid currentColor;outline-offset:7px}
html:has(.project-lightbox[open]) {overflow:hidden}
.project-lightbox {
  box-sizing:border-box;
  position:fixed;
  inset:0;
  width:100%;max-width:none;
  height:100dvh;max-height:none;
  margin:0;padding:20px 28px;
  border:0;
  background:#000;
  color:#fff4dc;
  font-family:Arial,sans-serif;
}
.project-lightbox[open] {display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:18px}
.project-lightbox::backdrop {background:#000}
.project-lightbox header,.project-lightbox footer {display:flex;justify-content:space-between;align-items:center;gap:20px}
.project-lightbox .photo-title {font-size:14px;line-height:1.4}
.project-lightbox button {border:0;background:transparent;color:inherit;font:14px Arial,sans-serif;cursor:pointer;min-height:44px;padding:8px}
.project-lightbox button:focus-visible {outline:2px solid currentColor;outline-offset:2px}
.project-lightbox .photo-close {white-space:nowrap;font-size:16px}
.project-lightbox .photo-stage {min-width:0;min-height:0;display:grid;place-items:center;touch-action:pinch-zoom}
.project-lightbox img {display:block;width:100%;height:100%;min-height:0;object-fit:contain;user-select:none;-webkit-user-drag:none}
.project-lightbox .photo-counter {font-size:12px;font-variant-numeric:tabular-nums}
.project-lightbox [hidden] {display:none!important}
@media(max-width:650px) {
  #ru-projects .detail .project-photo-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 12px;padding:12px 0 36px}
  #ru-projects .detail .project-photo:nth-child(n),#ru-projects .detail .project-photo.photo-portrait:nth-child(n) {grid-column:span 1;max-width:100%}
  #ru-projects .detail .project-photo.photo-wide:nth-child(n),#ru-projects .detail .project-photo:first-child,#ru-projects .detail .project-photo:nth-child(3n+1) {grid-column:1/-1;max-width:100%}
  .project-lightbox {padding:10px 12px}
  .project-lightbox[open] {gap:10px}
  .project-lightbox .photo-title {font-size:12px}
  .project-lightbox header {gap:8px}
}

#ru-fine-art .fa-work-image:focus-visible {outline:2px solid currentColor;outline-offset:4px}

.project-lightbox .photo-frame {width:100%;height:100%;min-width:0;min-height:0}
.project-lightbox.has-photo-crop .photo-frame {position:relative;overflow:hidden}
.project-lightbox.has-photo-crop img {position:absolute;max-width:none;object-fit:fill}