/* Sway's original four layers cover the hero boundary. The transparent overlay
   belongs to the next section, and enters only after the cinematic last frame. */
body.yf-cinematic-page #premium { position:relative; }
.premium-wave {
  --wave-height:108px;
  position:absolute; inset:calc(2px - var(--wave-height)) 0 auto;
  height:var(--wave-height); z-index:5; background:transparent;
  pointer-events:none; opacity:0; visibility:hidden;
}
.premium-wave.is-revealed { opacity:1; visibility:visible; transition:opacity .25s ease-out; }
.premium-wave .kd-row-separator { position:absolute; inset:auto 0 -1px; width:100%; }
.premium-wave svg { display:block; width:100%; height:var(--wave-height); }
.premium-wave .separator-waves-parallax>use { animation:move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite; }
.premium-wave .separator-waves-parallax>use:nth-child(1) { animation-delay:-2s; animation-duration:7s; }
.premium-wave .separator-waves-parallax>use:nth-child(2) { animation-delay:-3s; animation-duration:10s; }
.premium-wave .separator-waves-parallax>use:nth-child(3) { animation-delay:-4s; animation-duration:13s; }
.premium-wave .separator-waves-parallax>use:nth-child(4) { animation-delay:-5s; animation-duration:20s; }
@keyframes move-forever { from { transform:translate3d(-90px,0,0); } to { transform:translate3d(85px,0,0); } }
.premium-wave:not(.is-revealed) use,
.premium-wave.is-outside-viewport use { animation-play-state:paused; }
@media(max-width:767px) { .premium-wave { --wave-height:76px; } }
@media(prefers-reduced-motion:reduce) {
  .premium-wave use { animation:none!important; }
  .premium-wave.is-revealed { transition:none; }
}
