/* Loaded only by the health blog index and detail pages. */
.health-blog-page .page-hero-blog {
  --page-hero-image: url("../img/page-hero-blog.png");
  background-image:
    linear-gradient(90deg, rgba(255, 255, 255, .88) 0%, rgba(255, 255, 255, .72) 38%, rgba(255, 255, 255, 0) 100%),
    var(--page-hero-image);
}

@media (max-width: 780px) {
  /* Use the shared full-background hero layout; keep the citrus in view. */
  .health-blog-page .page-hero-blog {
    background-position: 40% center;
  }
}