/*
 * Placeholder states.
 *
 * Kept separate so the ported design stylesheet stays pristine. Everything here
 * is deletable once real photography is in the Media Library.
 */

/* ---- Experience cards with no featured image ---------------------------- */

.exp-card:not(:has(.exp-card__media)) {
  background:
    radial-gradient(120% 90% at 12% 0%, rgba(183, 131, 63, .40) 0%, rgba(183, 131, 63, 0) 62%),
    radial-gradient(100% 80% at 92% 8%, rgba(247, 235, 155, .16) 0%, rgba(247, 235, 155, 0) 58%),
    var(--key-black);
}

/* A faint brandmark so the empty card still reads as Sacred Travels */
.exp-card:not(:has(.exp-card__media))::before {
  content: "";
  position: absolute;
  right: -6%;
  top: -14%;
  width: 46%;
  aspect-ratio: 1;
  z-index: 0;
  background: url("../img/brandmark-white.svg") no-repeat center / contain;
  opacity: .07;
  pointer-events: none;
}

/* ---- Service cards with no --card-img ----------------------------------- */

.card:not([style*="--card-img"]) .card__link,
.card[style*="--card-img:url('')"] .card__link {
  background:
    linear-gradient(155deg, rgba(255, 255, 255, .10) 0%, rgba(0, 0, 0, .28) 100%),
    var(--card-tint, var(--key-black));
}

/* ---- Listing rows with no thumbnail ------------------------------------- */

.st-row-card__placeholder,
.st-related__placeholder {
  background:
    radial-gradient(110% 90% at 20% 0%, rgba(183, 131, 63, .18) 0%, rgba(183, 131, 63, 0) 64%),
    var(--st-ground-muted, #f6f4f1);
}