/* design-system-forms.css (3/3) — pricing cards, questionnaire form, product scope.
 * See design-system.css for the rules these follow. */

/* ── pricing ─────────────────────────────────────────────────────────── */
.ds-tiers { display: grid; gap: var(--dh-space-6); margin: 0; padding: 0; list-style: none; }
.ds-tier { display: flex; flex-direction: column; border: 1px solid var(--dh-border-subtle); border-radius: var(--dh-r-xl); background: var(--dh-surface-1); padding: var(--dh-space-8); }
.ds-tier--featured { border-color: var(--dh-gold-deep); background: linear-gradient(180deg, var(--dh-gold-950), var(--dh-surface-1) 40%); }
.ds-tier__name { font: 600 var(--dh-text-lg)/1.2 var(--dh-font-sans); color: var(--dh-text-hi); margin: 0; display: flex; justify-content: space-between; align-items: center; gap: var(--dh-space-3); }
.ds-tier__price { font: 600 var(--dh-text-2xl)/1 var(--dh-font-sans); letter-spacing: -0.03em; color: var(--dh-text-hi); margin: var(--dh-space-6) 0 var(--dh-space-1); }
.ds-tier__per { color: var(--dh-text-mid); font-size: var(--dh-text-sm); margin: 0; }
.ds-tier__features { margin: var(--dh-space-8) 0; padding: 0; list-style: none; display: grid; gap: var(--dh-space-3); color: var(--dh-text-mid); font-size: var(--dh-text-sm); line-height: var(--dh-leading-snug); flex: 1; align-content: start; }
.ds-tier__features li { display: flex; gap: var(--dh-space-3); }
.ds-tier__features li::before { content: ""; flex: none; width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--dh-gold); transform: translateY(0.5em); }
.ds-tier .ds-btn { width: 100%; }
.ds-tiers-asof { color: var(--dh-text-mid); font: 400 var(--dh-text-xs)/1.4 var(--dh-font-mono); margin: var(--dh-space-8) 0 0; }
.ds-tiers-empty { text-align: center; padding: var(--dh-space-16) var(--dh-space-8); border: 1px dashed var(--dh-border-strong); border-radius: var(--dh-r-xl); }
.ds-tiers-empty .ds-lede { margin-inline: auto; }
.ds-tiers-empty .ds-cta { justify-content: center; }
@media (min-width: 48rem) { .ds-tiers { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); } }

/* ── questionnaire form ──────────────────────────────────────────────── */
.ds-form { display: grid; gap: var(--dh-space-12); }
.ds-form__group { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: var(--dh-space-6); }
.ds-form__group > legend { padding: 0; font: 600 var(--dh-text-lg)/1.2 var(--dh-font-sans); color: var(--dh-text-hi); margin-bottom: var(--dh-space-6); }
.ds-field { display: grid; gap: var(--dh-space-2); border: 0; margin: 0; padding: 0; min-width: 0; }
.ds-field > label, .ds-field > legend { padding: 0; font: 500 var(--dh-text-sm)/1.3 var(--dh-font-sans); color: var(--dh-text-hi); }
.ds-field__hint { color: var(--dh-text-mid); font-size: var(--dh-text-xs); margin: 0; }
.ds-field__req { color: var(--dh-gold-soft); }
.ds-field input[type=text], .ds-field input[type=email], .ds-field input[type=tel], .ds-field select, .ds-field textarea {
  width: 100%; min-height: 3rem; padding: 0 var(--dh-space-4); border-radius: var(--dh-r-md);
  background: var(--dh-surface-inset); color: var(--dh-text-hi); border: 1px solid var(--dh-border-strong);
  font: 400 var(--dh-text-base)/1.4 var(--dh-font-sans); box-sizing: border-box;
}
.ds-field textarea { min-height: 7rem; padding-block: var(--dh-space-3); resize: vertical; }
.ds-field [aria-invalid="true"] { border-color: var(--dh-status-error); }
.ds-field__error { color: var(--dh-status-error); font-size: var(--dh-text-xs); margin: 0; }
.ds-field__error[hidden] { display: none; }
.ds-choices { display: flex; flex-wrap: wrap; gap: var(--dh-space-2); }
.ds-choice { position: relative; display: inline-flex; }
.ds-choice input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; cursor: pointer; margin: 0; }
.ds-choice span { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 var(--dh-space-4); border: 1px solid var(--dh-border-strong); border-radius: var(--dh-r-pill); color: var(--dh-text-mid); font-size: var(--dh-text-sm); transition: border-color var(--dh-dur-fast) var(--dh-ease), color var(--dh-dur-fast) var(--dh-ease); }
.ds-choice input:checked + span { border-color: var(--dh-gold); color: var(--dh-text-hi); background: var(--dh-gold-950); }
.ds-choice input:checked + span::before { content: "\2713"; margin-right: var(--dh-space-2); color: var(--dh-gold); }
.ds-form__turnstile { min-height: 4rem; }
.ds-form__status { margin: 0; padding: var(--dh-space-4) var(--dh-space-6); border-radius: var(--dh-r-md); border: 1px solid var(--dh-border-strong); color: var(--dh-text-hi); }
.ds-form__status[hidden] { display: none; }
.ds-form__fallback { color: var(--dh-text-mid); font-size: var(--dh-text-sm); margin: 0; }
.ds-form__honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@media (min-width: 40rem) { .ds-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--dh-space-6); } }

/* ── product scope: Crann Bethadh marks /nerve/*, the crest stays the company mark ── */
.ds-productmark { display: inline-flex; align-items: center; gap: var(--dh-space-3); color: var(--dh-text-hi); font: 600 var(--dh-text-sm)/1 var(--dh-font-sans); letter-spacing: 0.02em; }
.ds-productmark svg { width: 1.75rem; height: 1.75rem; flex: none; }
