/* The room settles into evening as its headline enters the viewport. */
.home-section {
  position: relative;
  isolation: isolate;
  transition: background-color 950ms ease;
}
.home-section::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(ellipse at 15% 30%, #ffba5a42, #df8c2418 38%, transparent 72%);
  opacity: 0;
  transition: opacity 950ms ease;
}
.home-section[data-room-light="on"] { background-color: #281e13; }
.home-section[data-room-light="on"]::before { opacity: 1; }
.home-copy h2 .home-light-line,
.home-copy h2 .home-light-line span { color: inherit; }
.home-light-line { white-space: nowrap; }
.home-light-word { display: inline-grid; vertical-align: top; text-align: left; }
.home-light-word > span {
  grid-area: 1 / 1;
  transition: opacity 550ms ease, transform 650ms cubic-bezier(.22,.8,.2,1);
}
.home-light-on { opacity: 0; transform: translateY(-.2em); }
.home-light-off { opacity: 1; transform: translateY(0); }
[data-room-light="on"] .home-light-on { opacity: 1; transform: translateY(0); }
[data-room-light="on"] .home-light-off { opacity: 0; transform: translateY(.2em); }
@media (prefers-reduced-motion: reduce) {
  .home-section, .home-section::before, .home-light-word > span { transition: none; }
}