/* /pricing and /backtest on the home page's system. Loaded last, after site-marketing.css (or backtest.css) and
 * site-home.css, on a body with "hm hm-sub": the home tokens (paper, ink, graphite, one copper), Geist display at
 * 450 weight, ink pill buttons, sentence-case labels in graphite, hairline rows instead of cards and gradients. */

.hm-sub { --line: var(--hair); --line-strong: var(--hair); --surface: var(--frame); --bg-2: var(--paper); }

/* no drawing grid, no gradient washes */
.hm-sub .mk-hero::before, .hm-sub .pp-hero::before { display: none; }
.hm-sub .mk-band { background: transparent; border-top: var(--hl); border-bottom: 0; }

/* labels: sentence case in graphite, the body face, never tracked mono capitals */
.hm-sub .eyebrow, .hm-sub .spec, .hm-sub .pp-step-n, .hm-sub .bt-stat-label, .hm-sub .bt-step-n {
  font: 400 15px/1.4 var(--font); letter-spacing: 0; text-transform: none; color: var(--gr); }
.hm-sub .eyebrow { display: block; margin: 0 0 12px; }

/* the home type ladder */
.hm-sub .mk-h1, .hm-sub .lp-h1, .hm-sub .pp-hero .lp-h1 { font: 450 clamp(44px, 5.9vw, 86px)/1 var(--display); font-stretch: normal;
  letter-spacing: -0.045em; color: var(--ink); text-wrap: balance; margin: 0; max-width: 18ch; }
.hm-sub .mk-h1 em, .hm-sub .lp-h1 em { color: inherit; font-style: normal; }
.hm-sub .mk-h2 { font: 450 clamp(30px, 3.4vw, 44px)/1.05 var(--display); font-stretch: normal; letter-spacing: -0.035em; }
.hm-sub .bt-h2 { font-size: clamp(26px, 2.6vw, 36px); }
.hm-sub .mk-lede, .hm-sub .lp-lede, .hm-sub .mk-sub { color: var(--gr); font-size: 17px; }
.hm-sub .pp-hero { text-align: left; padding: 64px 0 24px; }
.hm-sub .pp-hero .lp-lede { margin: 24px 0 0; max-width: 60ch; }
.hm-sub .mk-head.center { text-align: left; }
.hm-sub .mk-head.center .mk-h2 { margin-left: 0; }
.hm-sub h3, .hm-sub .pp-step h3, .hm-sub .pp-box h3 { font: 500 17px/1.3 var(--font); letter-spacing: -0.01em; }

/* buttons: the home's ink pill for the one primary action, quiet text links for the rest */
.hm-sub .btn-primary, .hm-sub .h-btn { --btn-bg: var(--ink); --btn-fg: var(--paper); --btn-line: var(--ink); border-radius: 999px; box-shadow: none; background-image: none; }
.hm-sub .btn-lg { height: 48px; padding: 0 24px; font: 450 17px/1 var(--font); border-radius: 999px; }

/* the price: a flat frame with a hairline, the number in the display face */
.hm-sub .lp-price-card { border: 1px solid var(--frame-line); border-radius: 8px; background: var(--frame); box-shadow: var(--lift); }
.hm-sub .lp-price-card::before, .hm-sub .pp-step-paid::before { display: none; }
.hm-sub .lp-price-main { background: none; }
.hm-sub .lp-price-amt .num { font: 450 88px/1 var(--display); letter-spacing: -0.05em; color: var(--ink); }
.hm-sub .lp-price-list svg, .hm-sub .pp-incl svg, .hm-sub .fine svg { color: var(--cu); }
.hm-sub .pp-steps, .hm-sub .pp-box { border: 0; border-top: var(--hl); border-radius: 0; box-shadow: none; background: transparent; }
.hm-sub .pp-step { border-left: 0; padding: 20px 24px 20px 0; }
.hm-sub .pp-step-paid { background: none; }
.hm-sub .pp-step-paid .pp-step-n { color: var(--cu-ink); }
.hm-sub .pp-step-fee { border-top: var(--hl); }
.hm-sub .pp-step-fee b, .hm-sub .pp-vol-amt .num { font: 450 36px/1 var(--display); letter-spacing: -0.04em; }
.hm-sub .pp-box { padding: 20px 0 0; }
.hm-sub .pp-place { border: 0; border-top: var(--hl); border-radius: 0; background: transparent; padding: 28px 0 0; }
.hm-sub .pp-place-head h2 { font: 450 clamp(26px, 2.6vw, 36px)/1.05 var(--display); letter-spacing: -0.035em; }
.hm-sub .pp-place-rules dt { color: var(--ink); font-weight: 500; }
.hm-sub .badge-copper { background: transparent; border: 0; padding: 0; height: auto; font: 400 15px/1.4 var(--font); color: var(--gr); }
.hm-sub .faq summary::after { color: var(--gr); font-family: var(--font); }
.hm-sub .mk-final { text-align: left; }
.hm-sub .mk-final .mk-cta-row { justify-content: flex-start; }

/* the backtest's lead numbers: the home's hairline fact rows, not a four-up card strip */
.hm-sub .bt-stats { display: block; margin-top: 40px; background: none; border: 0; border-radius: 0; box-shadow: none; overflow: visible; }
.hm-sub .bt-stat { display: grid; grid-template-columns: minmax(0, 15em) minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 24px;
  padding: 14px 0; border-top: var(--hl); background: none; }
.hm-sub .bt-stat-label { grid-column: 2; grid-row: 1; }
.hm-sub .bt-stat-value { grid-column: 1; grid-row: 1 / 3; margin: 0; font: 450 36px/1.05 var(--display); letter-spacing: -0.04em; }
.hm-sub .bt-stat-sub { grid-column: 2; grid-row: 2; color: var(--gr); font-size: 15px; }
.hm-sub .bt-card, .hm-sub .card { box-shadow: none; border-color: var(--frame-line); border-radius: 8px; }
.hm-sub .bt-warehouse { font: 400 13px/1.4 var(--font); color: var(--gr); }

@media (max-width: 759px) {
  .hm-sub .mk-h1, .hm-sub .lp-h1, .hm-sub .pp-hero .lp-h1 { font-size: clamp(38px, 11vw, 48px); }
  .hm-sub .lp-price-amt .num { font-size: 64px; }
  .hm-sub .bt-stat { grid-template-columns: minmax(0, 1fr); }
  .hm-sub .bt-stat-label, .hm-sub .bt-stat-value, .hm-sub .bt-stat-sub { grid-column: 1; grid-row: auto; }
  .hm-sub .bt-stat-value { margin-top: 4px; }
}