.card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: var(--space-4);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  overflow: hidden;
  isolation: isolate;
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}
.card:hover {
  transform: translateY(-2px);
  border-color: rgba(92, 69, 255, 0.5);
  box-shadow: var(--shadow-glow-inset), 0 12px 40px rgba(92, 69, 255, 0.18);
}

.pillar-card {
  min-height: 382px;
  padding: var(--space-4);
  background:
    radial-gradient(100% 70% at 50% 125%, rgba(92, 69, 255, 0.5), transparent 62%),
    linear-gradient(180deg, #0e0e12 55%, #14122a 100%);
  justify-content: flex-end;
}
.pillar-card__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.pillar-card__media img {
  position: absolute;
  width: auto;
  height: auto;
}
.pillar-card__content {
  position: relative;
  z-index: 1;
}

.pillar-card__title {
  font: 500 clamp(28px, 3vw, 37px)/1.25 var(--font-sans);
  letter-spacing: -0.03em;
  color: var(--color-text);
  margin-bottom: var(--space-2);
}
.pillar-card__body {
  font: 400 18px/1.55 var(--font-sans);
  color: var(--color-text-muted);
}

.result-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  max-width: 612px;
}
.result-card__logo {
  height: 40px;
  display: flex;
  align-items: center;
  color: var(--color-text-subtle);
  font: 500 16px/1 var(--font-sans);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.result-card__title {
  font: 500 clamp(28px, 3vw, 37px)/1.3 var(--font-sans);
  letter-spacing: -0.03em;
  color: var(--color-text);
}
.result-card__body {
  font: 400 18px/1.6 var(--font-sans);
  color: var(--color-text-muted);
}