/**
 * core/heading — the "Display (Webtron)" style.
 *
 * The One-Touch headline: one heading, two lines, the second in the accent
 * colour. Stored as `Webtron ‘One-Touch’ <span class="wmb-accent">Xero
 * Invoicing</span>` with a real space before the span; the line break comes
 * from here. A <br> would join the words for anything reading textContent.
 *
 * Sizes are in container units so the headline keeps its proportion in any
 * column; the wash group (or any container) is what they measure against.
 * Margins are left to the block layout on purpose — setting them here would
 * fight the author's block spacing.
 *
 * Two classes, not one: block themes print their heading styles as
 * `:root :where(.wp-block-heading)`, one class of specificity emitted after
 * this sheet, so a single class ties and loses.
 */

.wp-block-heading.is-style-wmb-display {
  font-family: inherit;
  font-size: clamp(calc(2.125 * var(--wmb-rem)), 7.3cqi, calc(7.5 * var(--wmb-rem)));
  font-weight: var(--wmb-weight-display);
  line-height: 1.02;
  letter-spacing: -0.01em;
  color: var(--wmb-navy);
  text-wrap: balance;
}

.wp-block-heading.is-style-wmb-display .wmb-accent {
  display: block;

  /* 7.9 / 7.3: the design's second line is a touch larger than the first. */
  font-size: 1.08em;
}
