/* Work details keep the site's paper, typography and generous spacing. */
.work-page__main {
  padding: calc(var(--nav-h) + clamp(64px, 7vw, 112px)) var(--gutter) clamp(90px, 11vw, 170px);
}
.work-page__inner { max-width: 1720px; margin: 0 auto; }
.work-page__back {
  display: inline-flex; align-items: center; gap: .7em;
  margin-bottom: clamp(48px, 7vw, 96px); color: var(--ink-2);
  font-size: 13px; text-decoration: underline; text-underline-offset: 4px;
}
.work-page__back:hover { color: var(--accent); }
.work-page__heading, .work-page__list {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter);
}
.work-page__eyebrow { grid-column: 1 / -1; margin-bottom: clamp(24px, 3vw, 44px); }
.work-page__title {
  grid-column: 1 / span 8; margin: 0;
  font-family: var(--f-display); font-weight: 800;
  font-size: clamp(52px, 7vw, 120px); line-height: .96; letter-spacing: -.01em;
  text-transform: uppercase; overflow-wrap: anywhere;
}
html:lang(zh-Hant) .work-page__title, html:lang(ja) .work-page__title {
  font-weight: 900; font-size: clamp(42px, 5vw, 88px); line-height: 1.16; letter-spacing: -.035em;
}
.work-page__lead {
  grid-column: 9 / -1; align-self: end; max-width: 34em; margin: 0 0 .25em;
  font-size: clamp(15px, 1.05vw, 18px); line-height: 1.8;
}
.work-page__list { margin-top: clamp(80px, 10vw, 160px); }
.work-entry { grid-column: 5 / -1; padding: 0 0 clamp(54px, 6.5vw, 94px); }
.work-entry__link {
  display: flex; width: 100%; justify-content: space-between; align-items: baseline;
  gap: 20px; text-align: left; cursor: pointer;
}
.work-entry__title {
  font-family: var(--f-display); font-weight: 700;
  font-size: clamp(25px, 2.6vw, 42px); line-height: 1.18;
}
html:lang(zh-Hant) .work-entry__title, html:lang(ja) .work-entry__title {
  font-size: clamp(22px, 1.9vw, 31px); line-height: 1.4;
}
.work-entry__action { flex: none; color: var(--ink-2); font-size: 13px; white-space: nowrap; }
.work-entry__link:hover .work-entry__title, .work-entry__link:hover .work-entry__action { color: var(--accent); }
.work-entry__description { max-width: 58ch; margin: 12px 0 0; color: var(--ink-2); font-size: clamp(15px, 1.05vw, 17px); line-height: 1.85; }

@media (max-width: 860px) {
  .work-page__title, .work-page__lead, .work-entry { grid-column: 1 / -1; }
  .work-page__lead { margin-top: 26px; max-width: 42em; }
}
