.works{position:relative;min-height:100svh;background:var(--ink);color:var(--paper);padding:76px 6vw 40px;scroll-margin-top:0;overflow-anchor:none}
.works-label{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:18px;font-size:11px;letter-spacing:.14em}
.works-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin:48px 0 38px}
.works-heading h2{font:500 clamp(42px,6.4vw,90px)/1.1 'Songti SC','STSong',serif;letter-spacing:-.04em;margin:0}
.works-heading p{margin:0 0 4px;font-size:12px;opacity:.65;letter-spacing:.08em}
.work-deck{display:grid;gap:46px}
.work-feature{display:block;color:inherit;text-decoration:none;outline-offset:6px;min-width:0}
.work-feature[hidden]{display:none!important}
.work-cover{position:relative;background:transparent}
.work-cover img{width:100%;height:auto;display:block;object-fit:contain}
.work-cover .work-open{position:absolute;right:24px;bottom:22px;min-width:48px;min-height:48px;display:grid;place-items:center;border-radius:50%;background:var(--ink);color:var(--paper);font-size:24px;transition:background .2s,color .2s,transform .2s}
.work-feature:hover .work-open{background:var(--accent);color:var(--ink);transform:rotate(45deg)}
.work-meta{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:16px;padding:25px 0 32px;border-bottom:1px solid var(--line);align-items:start}
.work-number{font-size:11px;opacity:.6;padding-top:5px}
.work-meta h3{font:500 clamp(22px,3vw,38px)/1.2 'Helvetica Neue',sans-serif;letter-spacing:-.03em;margin:0 0 10px}
.work-meta p{font-size:12px;opacity:.7;margin:0;line-height:1.8;text-wrap:pretty}
.work-meta .work-category{text-align:right;font-size:11px;letter-spacing:.06em;padding-top:5px}
.works-foot{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:34px;font-size:11px;letter-spacing:.08em}
.works-foot a{color:inherit;text-underline-offset:6px;min-height:44px;display:inline-flex;align-items:center}
.nav .text-button{min-height:44px;display:inline-flex;align-items:center}
.concept-label{position:absolute;top:12px;right:12px;background:var(--ink);color:var(--accent);border:1px solid var(--line);padding:5px 10px;font-size:10px;letter-spacing:.08em}
.work-navigation{display:flex;align-items:center;gap:16px;font-size:11px;font-variant-numeric:tabular-nums}
.work-navigation[hidden]{display:none}
.work-navigation button{width:44px;height:44px;padding:0;border:1px solid var(--line);background:transparent;border-radius:50%;color:var(--paper);font-size:20px;transition:background .2s,color .2s}
.work-navigation button:hover:not(:disabled){background:var(--paper);color:var(--ink)}
.work-navigation button:disabled{opacity:.25}
.works:not(.has-motion) .work-navigation{display:none}
.works.has-motion{height:calc(100svh + var(--work-travel,0px));padding:0 6vw;min-height:100svh}
.works.has-motion .works-scene{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;padding:24px 0 16px}
.works.has-motion .works-label{font-size:10px;padding-bottom:12px;flex-shrink:0}
.works.has-motion .works-heading{margin:18px 0 16px;flex-shrink:0}
.works.has-motion .works-heading h2{font-size:clamp(36px,3.6vw,58px)}
.works.has-motion .works-heading p{font-size:11px}
.works.has-motion .works-filters{margin:0 0 12px;flex-shrink:0}
.works.has-motion .works-filters button{min-height:36px}
.works.has-motion .work-deck{display:block;position:relative;flex:1;min-height:0;perspective:1600px;overflow:hidden;width:calc(100% + 12vw);margin-left:-6vw;isolation:isolate}
.works.has-motion .work-feature{position:absolute;left:50%;top:50%;width:min(72vw,calc((100svh - 370px)*1.777778));transform-origin:center;will-change:transform;backface-visibility:hidden;background:var(--ink)}
.works.has-motion .work-feature:not(.is-current){pointer-events:none}
.works.has-motion .work-meta{grid-template-columns:25px minmax(0,1fr) auto;gap:12px;padding:14px 14px 16px;border:1px solid var(--line);border-top:0}
.works.has-motion .work-meta h3{font-size:clamp(22px,2.1vw,30px);margin-bottom:6px}
.works.has-motion .work-meta p{font-size:10px;line-height:1.7}
.works.has-motion .work-category{font-size:8px;line-height:1.9;max-width:130px}
.works.has-motion .work-open{min-width:42px;min-height:42px;font-size:22px;right:16px;bottom:16px}
.works.has-motion .works-foot{margin-top:12px;flex-shrink:0;position:relative;z-index:2}
@media(max-width:900px),(max-height:599px){.works{padding-top:48px}.works-label{font-size:9px}.works-heading{display:block;margin:32px 0 24px}.works-heading h2{font-size:clamp(38px,6vw,64px)}.works-heading p{margin-top:15px;font-size:11px}.work-meta{grid-template-columns:25px minmax(0,1fr);gap:10px;padding:20px 0 24px}.work-meta .work-category{grid-column:2;text-align:left;padding-top:0}.work-meta h3{font-size:25px}.work-cover .work-open{right:12px;bottom:12px}.works-foot{font-size:9px;gap:16px}.concept-label{font-size:9px}.work-deck{gap:36px}}
@media(prefers-reduced-motion:reduce){.work-cover .work-open,.work-navigation button{transition:none}.work-feature:hover .work-open{transform:none}}