/* Natural stacked flow is the baseline. JS enables the measured desktop canvas. */
.opening-sequence #work.portfolio-wall {display:block;position:relative;padding:0;border:0;min-height:0;margin:0;background:#000}
.wall-track {display:flex;flex-direction:column;gap:4.5rem;padding:4rem 20px}
.wall-project {display:block;width:100%;align-self:flex-start;color:#fff}
.wall-art {position:relative;overflow:hidden;background:#080808;aspect-ratio:1.3;transition:transform .35s cubic-bezier(.2,.6,.2,1)}
.wall-art img {display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s cubic-bezier(.2,.6,.2,1)}
.wall-meta {display:grid;grid-template-columns:2rem minmax(0,1fr) auto;gap:.35rem .75rem;margin-top:1rem;font-size:.875rem;line-height:1.25;letter-spacing:.015em}
.wall-meta h2 {margin:0;font-size:inherit;font-weight:700;line-height:inherit;letter-spacing:inherit}
.wall-meta p {grid-column:2/-1;margin:0;color:#b0b0b0;font-size:.8125rem;line-height:1.25;max-width:40ch}
.wall-number,.wall-year {font-size:.8125rem;color:#aaa}
.wall-project:focus-visible {outline:2px solid #fff;outline-offset:8px}
.wall-footer {display:flex;justify-content:flex-end;padding:2rem 30px 4rem}
.wall-footer a {font-size:.875rem;letter-spacing:.04em;border-bottom:1px solid #777;padding-bottom:.3rem}
.wall-footer a:hover {border-color:#fff}
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
  .wall-project:hover .wall-art,.wall-project:focus-visible .wall-art {transform:translateY(-8px) scale(1.015)}
}
/* Equal image dimensions and a shared horizontal baseline. */
.wall-enabled .wall-viewport {position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;overflow:clip}
.wall-enabled .wall-track {position:relative;display:flex;flex-direction:row;align-items:flex-start;gap:clamp(5rem,10vw,14rem);height:100%;width:max-content;padding:0 8vw;will-change:transform}
.wall-enabled .wall-project {flex:none;align-self:auto;margin:0;width:min(46vw,78svh);padding-top:15svh}
@media(min-width:801px) {
  .portfolio-wall:not(.wall-enabled) .wall-track {padding:5rem 8vw}
  .portfolio-wall:not(.wall-enabled) .wall-project {width:70%}
}
 .wall-hover-label {position:absolute;right:1rem;bottom:1rem;padding:.6rem .85rem;background:#000;color:#fff;font-size:.8125rem;letter-spacing:.04em;line-height:1.25;opacity:0;transform:translateY(5px);transition:opacity .2s ease,transform .25s ease}
.wall-project:focus-visible .wall-hover-label {opacity:1;transform:none}
@media(hover:hover) {.wall-project:hover .wall-hover-label {opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce) {.wall-art,.wall-art img,.wall-hover-label {transition:none;transform:none}}

