/* Randorff 1.8.5.319 — Work surfaces, readable text and card rhythm.
   Loaded after NET and legacy Work styles. Artwork backgrounds remain intact. */
:root { --randorff-work-surface:#F8F8F7; --randorff-work-ink:#383838; }

/* Homepage: four white cards on the same light grey as the cases. */
.home-work { background:#F8F8F7 !important; }
.home-work .project-grid .project-card-body h3 {
  font-size:clamp(29px,2.7vw,44px);
  line-height:.99;
  max-width:none;
  margin-top:14px;
  margin-bottom:14px;
  overflow-wrap:normal;
}
.home-work .project-grid .project-card-body .project-meta,
.home-work .project-grid .project-card-body p,
.home-work .project-grid .project-card-body h3,
.home-work .project-grid .project-card.tall .project-card-body h3,
.home-work .project-grid .project-card.tall .project-card-body p,
.home-work .project-grid .project-card.tall .project-card-body .project-meta {color:#383838 !important;}
@media(max-width:900px){
  .home-work .project-grid .project-card-body h3 {font-size:clamp(28px,5.8vw,44px);}
}
@media(max-width:520px){
  .home-work .project-grid .project-card-body h3 {font-size:clamp(25px,6vw,37px);}
}

/* All work cases: light-grey background, consistent dark editorial copy. */
.work-feature,
.work-feature.net,
.work-feature.borg,
.work-feature.tall,
.work-feature.guld,
.work-feature.great,
.work-feature.explainer {background:#F8F8F7 !important;color:#383838 !important;}

/* NET's embedded root used to paint its own ForrestHope surface. */
.work-feature.net #randorff-net-case {background:#F8F8F7 !important; color:#383838 !important;}
.work-feature.net #randorff-net-case .grid > .case-intro .case-intro-copy,
.work-feature.net #randorff-net-case .case-intro-copy,
.work-feature.net #randorff-net-case .case-intro-copy h1,
.work-feature.net #randorff-net-case .case-intro-copy p,
.work-feature.net #randorff-net-case .grid > .net-narrative,
.work-feature.net #randorff-net-case .net-narrative-column h2,
.work-feature.net #randorff-net-case .net-narrative-column p,
.work-feature.net #randorff-net-case .grid > .net-added-card-text p,
.work-feature.net #randorff-net-case .grid > .core-explainer,
.work-feature.net #randorff-net-case .grid > .core-explainer .core-explainer-eyebrow,
.work-feature.net #randorff-net-case .grid > .core-explainer h2,
.work-feature.net #randorff-net-case .core-explainer-content > p:not(.core-explainer-eyebrow) {color:#383838 !important;}

/* Explainer had several explicitly white headings/captions. */
.work-feature.explainer .feature-copy,
.work-feature.explainer .feature-copy .eyebrow,
.work-feature.explainer .feature-copy h2,
.work-feature.explainer .feature-copy p,
.work-feature.explainer .explainer-showcase,
.work-feature.explainer .explainer-content-heading,
.work-feature.explainer .explainer-film-caption,
.work-feature.explainer .explainer-character-name {color:#383838 !important;}

/* Unified dark outline buttons on light case backgrounds, with matching hover. */
.work-feature .feature-more-toggle,
.work-feature .case-close-button,
.work-feature.net #randorff-net-case .case-button,
.work-feature.net #randorff-net-case a.core-explainer-button {
  color:#383838 !important;
  border:1px solid #383838 !important;
  background:transparent !important;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
}
.work-feature .feature-more-toggle:is(:hover,:focus-visible),
.work-feature .case-close-button:is(:hover,:focus-visible),
.work-feature.net #randorff-net-case .case-button:is(:hover,:focus-visible),
.work-feature.net #randorff-net-case a.core-explainer-button:is(:hover,:focus-visible) {
  color:#fff !important;
  background:#383838 !important;
  border-color:#383838 !important;
}