/* SEO page hero heading on phones: "Your competitors rank." on one line.
   Not a mockup file.
   On phones the display line is 39px and the first sentence needs about
   9.77 times the font size (JournalInter 800, letter-spacing -.045em), while
   the column is the viewport minus the 24px side padding. So it split as
   "Your competitors" / "rank." at every phone width below 430px. Berenice
   asked for the sentence on one line on phones, with the size reduced only
   as much as needed.

   The sentence is a span.fit-line (added by gen_pages.py) that cannot wrap,
   and the phone font size follows the column: (100vw - 48px) / 10, which
   leaves about 2 to 3 percent spare width, never larger than the current
   39px. Resulting size: 31.2px at 360, 34.2px at 390, 38.2px at 430, 39px
   from 438px up to 767px. Letter-spacing (em) and line-height (unitless)
   scale with it, so the look is the same, only smaller. "Why don't you?"
   stays on its own line at the same size as the first line. Tablet and
   desktop (768px and up) are unchanged. */
@media (max-width: 767px) {
  rd-body.page-seo #seo-hero .hero-message > h2 {
    font-size: min(39px, calc((100vw - 48px) / 10));
  }
  rd-body.page-seo #seo-hero .hero-message > h2 > .fit-line {
    white-space: nowrap;
  }
}