/* Title graphics Jeff supplies per page (leaderboard classes, leaderboard
   how-it-works, profile sheet).
   
   These live in `pages.body`, which is served inside the cloned WordPress theme
   — and that theme, not rise.css, is what these pages load. So the global
   `img{max-width:100%}` in rise.css does NOT reach them. Without the rule below
   a 1400px-wide banner would render at its intrinsic width and push the page
   sideways on a phone, which is the exact complaint Jeff raised about images
   not scaling. Scoped to two classes so it cannot affect theme styling. */
.rse-page-banner {
  display: block;
  width: 100%;
  max-width: 1400px;
  height: auto;
  margin: 0 auto 18px;
  border-radius: 8px;
}
.rse-profile-example {
  display: block;
  width: 100%;
  max-width: 640px;
  height: auto;
  margin: 0 auto 18px;
  border: 1px solid #e3e8e7;
  border-radius: 6px;
}

/* The banner graphic carries the page's wording. The real <h1> stays in the
   markup for screen readers and search engines rather than being deleted. */
.rse-visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}


/* Dark wash over the two photographic backgrounds on the home page, so the
   white headings stay readable. Jeff asked for this twice.

   WHY AN OVERLAY AND NOT A GRADIENT IN background-image:
   the first attempt put `linear-gradient(...), url(...)` into the inline style,
   which is the usual trick. It is still in the page source and it still does
   nothing, because .rseVideoWrapper also carries uk-parallax="bgy: -200":
   UIkit's parallax pulls the URL out of background-image and rewrites the
   property itself, throwing the gradient layer away. A ::before overlay sits
   outside anything UIkit touches, so it survives. */
.rseVideoWrapper,
.rseBelowSlider { position: relative; }
.rseVideoWrapper::before,
.rseBelowSlider::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(12, 16, 18, .68);
  pointer-events: none;   /* the play button underneath must stay clickable */
  z-index: 0;
}
/* Lift the real content above the wash. */
.rseVideoWrapper > *,
.rseBelowSlider > * { position: relative; z-index: 1; }
