.conservatory .scene {
  animation: none;
  transform: scale(1.005) translate3d(0, 0, 0);
  will-change: auto;
}

.conservatory [data-scene-motion] {
  position: absolute;
  display: block;
  pointer-events: none;
  background:
    radial-gradient(ellipse 30% 10% at 38% 19%, rgba(18, 43, 26, .68) 48%, transparent 65%),
    radial-gradient(ellipse 27% 11% at 75% 34%, rgba(18, 43, 26, .62) 48%, transparent 65%),
    radial-gradient(ellipse 32% 10% at 30% 47%, rgba(18, 43, 26, .66) 48%, transparent 65%),
    radial-gradient(ellipse 29% 12% at 72% 64%, rgba(18, 43, 26, .60) 48%, transparent 65%),
    radial-gradient(ellipse 28% 11% at 34% 79%, rgba(18, 43, 26, .64) 48%, transparent 65%);
  transform-origin: 100% 0;
  animation: garden-foliage-sway 4.8s ease-in-out infinite;
  will-change: transform, opacity;
}

.foliage-shadow::before {
  content: "";
  position: absolute;
  inset: 8% 43% 8% 53%;
  background: linear-gradient(90deg, transparent, rgba(18, 43, 26, .48), transparent);
  transform: rotate(-10deg);
  pointer-events: none;
}

.foliage-shadow--canopy {
  top: 12%;
  right: -4%;
  width: 20%;
  height: 31%;
}

.conservatory .foliage-shadow--stairs {
  top: 66%;
  right: -3%;
  width: 19%;
  height: 29%;
  transform-origin: 100% 100%;
  animation-delay: -1.2s;
  animation-direction: reverse;
}

@keyframes garden-foliage-sway {
  0%, 100% { transform: translate3d(9px, -3px, 0) rotate(5deg); opacity: .46; }
  50% { transform: translate3d(-11px, 5px, 0) rotate(-5deg); opacity: .76; }
}

html[data-motion="paused"] .conservatory [data-scene-motion],
html[data-motion="hidden"] .conservatory [data-scene-motion] {
  animation-play-state: paused;
}

@media (max-width: 1000px) and (min-width: 601px) {
  .foliage-shadow--canopy { right: -6%; width: 21%; }
  .conservatory .foliage-shadow--stairs { right: -5%; width: 20%; }
}

@media (max-width: 600px) {
  .foliage-shadow--canopy {
    top: 10%;
    right: auto;
    left: -11%;
    width: 28%;
    height: 18%;
    max-height: 140px;
    transform-origin: 0 0;
  }

  .conservatory .foliage-shadow--stairs {
    top: 10%;
    right: -12%;
    width: 28%;
    height: 17%;
    max-height: 130px;
  }

  @keyframes garden-foliage-sway {
    0%, 100% { transform: translate3d(5px, -2px, 0) rotate(5deg); opacity: .46; }
    50% { transform: translate3d(-7px, 3px, 0) rotate(-5deg); opacity: .76; }
  }
}