/* Lumen refinements
   Loaded last, after the theme, so these win without editing vendor files.
   Two fixes live here. Keep this file; it is the safe place to adjust the
   template's type and rhythm. */

/* ---------------------------------------------------------------------
   Mobile headings.
   The theme renders headings at 34-45px on a 390px phone, and sizes the H1
   SMALLER than the H2s beneath it, which inverts the hierarchy. These caps
   restore the order and stop long headings breaking into four and five
   lines. The floors sit well above the 12px minimum. text-wrap: balance
   keeps a lone word from stranding on its own last line.
   --------------------------------------------------------------------- */
@media only screen and (max-width: 690px) {
  #ajax-content-wrap h1,
  #ajax-content-wrap .row .col h1 {
    font-size: clamp(24px, 6.6vw, 30px) !important;
    line-height: 1.2 !important;
  }
  #ajax-content-wrap h2,
  #ajax-content-wrap .row .col h2,
  #ajax-content-wrap .vc_custom_heading h2 {
    font-size: clamp(21px, 5.8vw, 26px) !important;
    line-height: 1.24 !important;
  }
  #ajax-content-wrap h3,
  #ajax-content-wrap .row .col h3 {
    font-size: clamp(18px, 4.8vw, 21px) !important;
    line-height: 1.3 !important;
  }
  #ajax-content-wrap h1,
  #ajax-content-wrap h2,
  #ajax-content-wrap h3,
  #ajax-content-wrap h4 {
    text-wrap: balance;
  }
  #ajax-content-wrap p,
  #ajax-content-wrap li {
    text-wrap: pretty;
  }
}

/* ---------------------------------------------------------------------
   Section rhythm ceiling.
   The per-row padding is capped inline (see the row style attributes), but
   the page header band is sized by the theme in percent as well and grows
   the same way. Same ceiling applied here.
   --------------------------------------------------------------------- */
@media only screen and (min-width: 1000px) {
  body:not(.single-post) #page-header-bg:not(.fullscreen-header) {
    padding-top: clamp(48px, 7vw, 96px) !important;
    padding-bottom: clamp(48px, 7vw, 96px) !important;
  }
}