/* A considered sequence of covers, built around the work's own formats. */
.work-section{padding:112px var(--gutter) 140px;max-width:1920px;scroll-margin-top:0}
.work-heading{padding:0 0 54px}
.work-heading-top{display:flex;justify-content:space-between;gap:30px;margin-bottom:38px;font-size:12px;line-height:1.5;color:var(--muted)}
.work-heading-top>span:first-child{color:var(--ink)}
.work-heading h2{font-size:clamp(76px,12.2vw,205px);font-weight:400;letter-spacing:-.065em;line-height:.92;white-space:nowrap}
.work-heading h2>span{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;letter-spacing:-.085em}
.work-wayfinding{position:sticky;top:0;z-index:4;display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:62px;background:var(--paper);border-top:1px solid var(--ink);border-bottom:1px solid var(--line);font-size:12px;margin-bottom:34px}
.work-wayfinding a{display:inline-flex;align-items:center;gap:15px;min-height:48px}
.work-wayfinding a:last-child span{font-size:18px}
.work-current{font-variant-numeric:tabular-nums;color:var(--muted);text-align:center}
.project-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:120px 28px;align-items:start}
.project-grid>.work-card{display:block;min-width:0;width:auto;margin:0;grid-column:auto;position:relative}
.project-grid>.work-card--lead{grid-column:1/-1}
.project-grid>.work-card--platform{grid-column:1/6;margin-top:5px}
.project-grid>.work-card--commercial{grid-column:7/13;margin-top:145px}
.project-grid>.work-card--portrait{grid-column:1/8}
.project-grid>.work-card--performance{grid-column:9/13;margin-top:185px}
.project-grid>.work-card--immersive{grid-column:1/-1;margin-top:20px}
.project-grid>.work-card--spatial{grid-column:4/13;margin-top:0}
.work-card-top{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:0 0 16px;font-size:11px;line-height:1.4}
.work-card-top>span:first-child{display:flex;gap:28px;align-items:baseline}
.work-card-top>span:last-child{color:var(--muted);white-space:nowrap}
.work-number{color:var(--muted);font-variant-numeric:tabular-nums}
.work-visual{position:relative;isolation:isolate;background:#e5e5df;overflow:hidden}
.work-image{aspect-ratio:1.6;position:relative;overflow:hidden}
.work-image>img{height:100%;width:100%;object-fit:cover;transition:transform 1.05s var(--ease)}
.work-card--lead .work-image{aspect-ratio:1.95;background:#94d69c}
.work-card--lead .work-image>img{object-position:50% 45%}
.work-inset{position:absolute;right:24px;bottom:23px;width:25%;background:#171717;color:#fff;box-shadow:0 5px 30px #0002;transform:translateY(0);transition:transform 1s var(--ease)}
.work-inset img{aspect-ratio:1.91;object-fit:cover}
.work-inset>span{display:block;padding:9px 12px;font-size:10px;line-height:1.35}
.work-lead-note{display:none}
.work-platform{position:relative;aspect-ratio:.91;background:#dddcd5;overflow:hidden}
.work-platform-wordmark{position:absolute;width:30%;left:8%;top:8%;mix-blend-mode:multiply}
.work-platform-desktop{position:absolute;width:91%;left:8%;top:29%;box-shadow:0 8px 25px #17171715;transition:transform 1s var(--ease)}
.work-platform-phone{position:absolute;width:27%;left:9%;bottom:8%;border-radius:14% / 7%;overflow:hidden;box-shadow:0 8px 20px #17171714;transition:transform 1s var(--ease)}
.work-platform-phone img{transform:scale(1.045)}
.work-platform-note{position:absolute;bottom:10%;right:8%;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(18px,1.75vw,27px);letter-spacing:-.05em}
.work-card--commercial .work-image{aspect-ratio:1.33}
.work-card--commercial .work-image>img{object-position:55% 50%}
.work-card--portrait .work-image{aspect-ratio:1.43}
.work-card--performance .work-image{aspect-ratio:.78}
.work-card--performance .work-image>img{object-position:82% 50%}
.work-card--immersive .work-image{aspect-ratio:1.94;background:#161616}
.work-card--spatial .work-image{aspect-ratio:2.25;background:#161616}
.work-explore{position:absolute;z-index:3;right:22px;bottom:22px;display:flex;gap:24px;align-items:center;padding:13px 16px;background:var(--paper);color:var(--ink);font-size:12px;opacity:0;transform:translateY(7px);transition:opacity .3s,transform .4s var(--ease)}
.work-explore>span{font-size:18px;line-height:1}
.work-card--lead .work-explore{right:auto;left:22px}
.work-caption{padding-top:22px}
.work-title-row{display:flex;align-items:baseline;justify-content:space-between;gap:22px}
.work-title-row h3{font-size:clamp(30px,3.35vw,52px);font-weight:400;letter-spacing:-.055em;line-height:1.1}
.work-arrow{display:inline-block;font-size:29px;font-weight:400;line-height:1;transition:transform .45s var(--ease)}
.work-note{margin-top:12px;font-size:15px;letter-spacing:-.01em;line-height:1.5}
.work-role{margin-top:18px;color:var(--muted);font-size:12px;line-height:1.7}
.work-detail{display:block;margin-top:22px;padding-top:16px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);line-height:1.5}
.work-card--lead .work-caption,.work-card--immersive .work-caption{display:grid;grid-template-columns:1fr 1fr;column-gap:42px}
.work-card--lead .work-title-row,.work-card--immersive .work-title-row{grid-row:1/3}
.work-card--lead .work-title-row h3,.work-card--immersive .work-title-row h3{font-size:clamp(48px,5.8vw,88px)}
.work-card--lead .work-title-row .work-arrow,.work-card--immersive .work-title-row .work-arrow{display:none}
.work-card--lead .work-note,.work-card--immersive .work-note{font-size:clamp(19px,2.05vw,30px);line-height:1.25;margin-top:5px;letter-spacing:-.025em}
.work-card--lead .work-role,.work-card--immersive .work-role{margin-top:13px}
.work-card--lead .work-detail,.work-card--immersive .work-detail{margin-left:calc(50% + 21px)}
.work-card--performance .work-title-row h3{font-size:clamp(30px,3.1vw,48px)}
.work-card--immersive .work-title-row h3{max-width:8.5em}
.work-card--spatial::before{content:'07 / Spatial studies';position:absolute;right:calc(100% + 28px);top:0;width:calc(33.333% - 10px);font-size:11px;line-height:1.5;color:var(--muted)}
.work-card:focus-visible{outline-offset:10px}
.work-card:focus-visible .work-explore{opacity:1;transform:none}
@media(hover:hover) and (pointer:fine){
  .work-card:hover .work-image>img{transform:scale(1.025)}
  .work-card:hover .work-arrow{transform:translate(4px,-4px)}
  .work-card:hover .work-explore{opacity:1;transform:none}
  .work-card:hover .work-inset{transform:translateY(-5px)}
  .work-card:hover .work-platform-desktop{transform:translateY(-4px)}
  .work-card:hover .work-platform-phone{transform:translateY(-9px)}
}
@media(min-width:1600px){.project-grid{column-gap:38px;row-gap:150px}.work-card-top,.work-role,.work-detail{font-size:12px}}
@media(max-width:1050px){
  .work-section{padding-top:90px;padding-bottom:100px}
  .project-grid{gap:85px 22px}
  .project-grid>.work-card--commercial{grid-column:7/13;margin-top:100px}
  .project-grid>.work-card--performance{grid-column:9/13;margin-top:110px}
  .work-inset{right:16px;bottom:16px;width:27%}
  .work-card-top>span:first-child{gap:18px}
  .work-card--spatial::before{right:calc(100% + 22px)}
}
@media(max-width:700px){
  .work-section{padding-top:68px;padding-bottom:80px}
  .work-heading{padding-bottom:28px}
  .work-heading-top{margin-bottom:26px;font-size:11px;gap:22px}
  .work-heading-top>span:last-child{max-width:180px;text-align:right}
  .work-heading h2{font-size:12.2vw;letter-spacing:-.07em;line-height:1.03}
  .work-wayfinding{min-height:56px;gap:14px;font-size:11px;margin-bottom:25px}
  .work-wayfinding>a:first-child{display:none}
  .work-current{text-align:left;max-width:62%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .work-wayfinding a{gap:8px;flex-shrink:0}
  .project-grid{display:flex;flex-direction:column;gap:62px}
  .project-grid>.work-card{width:100%;margin:0}
  .work-card-top{padding-bottom:12px;font-size:11px;gap:12px}
  .work-card-top>span:first-child{gap:18px}
  .work-card--lead .work-image{aspect-ratio:1;background:#171717}
  .work-card--lead .work-image>img{position:relative;width:100%;height:auto;object-fit:contain}
  .work-lead-note{display:block;position:absolute;bottom:24px;left:15px;color:var(--paper);font-size:10px;line-height:1.4}
  .work-lead-note>span{display:block;font-size:39px;letter-spacing:-.07em;line-height:1.05;margin-bottom:8px}
  .work-inset{right:13px;bottom:13px;width:49%}
  .work-inset>span{font-size:8px;padding:7px 8px}
  .work-platform{aspect-ratio:1.02}
  .work-platform-note{font-size:23px}
  .work-platform-desktop{top:27%}
  .work-card--commercial .work-image{aspect-ratio:1.12}
  .work-card--portrait .work-image{aspect-ratio:1.24}
  .work-card--performance .work-image{aspect-ratio:1.1}
  .work-card--immersive .work-image{aspect-ratio:1.05}
  .work-card--immersive .work-image>img{object-position:48% 50%}
  .work-card--spatial .work-image{aspect-ratio:1.65}
  .work-card--spatial::before{content:none}
  .work-caption{padding-top:18px}
  .work-title-row h3,.work-card--performance .work-title-row h3{font-size:clamp(30px,7.9vw,46px)}
  .work-arrow{font-size:27px}
  .work-note{font-size:14px;margin-top:10px;line-height:1.5}
  .work-role{font-size:12px;margin-top:13px}
  .work-detail{font-size:11px;margin-top:18px;padding-top:12px}
  .work-card--lead .work-caption,.work-card--immersive .work-caption{display:block}
  .work-card--lead .work-title-row h3,.work-card--immersive .work-title-row h3{font-size:clamp(34px,9vw,54px)}
  .work-card--lead .work-title-row .work-arrow,.work-card--immersive .work-title-row .work-arrow{display:block}
  .work-card--lead .work-note,.work-card--immersive .work-note{font-size:16px;margin-top:11px;line-height:1.4}
  .work-card--lead .work-detail,.work-card--immersive .work-detail{margin-left:0}
  .work-explore{display:none}
}
@media(prefers-reduced-motion:reduce){.work-card *{transition:none!important}}
