/* Alternating, closely spaced case groups with each image's own proportions. */
.selected-work-heading{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--grid-gap);align-items:start;margin:0 0 clamp(70px,8vw,130px)}
.selected-work-disciplines{grid-column:1;white-space:nowrap;line-height:1.4;padding-top:8px}
.selected-work-heading h2{grid-column:2/-1;display:flex;align-items:flex-start;gap:24px;font-family:SuisseBPIntl,Helvetica,Arial,sans-serif;font-weight:700;font-size:clamp(48px,5.9vw,100px);line-height:.95;letter-spacing:-.045em;margin:0;text-transform:none}
.selected-work-signal{display:grid;place-items:center;width:.47em;height:.47em;border:1px solid #f9f4eb88;border-radius:50%;margin-top:.03em;flex-shrink:0}
.selected-work-signal i{width:5px;height:5px;background:#c0fe04;border-radius:50%}
body:not(.work-view-grid) .is-selected-layout .selected-cases-row{display:grid;grid-template-columns:repeat(24,minmax(0,1fr));align-items:end;column-gap:clamp(8px,.6vw,12px);margin:0 0 clamp(70px,8vw,140px);padding:0}
body:not(.work-view-grid) .is-selected-layout .work-card{width:100%;padding:0;gap:10px;transform:none!important;will-change:auto;align-self:end}
body:not(.work-view-grid) .is-selected-layout .work-card:nth-child(1){grid-column:1/span 9}
body:not(.work-view-grid) .is-selected-layout .work-card:nth-child(2){grid-column:10/span 6}
body:not(.work-view-grid) .is-selected-layout .work-card:nth-child(3){grid-column:16/span 9}
body:not(.work-view-grid) .is-selected-layout .selected-cases-row[data-pattern="1"]{align-items:start}
body:not(.work-view-grid) .is-selected-layout .selected-cases-row[data-pattern="1"] .work-card{align-self:start}
body:not(.work-view-grid) .is-selected-layout .selected-cases-row[data-pattern="1"] .work-card:nth-child(1){grid-column:1/span 6}
body:not(.work-view-grid) .is-selected-layout .selected-cases-row[data-pattern="1"] .work-card:nth-child(2){margin-top:14vw}
body:not(.work-view-grid) .is-selected-layout .selected-cases-row--last .work-card:last-child{grid-column:19/span 6;margin-top:0;align-self:end}
body:not(.work-view-grid) .is-selected-layout .selected-cases-row--last .work-card:first-child:last-child{grid-column:19/span 6}
body:not(.work-view-grid) .is-selected-layout .work-card-header{order:2;min-height:18px;align-items:baseline;color:var(--paper)}
body:not(.work-view-grid) .is-selected-layout .work-card-client{order:0;margin:0 auto 0 0;text-align:left;max-width:90%;font-size:11px;font-weight:400;line-height:1.3}
body:not(.work-view-grid) .is-selected-layout .work-card-number{order:1;opacity:.45;font-size:10px}
body:not(.work-view-grid) .is-selected-layout .work-media{aspect-ratio:var(--case-ratio,1);background:var(--ink);transform:none}
body:not(.work-view-grid) .is-selected-layout .work-card .work-media .work-cover-image{width:108%;height:108%;left:-4%;top:-4%;object-fit:cover;transform:none!important;will-change:auto}
body:not(.work-view-grid) .is-selected-layout .work-card .work-media .work-hover-image{background:var(--ink)}
body:not(.work-view-grid) .is-selected-layout .work-card-meta{order:3}
@media(min-width:992px) and (prefers-reduced-motion:no-preference){
 body:not(.work-view-grid) .is-selected-layout.has-case-motion .work-media{clip-path:inset(var(--case-mask-top,0%) var(--case-mask-right,0%) var(--case-mask-bottom,0%) var(--case-mask-left,0%));will-change:clip-path}
 body:not(.work-view-grid) .is-selected-layout.has-case-motion .work-card-header{opacity:var(--case-label-opacity,1)}
 body:not(.work-view-grid) .is-selected-layout .work-card:focus-within .work-media{clip-path:inset(0)}
 body:not(.work-view-grid) .is-selected-layout .work-card:focus-within .work-card-header{opacity:1}
}
@media(max-width:991px){
 .selected-work-heading{grid-template-columns:1fr;margin-bottom:56px;gap:24px}
 .selected-work-disciplines{grid-column:1;padding:0}
 .selected-work-heading h2{grid-column:1;font-size:clamp(44px,8vw,72px);gap:18px}
 body:not(.work-view-grid) .is-selected-layout .selected-cases-row{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:40px 20px;margin-bottom:40px}
 body:not(.work-view-grid) .is-selected-layout .selected-cases-row .work-card:nth-child(n){grid-column:auto;margin-top:0;align-self:start}
 body:not(.work-view-grid) .is-selected-layout .selected-cases-row .work-card:nth-child(3){grid-column:2}
 body:not(.work-view-grid) .is-selected-layout .work-card-meta h3{display:none}
 body:not(.work-view-grid) .is-selected-layout .work-card-meta p{font-size:14px}
}
@media(max-width:639px){
 body:not(.work-view-grid) .is-selected-layout .selected-cases-row{grid-template-columns:1fr;gap:44px}
 body:not(.work-view-grid) .is-selected-layout .selected-cases-row .work-card:nth-child(n){grid-column:1}
 body:not(.work-view-grid) .is-selected-layout .work-card-client{font-size:11px}
}

/* Clip the actual hover artwork before fitting it, so source borders never appear in the letterbox. */
.work-section .work-card .work-media{overflow:hidden;border:0;border-radius:0;isolation:isolate}
.work-section .work-hover-frame{position:absolute;inset:0;z-index:1;overflow:hidden;background:var(--ink);pointer-events:none;display:block}
.work-section .work-hover-frame[hidden]{display:none}
/* Fit a clipped source window on whole device pixels, avoiding fractional mask fringes. */
.work-section .work-hover-art{position:absolute;left:50%;top:50%;translate:-50% -50%;overflow:hidden;background:var(--ink);border:0;border-radius:0;line-height:0}
.work-section.is-selected-layout .work-card .work-media .work-hover-frame .work-hover-art .work-hover-image{position:absolute;width:calc(106.383% + 2px);height:calc(106.383% + 2px);max-width:none;left:calc(-3.1915% - 1px);top:calc(-3.1915% - 1px);transform:none!important;translate:none;object-fit:fill!important;clip-path:none;border:0;border-radius:0;background:transparent;will-change:auto}

/* Homepage heading shares the hero’s left gutter and bracketed eyebrow. */
#work .selected-work-heading{margin-left:calc(var(--gutter) - 1.09vw);margin-right:calc(var(--gutter) - 1.09vw);row-gap:24px}
#work .selected-work-heading h2,#work .selected-work-label{grid-column:1/-1}
#work .selected-work-label{display:block;line-height:1.8;font-weight:400}
@media(max-width:991px){#work .selected-work-heading{margin-left:0;margin-right:0}}
