/* Homepage: named designer portfolios, original photographs only. */
.designer-puzzle .designer-work-media{position:absolute;inset:0 0 31px;overflow:hidden;background:#d8d9d3}
.designer-puzzle .designer-work-media>img{position:absolute;max-width:none;object-fit:contain;opacity:0;transition:opacity .12s linear;pointer-events:none}
.designer-puzzle .designer-work-media>img.is-visible{opacity:1}
.designer-puzzle .core-puzzle__tile{background:#20251f}
.designer-puzzle .core-puzzle__tile:after{display:none}
.designer-puzzle .core-puzzle__tile>span{left:12px;right:8px;bottom:7px;font-size:12px;line-height:1.3;letter-spacing:0;color:#fff}
.designer-puzzle .core-puzzle__tile small{font-size:10px;margin-left:6px;opacity:.7}
.consult-hero__photo--designer figcaption{padding-right:96px}
.consult-hero__photo--designer figcaption>span{letter-spacing:.02em}
.designer-puzzle-toggle{position:absolute;right:0;bottom:0;border:0;background:transparent;color:inherit;font:inherit;font-size:11px;min-height:35px;padding:5px 0;cursor:pointer;opacity:.85}
.designer-puzzle-toggle:focus-visible{outline:2px solid currentColor;outline-offset:3px}
@media(max-width:700px){.designer-puzzle .core-puzzle__tile>span{left:9px;font-size:11px}.designer-puzzle .core-puzzle__tile small{font-size:8px}.consult-hero__photo--designer figcaption{padding-right:80px}.designer-puzzle-toggle{font-size:10px}}
@media(prefers-reduced-motion:reduce){.designer-puzzle .designer-work-media>img{transition:none}}

.designer-puzzle .designer-work-media:before{content:"";position:absolute;inset:-15px;background-image:var(--work-backdrop);background-position:center;background-size:cover;filter:blur(18px);opacity:.22;pointer-events:none}

/* Three active portfolios: one full-width row, then two equal cards. */
.designer-puzzle>.core-puzzle__tile:first-child{grid-column:1 / -1}

/* Finished-work videos: keep the outgoing frame during the dissolve. */
.designer-puzzle .designer-work-media>img{inset:0;width:100%;height:100%;opacity:1;object-fit:contain}
.designer-puzzle .designer-work-media.has-active>img{opacity:0}
.designer-puzzle .designer-work-media>video{position:absolute;left:50%;top:50%;height:auto;max-width:none;object-fit:contain;opacity:0;pointer-events:none;transition:opacity .66s cubic-bezier(.22,.61,.36,1);transform-origin:0 0;will-change:transform,width}
.designer-puzzle .designer-work-media>video.is-visible{opacity:1}
.designer-puzzle .designer-work-media .core-stage-label{display:none}
@media(prefers-reduced-motion:reduce){.designer-puzzle .designer-work-media>video{transition:none}.designer-puzzle .designer-work-media:not(.motion-enabled)>video{display:none}.designer-puzzle .designer-work-media.has-active:not(.motion-enabled)>img{opacity:1}.designer-puzzle .designer-work-media:not(.motion-enabled)>.rotation-hold{display:none}}

/* Keep a still of the outgoing frame underneath the next clip. */
.designer-puzzle .designer-work-media>.rotation-hold{position:absolute;left:50%;top:50%;height:auto;max-width:none;object-fit:contain;transform-origin:0 0;opacity:0;pointer-events:none}
.designer-puzzle .designer-work-media>.rotation-hold.is-visible{opacity:1}
.designer-puzzle .designer-work-media>video.is-loading{opacity:0;transition:none}

/* Use the same hair/chin/neck envelope before and after playback starts. */
.designer-puzzle .designer-work-media>img.is-framed{inset:auto;left:50%;top:46%;height:auto;object-fit:contain;object-position:center;transform-origin:0 0}
.designer-puzzle .designer-work-media>video,.designer-puzzle .designer-work-media>.rotation-hold{top:46%}