/* Approved Editorial case-study popup. */
#projectDialog:has(.case-study){width:min(1140px,calc(100vw - 48px));max-height:92svh;padding:0;border-radius:12px;scrollbar-width:thin}
#projectDialog:has(.case-study) .dialog-close{z-index:4;right:18px;top:16px;font-size:13px;min-height:40px}
.case-kicker,.case-study h4{font:10px/1.4 Arial,sans-serif;text-transform:uppercase;letter-spacing:.14em}
.case-sheet{padding:64px 32px 32px;display:grid;gap:24px 32px;grid-template-columns:1.2fr 1fr;grid-template-areas:'media heading' 'media body' 'media footer'}
.case-heading{grid-area:heading}.case-kicker{margin:0 0 12px;opacity:.65}
.case-study h3{font-size:clamp(28px,3vw,44px);line-height:1.02;letter-spacing:-.045em;margin:0;font-weight:600}
.case-deck{font-size:17px;line-height:1.35;letter-spacing:-.02em;margin:12px 0 0;opacity:.7}
.case-figure{grid-area:media;margin:0;min-width:0;display:flex;flex-direction:column;gap:12px}
:is(#projectDialog,#profileNote) .case-media{display:block;position:relative;width:100%;height:100%;min-height:260px;max-height:530px;aspect-ratio:auto;border-radius:3px;overflow:hidden;background:color-mix(in srgb,var(--blue) 5%,var(--cream))}
:is(#projectDialog,#profileNote) .case-media>img{display:block;width:100%;height:100%;max-height:530px;object-fit:contain;padding:0}
:is(#projectDialog,#profileNote) .case-media.transnomadica-art{background:#e8e5de;min-height:410px}
:is(#projectDialog,#profileNote) .case-media.transnomadica-art .tn-object{position:absolute;width:auto;height:80%;max-height:80%;left:50%;top:10%;transform:translateX(-50%)}
:is(#projectDialog,#profileNote) .case-media.transnomadica-art .tn-logo{position:absolute;left:10%;bottom:10%;width:80%;height:auto;max-height:20%}
.case-body{grid-area:body;display:grid;gap:18px;align-content:start}.case-study h4{margin:0 0 7px;opacity:.65}
.case-body p{font-size:14px;line-height:1.65;margin:0;max-width:58ch}
.case-footer{grid-area:footer;align-self:end;border-top:1px solid color-mix(in srgb,currentColor 20%,transparent);padding-top:16px}
.case-services{font-size:11px;line-height:1.6;text-transform:uppercase;letter-spacing:.05em;margin:0 0 9px;white-space:pre-line}
.case-credit,.case-archive-note{font-size:11px;line-height:1.5;margin:0;opacity:.65}
.case-source{margin:17px 0 0}.case-source a{display:inline-flex;align-items:center;min-height:42px;border:1px solid currentColor;border-radius:30px;padding:9px 17px;color:inherit;text-decoration:none;font-size:13px;transition:opacity .2s}.case-source a:hover{opacity:.65}
.case-thumbs{display:flex;gap:8px;flex-wrap:wrap}.case-thumbs button{padding:3px;appearance:none;background:none;border:1px solid transparent;border-radius:2px;cursor:pointer;width:48px;height:48px}.case-thumbs button[aria-pressed=true]{border-color:currentColor}.case-thumbs img{width:100%;height:100%;object-fit:cover}
@media(max-width:740px){
 #projectDialog:has(.case-study){width:calc(100vw - 20px);max-height:94svh}
 #projectDialog:has(.case-study) .dialog-close{right:9px;top:12px}
 .case-sheet{grid-template-columns:1fr;grid-template-areas:'heading' 'media' 'body' 'footer';padding:62px 22px 22px;gap:22px}
 :is(#projectDialog,#profileNote) .case-media{height:300px;min-height:0;max-height:40svh}
 :is(#projectDialog,#profileNote) .case-media>img{max-height:40svh}
 :is(#projectDialog,#profileNote) .case-media.transnomadica-art{min-height:280px}
}
.case-thumbs button:focus-visible{outline:2px solid currentColor;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.case-source a{transition:none}}

/* Photography previews use a cover crop; Strong's pair is revealed in its popup only. */
.project-photography .project-image>img{object-fit:cover}
.project-image.diptych{display:block;aspect-ratio:4/3;background:#111}
.project-image.diptych>img+img{display:none}
:is(#projectDialog,#profileNote) .case-photography .case-media:not(.diptych)>img{object-fit:cover}
:is(#projectDialog,#profileNote) .case-media.diptych{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;min-height:0;height:auto;max-height:none;aspect-ratio:3/2;background:#111;align-self:center}
:is(#projectDialog,#profileNote) .case-media.diptych>img{display:block;min-width:0;width:100%;height:100%;max-height:none;object-fit:cover;transform:none}
.case-figure:has(.diptych){justify-content:center}

/* Full-bleed image previews; preserve standalone identity artwork. */
.project-cover .project-image>img{object-fit:cover;padding:0}
.project-run-la .project-image>img{object-position:center 72%}
:is(#projectDialog,#profileNote) .case-photography .case-media>img{object-position:var(--photo-position,center)}
:is(#projectDialog,#profileNote) .case-cover .case-media>img,:is(#projectDialog,#profileNote) .case-media.project-video-preview>img{object-fit:cover;padding:0}
.project-darren .project-image>img{object-fit:cover}

/* Keep the small original identity crisp, with breathing room in every preview. */
.project-image>img[src$="/JJ-Logo.png"],
:is(#projectDialog,#profileNote) .case-media>img[src$="/JJ-Logo.png"]{
 position:absolute;left:50%;top:50%;width:min(42%,160px);height:auto;max-height:50%;
 object-fit:contain;padding:0;transform:translate(-50%,-50%)!important;
}

.case-source{display:flex;flex-wrap:wrap;gap:8px}

/* Switching gallery images must not tween the logo-centering transform. */
:is(#projectDialog,#profileNote) .case-media>img{transition:none}