/* Recreates the animated pastel backdrop from the STUDIO iframe. */
#video {
  background: radial-gradient(ellipse 68% 84% at 88% 16%, #bfeeff 0%, transparent 78%),
              radial-gradient(ellipse 75% 76% at 42% 110%, #e7dff5 0%, transparent 76%),
              linear-gradient(110deg, #b5c7e6 0%, #c7d5ec 54%, #c5e5f3 100%);
  background-size: 120% 120%;
  animation: gradient-drift 22s ease-in-out infinite alternate;
}
@media (max-width: 600px) {
  #video {
    background: radial-gradient(ellipse 95% 72% at 95% 105%, #eee4f4 0%, transparent 82%),
                linear-gradient(155deg, #b9c8e8 0%, #c4d0eb 48%, #dcdff1 100%);
    background-size: 120% 120%;
  }
}
#video::after {
  content: "";
  position: absolute;
  inset: 0;
  background: #f7f8fa;
  pointer-events: none;
  animation: backdrop-enter 1.1s ease forwards;
}
@keyframes gradient-drift {
  to { background-position: 96% 22%, 54% 92%, 0 0; }
}
@keyframes backdrop-enter {
  to { opacity: 0; }
}
html { scroll-behavior: smooth; }
.sd.studio-reveal {
  opacity: 0 !important;
  transition: opacity 1800ms cubic-bezier(.4,.4,0,1) 800ms,
              transform 1800ms cubic-bezier(.4,.4,0,1) 800ms;
}
.sd.studio-reveal.studio-reveal-rise { transform: translateY(30px) !important; }
.sd.studio-reveal.is-visible { opacity: 1 !important; transform: translateY(0) !important; }
.studio-banner-popover, a[href*="studio.design/?utm_source"] { display: none !important; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  #video, #video::after { animation: none; }
  #video::after { display: none; }
  .sd.studio-reveal { opacity: 1 !important; transform: none !important; transition: none; }
}
