/* ==========================================================================
   Pricing page v2 — marketing-site redesign (Pricing Page.dc.html)
   Loaded only by _layouts/pricing-v2.html, after v2-core.css. New classes
   are prcv2-* so parallel template builds cannot collide.
   ========================================================================== */

/* Shared split layout (case-for-practice, dashboard) */
.prcv2-split { display: grid; grid-template-columns: minmax(0,1fr) 380px; gap: 56px; align-items: start; }
.prcv2-split__main { min-width: 0; }
.prcv2-body { margin: 0 0 16px; font-size: 17px; line-height: 1.65; color: #414B5E; max-width: 66ch; text-wrap: pretty; }
.prcv2-body--last { margin-bottom: 26px; }
.prcv2-body--tight { margin-bottom: 0; }

/* ==========================================================================
   The case for practice
   ========================================================================== */
.prcv2-case { padding: 56px 0 52px; }
.prcv2-case__h2 { margin: 0 0 16px; font-size: 30px; line-height: 1.2; font-weight: 500; color: #14203A; max-width: 26ch; text-wrap: balance; }
.prcv2-case .prcv2-body { font-size: 18px; max-width: 60ch; }
.prcv2-proof { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(160px,100%),1fr)); gap: 24px 28px; padding-top: 24px; border-top: 1px solid #DFE3EA; }
.prcv2-proof__stat { min-width: 0; }
.prcv2-proof__value { font: 500 34px/1 'IBM Plex Mono', monospace; color: #1257E8; font-variant-numeric: tabular-nums; }
.prcv2-proof__label { margin-top: 8px; font-size: 15px; line-height: 1.5; color: #414B5E; text-wrap: pretty; }

/* Chart cards (attempt chart, dashboard) */
.prcv2-chartcard {
  border: 1px solid #DFE3EA; border-radius: 10px; background: #fff;
  padding: 24px 26px; box-shadow: 0 1px 2px rgba(20,32,58,.04); min-width: 0;
}
.prcv2-chartcard--offset { margin-top: 56px; }
.prcv2-chartcard__label { font: 500 11px/1 'IBM Plex Mono', monospace; letter-spacing: .07em; text-transform: uppercase; color: #5A6478; margin-bottom: 6px; display: block; }
.prcv2-chartcard__label--flush { margin-bottom: 0; }
.prcv2-chartcard__sub { margin: 0 0 20px; font-size: 14px; line-height: 1.5; color: #5A6478; }
.prcv2-chartcard__note { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid #EDEFF4; font-size: 14px; line-height: 1.55; color: #5A6478; }

.prcv2-attempts { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 10px; align-items: end; height: 150px; }
.prcv2-attempts__col { display: flex; flex-direction: column; justify-content: flex-end; height: 100%; gap: 8px; }
.prcv2-attempts__value { font: 500 13px/1 'IBM Plex Mono', monospace; color: #5A6478; text-align: center; font-variant-numeric: tabular-nums; }
.prcv2-attempts__bar { border-radius: 4px 4px 0 0; background: #C7D5EE; }
.prcv2-attempts__col--last .prcv2-attempts__value { color: #1257E8; }
.prcv2-attempts__col--last .prcv2-attempts__bar { background: #1257E8; }
.prcv2-attempts__labels {
  display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 10px;
  margin-top: 10px; padding-top: 10px; border-top: 1px solid #EDEFF4;
}
.prcv2-attempts__labels div { font: 400 12px/1.4 'IBM Plex Mono', monospace; color: #5A6478; text-align: center; }

/* ==========================================================================
   Why it works
   ========================================================================== */
.prcv2-why { background: #F6F8FC; border-top: 1px solid #EDEFF4; border-bottom: 1px solid #EDEFF4; padding: 52px 0; }
.prcv2-why__h2 { margin: 0 0 10px; font-size: 26px; line-height: 1.25; font-weight: 500; color: #14203A; }
.prcv2-why__sub { margin: 0 0 32px; font-size: 17px; line-height: 1.6; color: #414B5E; max-width: 66ch; }
.prcv2-why__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(200px,100%),1fr)); gap: 24px; }
.prcv2-why__card { min-width: 0; display: flex; flex-direction: column; background: #fff; border: 1px solid #E4E9F1; border-radius: 10px; padding: 0 0 20px; overflow: hidden; }
.prcv2-why__card-rule { height: 3px; background: #1257E8; }
.prcv2-why__card-inner { padding: 18px 22px 0; }
.prcv2-why__card-head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.prcv2-why__icon { width: 32px; height: 32px; border-radius: 8px; flex: none; display: flex; align-items: center; justify-content: center; background: #EEF4FF; }
.prcv2-why__icon svg { width: 17px; height: 17px; display: block; }
.prcv2-why__n { font: 500 12px/1 'IBM Plex Mono', monospace; letter-spacing: .06em; color: #98A1B2; font-variant-numeric: tabular-nums; }
.prcv2-why__figure { font: 500 22px/1 'IBM Plex Mono', monospace; color: #14203A; font-variant-numeric: tabular-nums; margin-bottom: 10px; }
.prcv2-why__card h3 { margin: 0 0 8px; font-size: 17px; line-height: 1.35; font-weight: 500; color: #14203A; text-wrap: pretty; }
.prcv2-why__card p { margin: 0; font-size: 15px; line-height: 1.6; color: #5A6478; text-wrap: pretty; }

/* ==========================================================================
   Dashboard
   ========================================================================== */
.prcv2-dash { padding: 56px 0; scroll-margin-top: 16px; }
.prcv2-dash__h2 { margin: 0 0 16px; font-size: 26px; line-height: 1.25; font-weight: 500; color: #14203A; max-width: 34ch; }
.prcv2-dashcard__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.prcv2-dashcard__legend { display: flex; align-items: center; gap: 12px; font: 400 11px/1 'IBM Plex Mono', monospace; letter-spacing: .04em; text-transform: uppercase; color: #5A6478; }
.prcv2-dashcard__legend > span { display: flex; align-items: center; gap: 6px; }
.prcv2-dashcard__swatch { width: 9px; height: 9px; border-radius: 2px; display: block; }
.prcv2-dashcard__swatch--you { background: #1257E8; }
.prcv2-dashcard__swatch--avg { background: #C7D5EE; }
.prcv2-formats { display: flex; flex-direction: column; gap: 16px; }
.prcv2-format { min-width: 0; }
.prcv2-format__row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.prcv2-format__name { font-size: 15px; line-height: 1.4; color: #14203A; }
.prcv2-format__score { font: 500 13px/1.4 'IBM Plex Mono', monospace; font-variant-numeric: tabular-nums; }
.prcv2-format__score--up { color: #0E7A50; }
.prcv2-format__score--down { color: #C22A22; }
.prcv2-format__track { height: 8px; border-radius: 4px; background: #EDEFF4; overflow: hidden; margin-bottom: 5px; }
.prcv2-format__track:last-child { margin-bottom: 0; }
.prcv2-format__bar { height: 100%; border-radius: 4px; }
.prcv2-format__bar--you { background: #1257E8; }
.prcv2-format__bar--avg { background: #C7D5EE; }
.prcv2-dashcard__kicker { display: flex; align-items: flex-end; gap: 8px; margin-top: 20px; padding-top: 16px; border-top: 1px solid #EDEFF4; }
.prcv2-dashcard__kicker-pre { font-size: 15px; color: #5A6478; padding-bottom: 7px; }
.prcv2-dashcard__kicker-value { font: 500 34px/1 'IBM Plex Mono', monospace; color: #1257E8; font-variant-numeric: tabular-nums; }
.prcv2-dashcard__kicker-post { font-size: 15px; color: #5A6478; padding-bottom: 4px; }

/* ==========================================================================
   Plans
   ========================================================================== */


/* ==========================================================================
   Closing CTA (navy band)
   ========================================================================== */

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 980px) {
  .prcv2-split { grid-template-columns: minmax(0,1fr); gap: 32px; }
  .prcv2-chartcard { max-width: 460px; }
  .prcv2-chartcard--offset { margin-top: 0; }
}