/* A stable luminance layer keeps the white copy legible on every crop. */
#build-cards .card > .absolute.inset-0 {
  background: linear-gradient(180deg, rgba(2, 5, 10, 0.56) 0%, rgba(2, 5, 10, 0.14) 43%, rgba(2, 5, 10, 0.84) 100%) !important;
}

/* The source markup uses dark text for the former third-card artwork. */
#build-card-3 > .relative {
  color: #fff !important;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.82);
}

#edge-card-1::before,
#edge-card-2::before,
#edge-card-3::before,
#edge-card-4::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(2, 5, 10, 0.50) 0%, rgba(2, 5, 10, 0.12) 42%, rgba(2, 5, 10, 0.78) 100%);
}

#edge-card-1 > h3, #edge-card-1 > p,
#edge-card-2 > h3, #edge-card-2 > p,
#edge-card-3 > h3, #edge-card-3 > p,
#edge-card-4 > h3, #edge-card-4 > p {
  z-index: 1;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.82);
}

#edge-card-3 > h3,
#edge-card-3 > p {
  color: #fff !important;
}