/* Pricing module · Oct 27 2026
   Two monthly options only: NuCalm Monthly + All-Access Pass Monthly.
   Scoped to #value so nothing else on the page is affected. Reuses the existing
   .pricecard / .pricecard--feature styles from main + funnel CSS. */
#value .val.val--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1.25rem, 3vw, 2.25rem);
  align-items: stretch;
  max-width: 980px;
  margin-inline: auto;
}
#value .val--two .pricecard {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  height: 100%;
  box-sizing: border-box;
}
#value .val--two .pricecard .price { font-size: clamp(3rem, 2.2rem + 2.4vw, 4.4rem); margin: 0; }
#value .val--two .pricecard .label,
#value .val--two .pricecard .diff,
#value .val--two .pricecard .small { margin: 0; }
#value .val--two .pricecard ul { flex: 1 1 auto; align-content: start; margin: 0; padding: 0; list-style: none; }
#value .val--two .pricecard .btn { margin-top: auto; width: 100%; justify-content: center; }

/* NuCalm card — light tile, NuCalm accent */
#value .pricecard--nc { border-top: 3px solid var(--nc); }
#value .pricecard--nc .label { min-height: 1.1rem; display: flex; align-items: center; }
#value .pricecard--nc .label .nc-lock--card { height: 2.3rem; }
#value .pricecard--nc .diff { font-size: .95rem; color: var(--fg-2); }
#value .pricecard--nc .small { color: var(--fg-2); }
#value .pricecard--nc li svg { color: var(--nc); }
#value .pricecard--nc li.is-out { color: var(--fg-2); }
#value .pricecard--nc li.is-out > span { opacity: .75; }
#value .pricecard--nc li.is-out small { display: block; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; margin-top: .15rem; }
/* "Not included" marker — brand red X (same red as the Ignite journey, #DA2537), drawn with the page's own #i-close icon */
#value .pricecard--nc li svg.no { color: #DA2537; }

/* All-Access card — keep the "Best value" badge, align label row height with NuCalm card */
#value .val--two .pricecard--feature .label { min-height: 2.3rem; display: flex; align-items: center; }

@media (max-width: 899px) {
  #value .val.val--two { grid-template-columns: 1fr; max-width: 520px; row-gap: 2rem; }
}

/* Closing CTA (#finalBuy) — the billing toggle was removed; keep the original breathing room above the price */
.final .final-buy { margin-top: clamp(1.25rem, 2.5vw, 2.25rem); }

/* Keep both CTAs on the same line on desktop */
@media (min-width: 900px) {
  #value .val--two .pricecard .small { min-height: 3.2em; }
}
