/* Canonical FnS media surfaces. Keep illustration shading, layout, focus rings
   and shared portfolio chrome unchanged. Light falls consistently from above. */
.fns-case-study {
  --fns-media-shadow: 0 12px 28px -16px rgb(31 48 62 / 18%),
                      0 2px 8px -3px rgb(31 48 62 / 7%);
  --fns-device-shadow: 0 14px 28px -14px rgb(31 48 62 / 20%),
                       0 2px 8px -3px rgb(31 48 62 / 8%),
                       0 0 0 1px #e7e9eb;
}

/* One shadow owner per surface, never on a figure containing a caption. */
.fns-case-study .fns-original-card,
.fns-case-study .case-old-flow a,
.fns-case-study .case-exploration-wall a,
.fns-case-study .story-visual-finding figure > a,
.fns-case-study .case-final-player video,
.fns-case-study .case-interview-players video,
.fns-case-study .story-size-proof,
.fns-case-study .fns-weight-screen > a,
.fns-case-study .fns-weight-cart a,
.fns-case-study .story-trust-proof a,
.fns-case-study .story-special-stage figure > a,
.fns-case-study .fns-video-surface {
  box-shadow: var(--fns-media-shadow);
}

/* The gallery's existing device shells retain a fine rim and a little more
   lift. Its flat cart crop uses the same surface treatment as all other crops. */
.fns-case-study .fns-final-journey .case-flow-collage a {
  box-shadow: var(--fns-device-shadow);
}
.fns-case-study .fns-final-journey .case-flow-collage .case-flow-cart a {
  box-shadow: var(--fns-media-shadow);
}

/* This static sheet already crops its image with overflow and the same radius.
   The redundant clip-path also hid its exterior shadow. */
.fns-case-study .story-special-stage figure > .story-special-sheet {
  clip-path: none;
}

/* Preserve the videos' rounded masks, but cast the shadow outside the mask.
   The error message stays beside its video for the existing media handler. */
.fns-case-study .fns-video-surface {
  display: block;
  width: 100%;
  min-width: 0;
  border-radius: 7% / 3.15%;
}
.fns-case-study .fns-video-surface > video {
  box-shadow: none;
}
.fns-case-study .fns-video-surface:has(> [data-video-error]:not([hidden])) {
  box-shadow: none;
}

/* Keep the size/cut captions aligned after adding the external shadow owner. */
@media (min-width: 701px) {
  @supports (grid-template-rows: subgrid) {
    .fns-case-study .story-size-cut-grid:not(:has([data-video-error]:not([hidden]))) > figure > .fns-video-surface {
      grid-column: 1;
      grid-row: 1;
      align-self: end;
    }
  }
}
