.works-intro { padding-top: clamp(56px, 7vw, 100px); padding-bottom: 48px; }
.works-intro h1 { font-family: var(--font-body); font-size: clamp(2.3rem, 5vw, 4.5rem); font-weight: 500; letter-spacing: -.055em; line-height: 1.12; max-width: 14ch; }
.works-intro .lead { max-width: 46ch; margin-top: 24px; font-size: 1rem; line-height: 1.8; }
.works-albums { padding-top: 0; }
.work-album + .work-album { margin-top: 80px; }
.work-album .studio-heading { display: grid; grid-template-columns: 48px 1fr; gap: 10px 20px; margin-bottom: 32px; padding-top: 28px; border-top: 1px solid #dcdedb; }
.work-album-number { grid-row: span 2; color: var(--muted); font-size: .8rem; padding-top: 8px; }
.work-album .studio-heading h2 { margin: 0; font-family: var(--font-body); font-size: clamp(1.4rem, 2.4vw, 2rem); font-weight: 500; letter-spacing: -.035em; line-height: 1.3; }
.work-album .studio-heading p { margin: 0; max-width: 60ch; font-size: .9rem; color: var(--muted); line-height: 1.7; }
.work-photo-grid { display: block; columns: 3; column-gap: 28px; }
.work-photo-grid:has(> .work-tile:nth-child(3):last-child) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; align-items: start; }
.work-tile { margin: 0 0 28px; min-width: 0; break-inside: avoid; display: inline-block; width: 100%; vertical-align: top; }
.work-photo { position: relative; border-radius: 12px; background: #e8e7e2; }
.work-photo img { aspect-ratio: auto; width: 100%; height: auto; object-fit: contain; }
.work-photo:hover img { transform: none; }
.work-tile figcaption { padding: 14px 4px 0; color: #626560; font-size: .82rem; line-height: 1.75; max-width: 46ch; }
.work-media-label { position: absolute; bottom: 14px; left: 14px; padding: 8px 12px; border-radius: 30px; background: rgb(255 255 255 / .94); color: #18202a; font-size: .7rem; box-shadow: 0 2px 16px #00000012; }
.work-play-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 68px; height: 68px; display: grid; place-items: center; padding-left: 4px; border: 1px solid #ffffff90; border-radius: 50%; color: white; background: #10121a60; font-size: 24px; backdrop-filter: blur(8px); }
.work-photo:focus-visible { outline: 3px solid var(--navy); outline-offset: 4px; }
.work-lightbox { border-radius: 12px; }
.work-lightbox [hidden] { display: none !important; }
.work-media-viewport { overflow: auto; height: min(68dvh, 780px); width: 100%; display: flex; align-items: flex-start; }
.work-lightbox .work-media-viewport img { flex: none; max-width: none; max-height: none; object-fit: contain; cursor: zoom-in; }
.work-lightbox .work-media-viewport img.is-zoomed { cursor: zoom-out; }
.work-lightbox video { display: block; width: 100%; height: 100%; object-fit: contain; }
.work-lightbox figcaption { font-size: .9rem; line-height: 1.5; }
.work-lightbox .work-zoom-controls { position: absolute; top: 6px; left: 60px; display: flex; gap: 10px; align-items: center; }
.work-lightbox .work-zoom-controls button { position: static; font-size: 24px; }
.work-lightbox button:focus-visible { outline: 2px solid white; outline-offset: 2px; }
.work-zoom-controls output { min-width: 50px; text-align: center; }
@media (max-width: 1000px) { .work-photo-grid { columns: 2; column-gap: 20px; } .work-photo-grid:has(> .work-tile:nth-child(3):last-child) { gap: 20px; } }
@media (max-width: 760px) {
 .work-lightbox .work-zoom-controls { left: 12px; }
 .work-media-viewport { height: 62dvh; }
 .work-lightbox figcaption { font-size: .82rem; }
 .work-tile figcaption { padding-bottom: 16px; }
}
@media (max-width: 600px) {
 .work-photo-grid { columns: 1; }
 .work-photo-grid:has(> .work-tile:nth-child(3):last-child) { grid-template-columns: 1fr; gap: 0; }
 .work-album .studio-heading { grid-template-columns: 28px 1fr; gap: 8px 12px; }
 .works-intro { padding-bottom: 36px; }
 .work-tile { margin-bottom: 18px; }
 .work-album + .work-album { margin-top: 44px; }
}
@media (prefers-reduced-motion: reduce) { .work-photo img { transition: none; } }