/* Pricing page — layout additions.
   Chrome (nav/menu/footer/drawer), tokens, .plan cards and .calc come from /assets/css/site.css. */

.pr-ea { color: inherit; opacity: .8; }
.pr-fine { font-size: 13px; }
.pr-fine a { color: inherit; }

/* ── Three meters ─────────────────────────────────────── */
.pr-meter { min-height: 0; color: inherit; text-decoration: none; transition: background .2s; }
.pr-meter:hover { background: rgba(34,59,195,.05); }
.pr-meter p { margin: 0; flex: 1; }
.pr-meter .lnk { padding-block: 0; }

/* ── API plans: five across ───────────────────────────── */
.pr-k5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.pr-k5 .plan { padding: 16px; gap: 14px; min-height: 0; }
.pr-k5 .plan .pp { font-size: clamp(40px, 3.3vw, 58px); }
.pr-k5 .plan .pp small { font-size: .3em; }
.pr-k5 .ticks li { font-size: 15px; }
.pr-k5 .btn { width: 100%; justify-content: space-between; }

.pr-credits { display: grid; gap: 12px; margin-top: 8px; }
.pr-credits-h { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.pr-credits ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 28px; }
.pr-credits li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(34,59,195,.18); font-size: 16px; }
.pr-credits li b { font: 400 14px/1.2 var(--f-mono); white-space: nowrap; }
.pr-credits li b::after { content: " cr"; color: var(--dim); }

/* ── Estimator tier toggle ────────────────────────────── */
.pr-seg { display: inline-grid; grid-auto-flow: column; border: 1px solid var(--fg); margin-bottom: 22px; }
.pr-seg label { position: relative; cursor: pointer; }
.pr-seg input { position: absolute; opacity: 0; pointer-events: none; }
.pr-seg span { display: block; padding: 11px 16px; font: 400 14px/1 var(--f-mono); }
.pr-seg input:checked + span { background: var(--fg); color: var(--bg); }
.pr-seg input:focus-visible + span { outline: 2px solid var(--lime); outline-offset: 2px; }

/* ── Enterprise rows ──────────────────────────────────── */
.pr-rows { list-style: none; margin: 0; padding: 0; }
.pr-rows li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px 28px; align-items: center; padding: 20px 0; border-top: 1px solid var(--ln); }
.pr-rows li:last-child { border-bottom: 1px solid var(--ln); }
.pr-rows h3 { margin: 0 0 6px; display: flex; align-items: baseline; gap: 10px; }
.pr-rows p { margin: 0; max-width: 54ch; }
.pr-from { font-weight: 300; font-size: clamp(30px, 2.8vw, 44px); letter-spacing: -.04em; line-height: 1; white-space: nowrap; text-align: right; font-variant-numeric: tabular-nums; }
.pr-from .co { display: block; margin-bottom: 6px; letter-spacing: 0; }
.pr-from small { font-size: 13px; font-weight: 500; letter-spacing: 0; margin-left: 6px; }
.pr-rows .btn { min-height: 44px; }

/* ── Evidence table ───────────────────────────────────── */
.pr-skillwrap { overflow-x: auto; }
.pr-skill { width: 100%; border-collapse: collapse; min-width: 420px; }
.pr-skill caption { text-align: left; padding-bottom: 14px; }
.pr-skill thead th { text-align: left; font: 400 11px/1.1 var(--f-mono); text-transform: uppercase; letter-spacing: .04em; color: var(--dim); padding: 0 12px 10px 0; }
.pr-skill tbody th { text-align: left; font-weight: 500; font-size: 16px; padding-right: 12px; white-space: nowrap; }
.pr-skill td, .pr-skill tbody th { padding-block: 12px; border-top: 1px solid rgba(34,59,195,.18); }
.pr-skill td { padding-right: 16px; width: 34%; }
.pr-skill .r { text-align: right; padding-right: 0; width: auto; }
.pr-bar { display: grid; grid-template-columns: minmax(0, 1fr) 2.6em; align-items: center; gap: 10px; font: 400 13px/1 var(--f-mono); font-variant-numeric: tabular-nums; }
.pr-bar i { display: block; height: 12px; width: calc(var(--v) * 100%); background: var(--blue); }
.pr-bar.sg i { background: rgba(34,59,195,.28); }
.pr-lift { font: 400 14px/1 var(--f-mono); }
.pr-lift::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; background: var(--lime); border: 1px solid var(--blue); vertical-align: 1px; }

@media (max-width: 1200px) {
  .pr-k5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1000px) {
  .pr-k5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pr-credits ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pr-rows li { grid-template-columns: minmax(0, 1fr) auto; }
  .pr-rows li > .btn, .pr-rows li > a.btn { grid-column: 1 / -1; justify-self: start; }
}
@media (max-width: 620px) {
  .pr-k5, .pr-credits ul { grid-template-columns: 1fr; }
  .pr-rows li { grid-template-columns: 1fr; }
  .pr-from { text-align: left; }
}