/* Shared pricing section (rendered by tools/pricing/build-pricing.py).
   Uses the same tokens as the page stylesheets: navy #0b1f3f, blue #3e8dc4/#5babe0,
   Merriweather headings, Inter body, pill buttons, light-blue cards. */

.bm-pricing {
  --bmp-navy: #0b1f3f;
  --bmp-blue: #5babe0;
  --bmp-blue-2: #3e8dc4;
  --bmp-ink: #222222;
  --bmp-muted: #5d7089;
  --bmp-border: #dfe7f0;
  --bmp-light: #f4f8fc;
  --bmp-heading: var(--font-merriweather), Georgia, serif;
  --bmp-body: var(--font-inter), Arial, sans-serif;
  background: var(--bmp-light);
  color: var(--bmp-ink);
  font-family: var(--bmp-body);
  padding: 88px 0;
  scroll-margin-top: 90px;
}
.bm-pricing * { box-sizing: border-box; }
.bm-pricing p, .bm-pricing ul, .bm-pricing h2, .bm-pricing h3 { margin: 0; }
.bm-pricing ul { list-style: none; padding: 0; }

.bmp-inner { max-width: 1280px; margin: 0 auto; padding: 0 80px; }

/* Heading */
.bmp-head { text-align: center; max-width: 720px; margin: 0 auto 32px; }
.bmp-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 16px; margin-bottom: 20px;
  border: 0.2px solid var(--bmp-blue-2); border-radius: 100px;
  background: rgba(62, 141, 196, 0.04);
  font: 700 14px/1 var(--bmp-heading); letter-spacing: 1px; text-transform: uppercase;
  color: var(--bmp-blue-2);
}
.bmp-dot { width: 6px; height: 6px; border-radius: 3px; background: currentColor; }
.bm-pricing h2 {
  font: 700 34px/1.25 var(--bmp-heading); letter-spacing: -0.34px;
  color: var(--bmp-navy); margin-bottom: 12px;
}
.bmp-lede { font-size: 17px; line-height: 1.5; }

/* Segmented controls (level + format) */
.bmp-switch {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 6px;
  width: fit-content; max-width: 100%; margin: 0 auto 28px;
  padding: 6px; border-radius: 100px;
  background: #fff; border: 1px solid var(--bmp-border);
}
.bmp-switch--cats { margin-bottom: 36px; }
.bmp-tab {
  appearance: none; border: 0; cursor: pointer;
  padding: 11px 22px; border-radius: 100px;
  background: transparent; color: var(--bmp-navy);
  font: 700 15px/1.2 var(--bmp-body);
  transition: background-color .2s ease, color .2s ease;
}
.bmp-tab:hover { background: var(--bmp-light); }
.bmp-tab[aria-selected="true"] { background: var(--bmp-navy); color: #fff; }
.bmp-tab:focus-visible, .bmp-btn:focus-visible, .bmp-term label:focus-within {
  outline: 3px solid var(--bmp-blue); outline-offset: 2px;
}
.bmp-cat-title { font: 700 22px/1.3 var(--bmp-heading); color: var(--bmp-navy); text-align: center; margin-bottom: 18px !important; }

/* Panels: all visible without JS; the script hides inactive ones */
.bmp-panel + .bmp-panel { margin-top: 48px; }
.bmp-js .bmp-panel + .bmp-panel { margin-top: 0; }
.bmp-category + .bmp-category { margin-top: 64px; }
.bmp-js .bmp-category + .bmp-category { margin-top: 0; }

/* Standard rate strip */
.bmp-rate {
  display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap;
  background: var(--bmp-navy); color: #fff;
  border-radius: 16px; padding: 24px 32px; margin-bottom: 40px;
}
.bmp-block-label { font: 700 12px/1 var(--bmp-body); letter-spacing: 1px; text-transform: uppercase; color: var(--bmp-blue); margin-bottom: 8px !important; }
.bmp-rate-cat { font-size: 16px; color: rgba(255,255,255,.85); }
.bmp-rate-price { font: 700 40px/1 var(--bmp-heading); }
.bmp-rate-price .bmp-per { font: 500 16px/1 var(--bmp-body); color: rgba(255,255,255,.75); }

/* Blocks */
.bmp-block + .bmp-block { margin-top: 48px; }
.bmp-block-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.bmp-block-head .bmp-sub { margin-bottom: 0 !important; }
.bmp-h3 { font: 700 24px/1.3 var(--bmp-heading); color: var(--bmp-navy); margin-bottom: 6px !important; }
.bmp-sub { font-size: 15px; color: var(--bmp-muted); margin-bottom: 20px !important; }

/* Cards */
.bmp-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.bmp-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bmp-card {
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--bmp-border); border-radius: 16px;
  padding: 24px 22px;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.bmp-card:hover { transform: translateY(-4px); box-shadow: 0 16px 30px -18px rgba(11,31,63,.3); border-color: var(--bmp-blue); }
.bmp-card-label { font: 700 13px/1 var(--bmp-body); letter-spacing: .8px; text-transform: uppercase; color: var(--bmp-blue-2); margin-bottom: 14px !important; }
.bmp-price { font: 700 34px/1.1 var(--bmp-heading); color: var(--bmp-navy); }
.bmp-price .bmp-per { font: 500 15px/1 var(--bmp-body); color: var(--bmp-muted); margin-left: 2px; }
.bmp-was { font-size: 14px; color: var(--bmp-muted); margin-top: 6px !important; }
.bmp-was s { text-decoration-thickness: 1px; }
.bmp-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; min-height: 28px; }
.bmp-chip { display: inline-flex; align-items: center; padding: 5px 11px; border-radius: 100px; background: var(--bmp-light); color: var(--bmp-navy); font: 600 13px/1.2 var(--bmp-body); }
.bmp-chip--save { background: #e6f2fa; color: #1f6aa0; }
.bmp-meta { margin-top: auto !important; padding-top: 14px; border-top: 1px solid var(--bmp-border); font-size: 14px; color: var(--bmp-muted); }
.bmp-chips + .bmp-meta { margin-top: 16px !important; }

/* Membership cards */
.bmp-sessions { font-size: 15px; font-weight: 600; color: var(--bmp-navy); margin-bottom: 10px !important; }
.bmp-rows { margin: 16px 0 0 !important; border-top: 1px solid var(--bmp-border); }
.bmp-rows li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--bmp-border); font-size: 14px; color: var(--bmp-muted); }
.bmp-rows li span:last-child { color: var(--bmp-navy); font-weight: 600; }
.bmp-total {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  margin-top: auto !important; padding: 12px 14px; border-radius: 12px;
  background: var(--bmp-light); font-size: 14px; color: var(--bmp-navy);
}
.bmp-rows + .bmp-total { margin-top: 16px !important; }
.bmp-total-value { font: 700 18px/1 var(--bmp-heading); }
.bmp-total--ask { font-size: 13px; color: var(--bmp-muted); }
.bmp-plans[data-term="6"] [data-term="12"], .bmp-plans[data-term="12"] [data-term="6"] { display: none; }
.bmp-plans .bmp-term [data-term] { display: inline; }

/* 4 / 6 month toggle */
.bmp-term { display: inline-flex; gap: 4px; border: 1px solid var(--bmp-border); border-radius: 100px; padding: 4px; margin: 0; background: #fff; }
.bmp-term label { position: relative; cursor: pointer; border-radius: 100px; }
.bmp-term input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.bmp-term span { display: block; padding: 8px 16px; border-radius: 100px; font: 700 14px/1.2 var(--bmp-body); color: var(--bmp-navy); }
.bmp-term input:checked + span { background: var(--bmp-navy); color: #fff; }
.bmp-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.bmp-note { font-size: 14px; line-height: 1.55; color: var(--bmp-muted); margin-top: 16px !important; }
.bmp-note + .bmp-note { margin-top: 6px !important; }

/* CTA */
.bmp-cta {
  display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap;
  margin-top: 48px; padding: 24px 32px; border-radius: 16px; background: #fff; border: 1px solid var(--bmp-border);
}
.bmp-cta p { font: 700 18px/1.4 var(--bmp-heading); color: var(--bmp-navy); }
.bmp-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 15px 26px; border-radius: 100px;
  background: var(--bmp-navy); color: #fff; text-decoration: none;
  font: 700 16px/1 var(--bmp-body); white-space: nowrap;
  transition: background-color .2s ease;
}
.bmp-btn:hover { background: var(--bmp-blue-2); color: #fff; }

/* Responsive */
@media (max-width: 1100px) {
  .bmp-inner { padding: 0 24px; }
  .bmp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .bm-pricing { padding: 56px 0; }
  .bm-pricing h2 { font-size: 26px; }
  .bmp-lede { font-size: 16px; }
  .bmp-grid { grid-template-columns: 1fr; gap: 14px; }
  .bmp-rate { padding: 20px; }
  .bmp-rate-price { font-size: 32px; }
  .bmp-switch { border-radius: 18px; width: 100%; }
  .bmp-switch .bmp-tab { flex: 1 1 auto; padding: 11px 14px; font-size: 14px; }
  .bmp-switch--cats .bmp-tab { flex-basis: calc(50% - 6px); border-radius: 12px; }
  .bmp-block-head { align-items: flex-start; }
  .bmp-cta { padding: 20px; }
  .bmp-btn { width: 100%; white-space: normal; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .bmp-card, .bmp-tab, .bmp-btn { transition: none; }
  .bmp-card:hover { transform: none; }
}
