/* These rules affect only the opening chapter and its scroll invitation. */
.hero-protection {
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(ellipse 100% 74% at 4% 92%, rgb(0 0 0 / .72), rgb(0 0 0 / .47) 34%, rgb(0 0 0 / .15) 63%, transparent 88%);
  opacity: 0;
  transition: opacity .55s var(--ease-out);
}
.is-hero .hero-protection { opacity: 1; }
.is-hero .text-protection { opacity: 0; }
.text-protection { transition: opacity .55s var(--ease-out); }
#apertura .scene-copy { max-width: 1220px; margin-top: clamp(5rem, 24svh, 14rem); }
#apertura .scene-copy::before { display: none; }
#apertura .scene-title--opening {
  max-width: 700px;
  text-align: left;
  font-size: clamp(3.5rem, 6.9vw, 6rem);
  line-height: 1.02;
  letter-spacing: -.035em;
}
#apertura .scene-title--opening .title-line > span { white-space: pre-line; }
#apertura .title-line + .title-line { margin-top: .22em; }
#apertura .scene-description {
  max-width: none;
  width: max-content;
  white-space: nowrap;
  margin-top: 1.8rem;
}
.scroll-cue {
  left: 50%;
  bottom: 2rem;
  width: auto;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .8rem;
  transform: translateX(-50%);
}
.scroll-cue .scroll-cue-line {
  position: relative;
  inset: auto;
  width: 1px;
  height: 40px;
  overflow: hidden;
  background: rgb(211 174 127 / .3);
}
.scroll-cue .scroll-cue-line::after {
  position: absolute;
  inset: 0;
  width: 1px;
  height: 100%;
  border: 0;
  background: var(--accent);
  animation: scroll-invitation 2.2s ease-in-out infinite;
}
.scroll-cue .scroll-cue-label {
  position: static;
  width: auto;
  height: auto;
  background: none;
  color: var(--accent);
  font-size: .625rem;
  line-height: 1;
  letter-spacing: .3em;
  text-indent: .3em;
}
.scroll-cue .scroll-cue-label::after { content: none; }
.has-scrolled .scroll-cue-line::after { animation: none; }
@keyframes scroll-invitation {
  0% { transform: translateY(-100%); opacity: 0; }
  25%, 60% { opacity: 1; }
  100% { transform: translateY(100%); opacity: 0; }
}
@media (max-width: 600px) {
  #apertura .scene-copy { margin-top: 20svh; }
  #apertura .scene-title--opening { font-size: clamp(2rem, 7.9vw, 3rem); line-height: 1.07; }
  #apertura .scene-description { font-size: clamp(.72rem, 3.15vw, 1rem); margin-top: 1.4rem; }
  .hero-protection { background: radial-gradient(ellipse 140% 65% at 0% 84%, rgb(0 0 0 / .76), rgb(0 0 0 / .42) 45%, transparent 95%); }
}
@media (max-height: 650px) {
  #apertura .scene-copy { margin-top: 8svh; }
  #apertura .scene-title--opening { font-size: clamp(1.65rem, 3.7vw, 2.75rem); }
  #apertura .scene-description { margin-top: 1rem; }
  .scroll-cue { bottom: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-protection, .text-protection { transition: none; }
  .scroll-cue .scroll-cue-line::after { animation: none; }
}