/* =========================================================================
   /pricing — 2026 rebuild.

   Loaded alongside homepage-2026.css; the page is wrapped in .hp26 so it
   inherits that file's cards, tables, bands and the shared pricing blocks.
   Only what this page adds lives here, scoped under .pr26. Tokens only.
   ========================================================================= */

/* The rate card in the hero, where the homepage puts its comparison chart. */
.pr26 .pr-quickmath__rows { display: flex; flex-direction: column; }
.pr26 .pr-qrow {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--space-md);
    padding: var(--space-md) 0;
    border-bottom: 1px solid var(--color-border);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}
.pr26 .pr-qrow:last-child { border-bottom: 0; }
.pr26 .pr-qrow b {
    font-family: var(--font-serif);
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--color-accent-cyan);
    white-space: nowrap;
}
/* The two lines that are not part of the per-user ladder read quieter, so the
   ladder itself stays the thing the eye lands on. */
.pr26 .pr-qrow--sub b {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--color-text-secondary);
}

/* Worked examples. */
.pr26 .pr-examples {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-md);
}
@media (max-width: 900px) { .pr26 .pr-examples { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .pr26 .pr-examples { grid-template-columns: 1fr; } }
.pr26 .pr-example { display: flex; flex-direction: column; text-align: center; }
.pr26 .pr-example--feature { border-color: var(--color-accent-cyan); background: var(--color-accent-cyan-muted); }
.pr26 .pr-example__who {
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: var(--color-accent-cyan);
}
.pr26 .pr-example__n {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-text-tertiary);
    margin-top: var(--space-xs);
}
.pr26 .pr-example__amt {
    font-family: var(--font-serif);
    font-weight: 700;
    font-size: var(--text-4xl);
    line-height: 1.1;
    color: var(--color-text-primary);
    margin: var(--space-sm) 0;
}
.pr26 .pr-example__amt small {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--color-text-tertiary);
}
.pr26 .pr-example__yr {
    margin-top: auto;
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    border-top: 1px solid var(--color-border);
    padding-top: var(--space-sm);
}

/* The comparison table's left column is prose, not a value, so it keeps the
   body face while the two verdict columns stay mono like every other table. */
.pr26 .pr-compare td:first-child { font-family: var(--font-ui); text-align: left; }