/* Client work only: supporting references beside the delivered imagery. */
#work.case-gallery>.case-story{display:grid;grid-template-columns:minmax(160px,22%) minmax(0,1fr);column-gap:28px;row-gap:20px;padding-block:28px;align-items:start}
#work>.case-story>.case-heading{grid-column:1/-1;display:flex;gap:16px;align-items:baseline;margin:0}
#work>.case-story>.case-heading h3{font-size:28px;line-height:34px}#work>.case-story>.case-heading p{margin:0 0 0 auto;max-width:55%;font-size:14px;line-height:22px}
#work>.case-story>.case-context{display:flex;flex-direction:column;align-items:stretch;gap:14px;min-width:0;width:100%}
#work .case-context .case-reference{display:block;flex:none;width:100%;min-width:0}
#work .case-context .media-label,#work .case-results>.media-label{display:block;min-height:40px;line-height:20px;padding:0 0 8px;margin:0 0 12px;border-bottom:1px solid var(--line);font-size:12px;flex:none;width:auto}
#work .case-context .reference-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:start}
#work .case-context .reference-strip .image-open{display:block;width:100%;height:clamp(100px,15svh,150px);min-width:0;margin:0;flex:none}
#work .case-context .reference-strip img{width:100%;height:100%;object-fit:contain}
#work .case-context .case-actions{margin:0;align-self:start;white-space:normal}#work .case-context .text-link{font-size:12px;line-height:20px}
#work>.case-story>.case-results{grid-column:2;min-width:0;width:100%}
#work .case-results .media-stage{height:clamp(300px,46svh,500px)}
#work .result-gallery{max-width:none;margin:0}#work .result-scroll{gap:12px}#work .result-scroll>div{flex:0 0 calc((100% - 24px)/3);min-width:0}
#work .result-scroll:has(>div:last-child:nth-child(2))>div{flex-basis:calc((100% - 12px)/2)}
#work .rail-navigation{margin-top:8px}
@media(min-width:768px) and (max-width:1023px){#work.case-gallery>.case-story{grid-template-columns:minmax(140px,23%) minmax(0,1fr);column-gap:20px}#work .result-scroll>div{flex-basis:calc((100% - 12px)/2)}}
@media(max-width:767px){
 #work.case-gallery>.case-story{grid-template-columns:84px minmax(0,1fr);column-gap:14px;row-gap:14px;padding-block:24px}
 #work>.case-story>.case-heading{flex-wrap:wrap;gap:4px 10px}#work>.case-story>.case-heading h3{font-size:24px;line-height:30px}#work>.case-story>.case-heading p{width:100%;max-width:none;margin:0;font-size:13px;line-height:20px}
 #work .case-context .media-label,#work .case-results>.media-label{min-height:48px;margin-bottom:10px;font-size:11px;line-height:18px;padding-bottom:8px}
 #work .case-context .reference-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
 #work .case-context .reference-strip .image-open{height:62px}
 #work .case-context .case-actions{margin:0}#work .case-context .text-link{font-size:11px;line-height:18px}
 #work .case-results .media-stage{height:clamp(270px,40svh,340px)}
 #work .result-scroll>div,#work .result-scroll:has(>div:last-child:nth-child(2))>div,#work .case-story[data-case="9"] .result-scroll>div{flex-basis:92%}
 #work .result-scroll{gap:10px}#work .rail-navigation{gap:8px}#work .rail-navigation button{width:32px;height:32px}
}