figure:has(img[src*="staff"]) {
  position: relative;
  display: inline-block;
  max-width: 12.5rem;
}

figure:has(img[src*="staff"])::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 6.25rem; /* Adjust as needed */
  height: 6.25rem; /* Adjust as needed */
  /* background-image: url('assets/images/staff/corner.svg'); Replace with actual SVG */
  pointer-events: none; /* Prevent interaction */

  background: color-mix(in srgb, currentColor 50%, transparent);

  /* Apply SVG as a mask */
  -webkit-mask-image: url('../images/staff/corner.svg');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-image: url('../images/staff/corner.svg');
  mask-size: contain;
  mask-repeat: no-repeat;
}

/* Hover effect */
figure:has(img[src*="staff"]):hover::after {
  background: color-mix(in srgb, currentColor 100%, transparent);
}