/* FnS-only finishing pass. Match the approved sibling pages without changing
   their shared styles, or the rest of this case study's type hierarchy. */
.fns-case-study.fns-type-unified .case-project-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 20px 28px;
  padding: 38px 2% 46px;
}
.fns-case-study.fns-type-unified .case-project-meta > div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.fns-case-study.fns-type-unified .case-project-meta dt {
  margin: 0;
  color: var(--case-muted);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: normal;
  text-transform: none;
}
.fns-case-study.fns-type-unified .case-project-meta dd {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -.012em;
}

/* Freshness's back-link treatment, using FnS's own accent. */
.fns-case-study .case-back.work-project-link {
  --project-accent: var(--case-blue-ink);
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 0;
  padding-bottom: .52rem;
  border-bottom: 0;
  text-decoration: none;
  gap: .68rem;
  color: var(--portfolio-ink);
  font-size: 1.125rem;
  font-weight: 650;
  line-height: 1.25;
  transition: color .2s var(--ease-out);
}
.fns-case-study .case-back.work-project-link > span {
  display: inline-block;
  font-size: 1.2rem;
  transition: transform .25s var(--ease-out);
}
.fns-case-study .case-back.work-project-link:is(:hover, :focus-visible) {
  color: var(--case-blue-ink);
}
.fns-case-study .case-back.work-project-link:focus-visible {
  outline-color: var(--case-blue-ink);
}
.fns-case-study .case-back.work-project-link:hover > span { transform: translateX(-2px); }
.fns-case-study .case-back.work-project-link:active > span { transform: translateX(-1px); }

/* Keep the soft tint, but make every edge fully transparent inside its bounds.
   The previous off-centre gradients were clipped before reaching transparency. */
.fns-case-study .story-special-stage::before {
  inset: -40px 0 -70px;
  pointer-events: none;
  background:
    radial-gradient(ellipse 60% 42% at 34% 44%, #eaf6fb 0%, rgba(234, 246, 251, .6) 35%, rgba(234, 246, 251, 0) 100%),
    radial-gradient(ellipse 45% 42% at 70% 55%, #f1edff 0%, rgba(241, 237, 255, .5) 35%, rgba(241, 237, 255, 0) 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
@media (max-width: 1121px) {
  .fns-case-study .case-back.work-project-link { font-size: 1rem; }
}
@media (max-width: 767px) {
  .fns-case-study.fns-type-unified .case-project-meta {
    flex-direction: column;
    gap: 16px;
    padding: 26px 0 34px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .fns-case-study .case-back.work-project-link,
  .fns-case-study .case-back.work-project-link > span { transition: none; }
  .fns-case-study .case-back.work-project-link:is(:hover, :active) > span { transform: none; }
}