/* Headings wrap between editorial phrases; long phrases may still reflow
   inside their container for narrow screens and enlarged text. */
h1,h2,h3,h4{
  word-break:normal;
  overflow-wrap:normal;
  line-break:strict;
  text-wrap:balance;
}
.heading-phrase{
  display:inline-block;
  max-width:100%;
  vertical-align:top;
  text-wrap:wrap;
}
.merchant-heading>div{min-width:0}
@media(max-width:700px){
  .article-head h1{font-size:clamp(25px,7.5vw,30px);line-height:1.55}
  .hero h1{font-size:clamp(30px,8.7vw,38px);line-height:1.6}
  .article-body h2{font-size:clamp(21px,6vw,24px)}
  .online-page .article-body>section>h2{font-size:clamp(21px,6vw,24px)}
}
@media(max-width:600px){
  .merchant-heading{display:grid;grid-template-columns:47px minmax(0,1fr);gap:12px}
  .merchant-heading>div{display:contents}
  .merchant-heading .merchant-name{align-self:center;margin:0;font-size:13px}
  .merchant-heading h3{grid-column:1/-1;font-size:21px;text-wrap:balance}
}
