/* Holding page only: the banner shade and one continuous lower fade behind the description and signup.
   The fade reaches 76% black before the text, so the lavender copy keeps its contrast over the banner's highlights. */
.page > .shade-full {
  background:
    radial-gradient(ellipse 50% 34% at 24% 30%, rgba(0,0,0,.62) 0%, rgba(0,0,0,.36) 50%, transparent 100%),
    linear-gradient(90deg, rgba(0,0,0,.66), rgba(0,0,0,.36) 34%, transparent 62%),
    linear-gradient(180deg, rgba(0,0,0,.35), transparent 22%, transparent 70%, rgba(0,0,0,.6));
}
.below { position: relative; }
.below::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -144px 0 -100vh;
  pointer-events: none;
  background: linear-gradient(180deg,
    rgba(0,0,0,0) 0,
    rgba(0,0,0,.12) 40px,
    rgba(0,0,0,.34) 88px,
    rgba(0,0,0,.76) 144px,
    rgba(0,0,0,.76) 100%);
}
.below .lede, .below .signup-intro span:last-child, .below .note {
  color: var(--text-secondary);
}
@media (max-width: 899px) {
  .page > .shade-full {
    background: linear-gradient(180deg,
      rgba(0,0,0,.62) 0%, rgba(0,0,0,.5) 22%,
      rgba(0,0,0,.16) 35%, transparent 50%, rgba(0,0,0,.6) 100%);
  }
}