/* Approved matte graphite illustration series. Diptychs keep their source pixels:
   categories display the light half; the original hero art is unchanged. */
.graphite-category { isolation:isolate; }
.graphite-category .category-art-stage {
  position:absolute;
  inset:88px 0 0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  container-type:size;
}
.graphite-category[data-featured="true"] .category-art-stage { top:150px; }
.graphite-category .category-art {
  display:block;
  position:relative;
  flex:none;
  width:min(100cqw, 150cqh);
  aspect-ratio:3 / 2;
  overflow:hidden;
  mix-blend-mode:darken;
  transform-origin:50% 60%;
}
.graphite-category .category-art img {
  display:block;
  position:absolute;
  top:0;
  left:0;
  width:calc(200% + 2px);
  max-width:none;
  height:100%;
}
.graphite-category .category-heading { z-index:1; }
.graphite-category[data-featured="true"] .category-heading { max-width:480px; }
.category-more {
  display:flex;
  align-items:baseline;
  gap:16px 24px;
  flex-wrap:wrap;
  margin-top:24px;
  color:#6b7178;
  font-size:13px;
}
.category-more a {
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#343a42;
  text-decoration:none;
  text-underline-offset:4px;
  transition:color 220ms ease;
}
.category-more a:hover { color:#0b47a8;text-decoration:underline; }
.category-more a span { color:#0b47a8; }
@media (prefers-reduced-motion:reduce) {
  .graphite-category .category-art { transition:none !important;transform:none !important; }
  .category-more a { transition:none; }
}