/* Explicit ordinary-content role; special UI headings never receive this class.
   Important layer beats legacy unlayered !important title-sized prose rules.
   Breakpoint-specific typography only; no spacing declarations. */
@layer staging-content-type {
 @media(max-width:767px) {
  h2.staging-content-heading {font-size:22px!important;font-weight:450!important;line-height:1.2!important}
 }
}

/* Tablet hierarchy follows the two existing desktop hero families.
   The smaller service family reaches only36.864px at1024px; its tablet cap
   must respect that approved scale rather than forcing every title to40px. */
@layer staging-content-type {
 @media(min-width:768px) and (max-width:1023px) {
  section:is(.watercolor-hero,.watercolor-service) .hero-editorial-title {
   font-size:clamp(38px,4vw,42px)!important;
  }
  section.watercolor-service .hero-editorial-title {
   font-size:clamp(36px,3.6vw,40px)!important;
  }
  h2.staging-content-heading {font-size:26px!important;font-weight:450!important;line-height:1.22!important}
  h3.staging-content-subheading {font-size:21.5px!important;font-weight:500!important;line-height:1.28!important}
 }
}