/* Portrait image galleries (see gallery-render.js). Every distance is in "u",
   1% of the gallery's width, so the composition scales with the screen. */
.proj.flow{--u:calc(min(100vw - 2 * var(--gut), 820px) / 100)}
.m-gallery{display:block;width:100%;pointer-events:auto}
.g-row{display:flex;align-items:var(--al,center);gap:calc(var(--u) * var(--gap,5));
  margin-bottom:calc(var(--u) * var(--mb,9));
  padding:calc(var(--u) * var(--padT,0)) calc(var(--u) * var(--padX,0)) calc(var(--u) * var(--padB,0));
  background:var(--bg,transparent)}
.g-row.single{justify-content:center}
.g-row.bleed{margin-inline:calc(-1 * var(--gut))}
.g-row.multi > .g-item{flex:var(--w,100) 1 0;min-width:0}
.g-row.single > .g-item{flex:none;width:calc(var(--w,100) * 1%);max-width:100%}
.g-item{min-width:0;will-change:transform,opacity}
.g-img img{display:block;width:100%;height:auto;border-radius:var(--r,0)}
.g-img.has-shadow img{box-shadow:0 10px 24px rgba(24,32,40,.12)}
.g-col{display:flex;flex-direction:column;gap:calc(var(--u) * var(--gap,8))}
.g-stack{position:relative;width:100%;max-width:var(--maxw,none);margin-inline:auto;aspect-ratio:var(--ar);isolation:isolate}
.g-stack.has-shadow{box-shadow:0 10px 24px rgba(24,32,40,.12)}
.g-layer{position:absolute;display:block;height:auto;max-width:none;will-change:transform,opacity}
.g-folio{display:block;margin-top:12px;font-size:.62rem;letter-spacing:.1em;color:#888;text-align:right}
.dk .g-folio{color:#999}
@media (prefers-reduced-motion:reduce){.g-item,.g-layer{will-change:auto}}
.g-item.is-hidden{opacity:.22}