/* ═══════════════════════════════════════════
   WV FOOTER QUIZ — CTA card component
   ═══════════════════════════════════════════ */

.wv-footer-quiz {
  position: relative;
  display: block;
  /* 25px — confirmed designer spec, overrides --wv-radius-lg (20px) */
  border-radius: 25px;
  overflow: hidden;
  aspect-ratio: 553 / 180;
  background-image: var(--wv-footer-quiz-bg, none);
  background-size: cover;
  background-position: center;
  text-decoration: none;
}

.wv-footer-quiz__content {
  position: relative;
  z-index: 1;
  padding: 24px 28px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 100%;
}

.wv-footer-quiz__label {
  font-family: var(--wv-font-mono);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.3;
  color: var(--wv-color-quiz-text);
  text-transform: uppercase;
  margin: 0;
}

/* Component-specific serif heading — not a global
   typography class. Size/color differ from .wv-h1/.wv-h2 */
.wv-footer-quiz__heading {
  font-family: var(--wv-font-serif);
  font-size: 48px;
  font-weight: 400;
  line-height: 52.8px;
  letter-spacing: -1.92px;
  color: var(--wv-color-quiz-text);
  margin: 0;
}

.wv-footer-quiz__body {
  font-family: var(--wv-font-primary);
  font-size: 12px;
  font-weight: 400;
  line-height: 15.2px;
  letter-spacing: -0.36px;
  color: var(--wv-color-text-inverse);
  margin: 4px 0 0;
}

.wv-footer-quiz__arrow {
  position: absolute;
  bottom: 24px;
  right: 28px;
  color: var(--wv-color-quiz-text);
  width: 18px;
  height: 18px;
}

.wv-footer-quiz__arrow svg {
  width: 18px;
  height: 11px;
}


/* ── Responsive — Mobile ── */
@media (max-width: 767px) {
  .wv-footer-quiz__heading {
    font-size: 32px;
    line-height: 36px;
  }
}