@media (max-width: 1023px) {
  .page-results .doc-top { padding-left: max(var(--gutter), calc((100% - var(--col)) / 2)); padding-right: max(var(--gutter), calc((100% - var(--col)) / 2)); }
}
.rp { max-width: calc(var(--col) + 2 * var(--gutter)); margin: 0 auto; padding: 36px var(--gutter) 96px; }
.rp-title { margin-top: 3px; }   

.rp-list { margin-top: 24px; column-count: 2; column-gap: 12px; }

.rp-list > li { break-inside: avoid; margin-bottom: calc(12px + 6px + 11px * 1.3); }

.rp-list > li:nth-child(3) { -webkit-column-break-before: always; break-before: column; }
.rp-pic {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border-radius: 10px;
  background: #fff;                 
  cursor: zoom-in;
  transition: transform .2s cubic-bezier(.2, 0, 0, 1);
}

.rp-pic img { width: 100%; height: auto; border-radius: inherit; }

.rp-pic::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.08); pointer-events: none; }

.rp-pic:active { transform: scale(0.99); transition: transform .12s ease .09s; }
@media (any-hover: hover) and (any-pointer: fine) {
  .rp-pic:active { transition-delay: 0s; }
}
.rp-pic:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }

.rp-pic.is-out { opacity: 0; transition: none; }

.viewer--grow { background: none; opacity: 1; transition: none; }
.viewer-shade { position: absolute; inset: 0; background: rgb(10,10,10); }
.viewer--grow .viewer-track { position: relative; }
.viewer--grow .slide img {
  max-width: none;
  max-height: none;
  transform-origin: 0 0;
  transition: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}

.viewer-step { display: none; }
@media (any-hover: hover) and (any-pointer: fine) {
  .viewer--grow .slide { padding-left: 72px; padding-right: 72px; }
  .viewer-step {
    position: absolute;
    top: 50%;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 44px; height: 44px;
    margin-top: -22px;
    border-radius: 50%;
    background: rgba(255,255,255,0.12);
    color: #fff;
    transition: background-color .15s ease, opacity .2s ease;
  }
  .viewer-step--prev { left: 14px; }
  .viewer-step--next { right: 14px; }
  .viewer-step svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
  .viewer-step:hover, .viewer--grow .viewer-close:hover { background: rgba(255,255,255,0.2); }
  .viewer.is-dragging .viewer-step { opacity: 0; }
}