
  /* ══════════════════════════════════════════════════════════
     Page-local CSS for /pricing. Two rules, both because a shared
     rule targets the wrong element rather than because a new
     component was invented. Tokens only — no literal colours,
     radii or fonts. The shared stylesheet is untouched.
     ══════════════════════════════════════════════════════════ */

  /* 1. The shared rule is `.hero__panel h3, .hero__panel h4`. The hero panel
        heading on this page has to be a level-2 heading: it is the first
        heading after the page title, and a level-3 heading there would skip a
        level in the document outline. This restates the same treatment for the
        level the outline requires, so the panel looks identical to every other
        hero panel on the site. */
  .hero__panel .pricing-panel-title {
    margin: 0 0 16px;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--text);
  }

  /* 2. `.wp-table` sets min-width: 640px, which is right for the 3- and
        4-column reference tables on the whitepaper pages where cells hold a
        few words. The tier matrix holds paragraph-length cells in four
        columns, and at 640px they collapse to an unreadable measure. The
        `.wp-table-wrap` already scrolls horizontally, so raising the floor
        only lets that scroll do its job. Colour, type and spacing are all
        inherited from `.wp-table` — nothing new is introduced. */
  .pricing-tiers { min-width: 860px; }
  .pricing-tiers th[scope="row"] { width: 168px; }
