/* Written for scripts/cookbook-prerender.mjs: the recipe title in the dialog
   and the index heading are <h1> now. These mirror the app's own rules for the
   h2 they replace (assets/index-*.css), so nothing moves on screen. */
.dialog-heading h1 { max-width: 12ch; margin: 0; font-size: clamp(2.5rem, 5vw, 5rem); font-weight: 650; letter-spacing: -.07em; line-height: .9; }
.section-heading h1 { margin: 0; font-size: clamp(2.2rem, 4.4vw, 4.8rem); font-weight: 620; letter-spacing: -.06em; line-height: .98; }
@media (max-width: 720px) {
  .dialog-heading h1 { font-size: clamp(2.6rem, 13vw, 4.4rem); }
}