body.single-project-page{--single-nav-top:24px;overflow:auto}
.single-project-header{position:fixed;z-index:3;left:32px;right:32px;top:var(--single-nav-top);display:flex;align-items:center;font:400 1rem/1.3 Diatype,Arial,sans-serif;pointer-events:none}
.single-project-header a{pointer-events:auto}
.single-project-content{width:100%;margin:0 auto;padding-top:112px;display:flex;flex-direction:column;gap:32px}
.single-project-meta{display:flex;align-items:baseline;gap:8px;font:400 1rem/1.3 Systemia,Arial,sans-serif;margin-bottom:-16px;padding:0 24px}
.single-project-meta h1{font:400 24px/1.2 Diatype,Arial,sans-serif;margin:0}
.single-tags{opacity:1}
.single-shot,.single-ring-row{border-radius:0;overflow:hidden}
.single-shot img{display:block;width:100%;height:auto}
.single-description{display:flex;flex-direction:column;gap:8px;font:400 1rem/1.3 Diatype,Arial,sans-serif;margin:-16px 16px 0}
.single-description p{display:grid;grid-template-columns:16px minmax(0,1fr);gap:8px;margin:0}
.single-description sup{font:400 .65em/1.3 Diatype,Arial,sans-serif;padding-top:2px}
.single-ring-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:#fff}
.single-ring-row video{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:#fff}
.single-project-footer{display:flex;align-items:center;justify-content:space-between;padding:24px 32px;font:400 1rem/1.3 Diatype,Arial,sans-serif}
.single-theme{display:flex;align-items:center}
.single-imprint{width:calc(100vw - 32px);margin:40px auto 0;font:400 1rem/1.3 Diatype,Arial,sans-serif}
.single-imprint h2{font:inherit;margin:0 0 16px}
.single-imprint p{margin:0;text-align:justify;text-align-last:left}
@media(min-width:1800px){.single-project-meta h1{font-size:32px}}
@media(max-width:900px){.single-project-content{padding-top:96px}.single-project-meta h1{font-size:22px}}

/* Keep the metadata below Back to Projects now that content spans the page. */
.single-project-meta{position:sticky;top:calc(var(--single-nav-top) + 1.3rem + 16px);z-index:4}
.single-project-footer{position:relative;z-index:3}
/* During the morph, the gallery supplies the moving image and text pixels. */
html.single-project-entering,.single-project-entering body.single-project-page{background:transparent;transition:none}
.single-project-entering .single-project-content>*,.single-project-entering .single-project-header,.single-project-entering .single-project-footer{opacity:0}

.single-imprint .imprint-updated{margin-top:16px;text-align:left}

/* Center the hero when it fits; keep navigation clear for taller full-width images. */
.single-project-content{padding-top:var(--single-intro-top,112px)}
.single-number,.single-tags{transform:translateY(var(--single-small-rise,0px))}

/* Match the home wordmark's mobile corner position; metadata remains below it. */
@media(max-width:700px){
 body.single-project-page{--single-nav-top:calc(clamp(80px,13.4svh,114px)/2 + 8px)}
 .single-project-header{left:16px;right:16px}
}

/* A square recording on a 16:10 white canvas, matching the campaign image. */
.single-square-recording{position:relative;aspect-ratio:16/10;background:#fff}
.single-square-window{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:51.5%;height:82.4%;aspect-ratio:1;overflow:hidden}
/* Equal cropping on every edge removes the recording's white seams without changing its square shape. */
.single-square-window video{position:absolute;left:-1px;top:-1px;display:block;width:calc(100% + 2px);height:calc(100% + 2px);max-width:none;object-fit:cover}
/* Omit the bottom 10 source pixels containing the recorded window corners. */
.single-shop-recording{position:relative;aspect-ratio:1920/1122}
.single-shop-recording video{position:absolute;left:0;top:0;display:block;width:100%;height:auto}

.single-shot>video{display:block;width:100%;height:auto}
.single-ring-row{grid-template-columns:repeat(var(--media-columns,3),minmax(0,1fr))}

/* Consecutive assets share one divider instead of two frames and a gutter. */
.single-shot+.single-shot,.single-shot+.single-ring-row,.single-ring-row+.single-shot,.single-ring-row+.single-ring-row{margin-top:-32px;border-top:1px solid var(--stroke)}