/* Keep lines breaking on phrases. Does not change type size, color, or layout. */
h1, h2, h3, h4,
.section-title, .cmp-tagline, .faq-section-title,
.price-tier, .price-amount, .eyebrow, .hero-line,
.why-card h3, .res-card h3, .package-timeline h3,
.slide-caption, .code-box h2 {
  text-wrap: balance;
}

p, li, .subtitle, .pricing-subtitle, .fine-print, .fine, .cmp-intro,
.res-intro, .lede, .hero-note, .proof-note, .cmp-note, .slide-caption p,
.why-card p, .step p, .price-per, footer, .quiet-links, figcaption, td, th {
  text-wrap: pretty;
}

.keep {
  white-space: nowrap;
}

.hero-cta, .cta-btn, .tier-switch button, .pricing-cta {
  white-space: nowrap;
}

.phrase-break {
  display: block;
}

/* Phone-width price cards are too narrow for "Turnover Package" on one line.
   One column keeps the product name together without clipping it. */
@media (max-width: 640px) {
  .package-grid {
    grid-template-columns: 1fr;
  }
}

.quiet-pair {
  display: inline-block;
  white-space: nowrap;
}

/* A space on narrow screens. At desktop sizes it becomes a line break
   so a heading can split after a colon or a sentence, not mid-phrase. */
.wide-break::before {
  content: " ";
}

@media (min-width: 769px) {
  .wide-break {
    display: block;
  }
  .wide-break::before {
    content: none;
  }
  .ask {
    white-space: nowrap;
  }
}
