/* Hero normalization across subpages.
   User direction:
   1. Kill the "blur band" gradient that was making the top of every
      subpage hero look hazy — flatten .page-hero__bg-shade to a single
      uniform dark.
   2. Uniform hero height across ALL subpages. Inline page-styles set
      different min-heights (240 / 320 / 640 etc) which made the heroes
      feel uneven as you click between sections. Lock to 360px desktop /
      280px mobile.
   Higher specificity (body + tag.class) beats inline-stylesheet rules
   with !important that the page templates use. */

/* Flat solid overlay — no gradient, no blur. Just enough darkening so
   white headline text stays legible over the hero photo. */
.page-hero__bg-shade {
  background: rgba(16, 20, 26, 0.62) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
}

/* Also make sure the hero img/video underneath isn't blurred via filter. */
.page-hero__bg img,
.page-hero__bg video,
.page-hero__video {
  filter: none !important;
  -webkit-filter: none !important;
}

/* Uniform hero height — same across all subpages. */
body section.page-hero,
body section.page-hero--media,
body section.page-hero--body,
body section.page-hero--video,
body section.page-head {
  min-height: 360px !important;
}
@media (max-width: 880px) {
  body section.page-hero,
  body section.page-hero--media,
  body section.page-hero--body,
  body section.page-hero--video,
  body section.page-head {
    min-height: 280px !important;
  }
}

/* Defensive: kill any leftover ::after fade from earlier versions. */
.hero::after,
.stack-hero::after,
.stacks-head::after,
.page-head::after,
.product-hero::after,
.page-hero::after,
.compare-head::after,
.blog-head::after,
.research-head::after {
  content: none !important;
  display: none !important;
  background: none !important;
}