/* Decorative animation is scoped to the first chapter only. */
#ch-hero .hero-background {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: #f3f2ee;
}
#ch-hero .hero-background iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  pointer-events: none;
}
#ch-hero > h1,
#ch-hero > .label,
#ch-hero > .meta,
#ch-hero > .cta,
#ch-hero > .hint { z-index: 1; }
#ch-hero h1 {
  top: 24vh;
  bottom: auto;
  font-size: clamp(52px, 8.4vw, 120px);
}
#ch-hero .cta { top: 37vh; bottom: auto; }
#ch-hero .hint {
  bottom: 3vh;
  padding: 8px 12px;
  border-radius: 30px;
  background: rgba(243, 242, 238, .90);
}
@media (max-width: 900px) {
  #ch-hero h1 { top: 24vh; bottom: auto; font-size: clamp(44px, 11vw, 84px); }
  #ch-hero .cta { top: 48vh; bottom: auto; }
}
@media (max-height: 600px) and (min-width: 601px) {
  #ch-hero h1 { top: 25vh; font-size: clamp(28px, 8vh, 46px); }
  #ch-hero .label, #ch-hero .meta { top: 22vh; }
  #ch-hero .label { display: none; }
  #ch-hero .cta { top: 45vh; right: var(--gutter); left: auto; padding: 12px 22px; }
  #ch-hero .hint { display: none; }
}
