/* Pricing page. Everything here is a class-based translation of the approved mockup's inline
   styles — the portal's CSP is style-src 'self' with no 'unsafe-inline', so style="" attributes
   are dropped by the browser. Only rules that site.css genuinely has no equivalent for live here;
   see Pricing.cshtml for which site.css classes (.pricing-grid, .pricing-card, .pricing-card__price,
   .pricing-card__features, ...) cover the rest. */

/* --- Feature-list bullet marks ---------------------------------------------
   site.css styles the <ul> (.pricing-card__features) but never its <li>s —
   this row layout is the mockup's own, ported in since nothing here covers
   it. .tick is the mockup's own check-mark class; .mark is the same
   positioning for the one "not included" row, which takes its colour from
   .text-warn on the <li>. */
.pricing-card__features li { display: flex; gap: 8px; align-items: flex-start; }
.tick { color: var(--success); flex: none; margin-top: 3px; }
.pricing-card__features .mark { flex: none; margin-top: 3px; }
.text-warn { color: var(--warn); }

/* The "/yr" suffix next to a price: smaller and lighter than the price itself. */
.pricing-card__period { font-size: .9375rem; font-weight: 500; color: var(--fg-muted); }

/* --- Evaluation strip -------------------------------------------------------
   Icon + copy + CTA in a row; not a pricing-card since Evaluation isn't a
   tier you buy. */
.eval-strip { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.eval-strip__body { flex: 1 1 auto; min-width: 0; }

/* --- Full comparison table --------------------------------------------------
   Highlights the Pro row to match its card above, and drops the
   dangling border on the last row since the card's own edge closes the box. */
.is-featured-row { background: var(--bg-inset); }
.compare-table th:last-child { width: 34%; }
.compare-table tbody tr:last-child td,
.compare-table tbody tr:last-child th { border-bottom: none; }