/* Full tarot compositions stay readable inside the existing service cards.
   Scoped classes prevent these rules from resizing technical evidence art. */
.wo-card-image.wo-tarot-link {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 24px;
  background: radial-gradient(ellipse at center, #293247 0%, #101525 78%);
}
.wo-card-image.wo-tarot-link .wo-tarot-art {
  display: block;
  width: 100%;
  max-width: 220px;
  height: auto;
  aspect-ratio: 2 / 3;
  object-fit: contain;
  border-radius: 8px;
}
.wo-service-hero > .wo-tarot-hero {
  width: 100%;
  max-width: 320px;
  height: auto;
  aspect-ratio: 2 / 3;
  object-fit: contain;
  justify-self: center;
  border-radius: 12px;
}
.wo-about-details {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, .8fr);
  align-items: center;
  gap: clamp(36px, 6vw, 90px);
}
.wo-about-copy > div + div { margin-top: 42px; }
.wo-about-copy h2 { font-size: 2.1rem; }
.wo-about-tarot { margin: 0; justify-self: end; max-width: 320px; }
.wo-tarot-star { display: block; width: 100%; height: auto; border-radius: 12px; }
@media (max-width: 1024px) and (min-width: 769px) {
  .wo-service-card:has(.wo-tarot-link) { grid-template-columns: minmax(180px, .8fr) minmax(0, 1.5fr); }
}
@media (max-width: 768px) {
  .wo-card-image.wo-tarot-link { padding: 24px 18px; }
  .wo-card-image.wo-tarot-link .wo-tarot-art { max-width: 210px; }
  .wo-service-hero > .wo-tarot-hero { max-width: 250px; }
  .wo-about-details { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .wo-about-tarot { width: min(100%, 250px); justify-self: center; }
}