/* HCF Gold eligibility block — see hcf-gold.js. Builds on each template's
   own .step / .option-btn / .btn-primary styles; only the extras live here. */
.hcf-intro-body { margin: 4px 0 8px; }
.hcf-intro-body p { font-size: 16px; line-height: 1.5; margin: 0 0 14px; }
/* Templates differ on .options spacing (24px below in the original family,
   none in clinical), so the block sets its own. */
.hcf-step .options { margin-bottom: 0; }
.hcf-hint { font-size: 13px; line-height: 1.45; opacity: 0.7; margin: 16px 0 0; }

.hcf-yn { text-align: left; margin-bottom: 20px; }
.hcf-yn-q { font-size: 16px; font-weight: 600; margin-bottom: 10px; line-height: 1.35; }
.hcf-yn-opts { display: flex; gap: 10px; }
.hcf-yn-opts > button { flex: 1; }

/* Multi-select list: square tick boxes instead of the radio circle. */
.hcf-multi .option-btn::after { border-radius: 4px; }
.hcf-multi .option-btn.selected::after {
  box-shadow: none;
  background: var(--primary, #3ba5a2) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='5 12 10 17 19 8'/></svg>") center / 14px no-repeat;
}
.hcf-multi .hcf-none { margin-top: 6px; }
.hcf-step .hcf-primary { margin-top: 20px; }