.card-grid {
  display: flex;
  gap: 0.85rem;
  flex-wrap: wrap;
  justify-content: center;
}

.card-grid--vertical {
  flex-direction: column;
  align-items: center;
}

.card-grid--tight {
  gap: 0.4rem;
}

.card-grid--deployments {
  > article:not(:first-child, .card__status--performing),
  .card__status--scheduled {
    opacity: 0.75;
  }
}

.card {
  background: var(--color-bg-lightest);
  box-shadow: 0 0.04rem 0.18rem hsl(0, 0%, 78%);
  border-radius: 0.85rem;
  width: 20rem;
  position: relative;
}

.card--long {
  width: 40rem;
}

.card--padded {
  padding: 0.5rem 1.25rem; 
}

.card__status--orphaned {
  opacity: 0.75;
  outline: 1px dashed hsl(0, 72%, 60%);
}

.card__link {
  color: inherit;
  text-decoration: none;
  display: block;
  padding: 1.15rem 1.35rem;
  border-radius: inherit;
}

.card__title {
  margin: 0 0 0.5rem;
  font-weight: 700;
  line-height: 1.1;
}

.card__title--sm {
  font-size: 1.15rem;
}

.card__detail {
  font-size: 90%;

  .status--create_complete:not(.status--orphaned),
  .status--update_complete:not(.status--orphaned) {
    visibility: hidden;
  }

  .status--orphaned {
    font-weight: bold;
    color: var(--color-fg-danger);
  }
}

.card__status--delete_in_progress {
  opacity: 0.55;
}