.aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.aurora::before,.aurora::after{content:"";position:absolute;width:55vmax;height:55vmax;border-radius:50%;filter:blur(90px);animation:drift 22s ease-in-out infinite alternate}
.aurora::before{left:-15vmax;top:-20vmax;opacity:.26;background:radial-gradient(circle,#B9E7D0,transparent 65%)}
.aurora::after{right:-20vmax;bottom:-25vmax;opacity:.17;background:radial-gradient(circle,#E8AFA7,transparent 65%);animation-duration:28s;animation-delay:-8s}
@keyframes drift{to{transform:translate(12vmax,8vmax) scale(1.2)}}

.hero-text>*{opacity:0;translate:0 24px;animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards}
.hero-text>:nth-child(2){animation-delay:.12s}
.hero-text>:nth-child(3){animation-delay:.24s}
.hero-text>:nth-child(4){animation-delay:.36s}
.portrait{opacity:0;animation:fade 1.1s .3s ease forwards}
@keyframes rise{to{opacity:1;translate:0 0}}
@keyframes fade{to{opacity:1}}

.rv{opacity:0;translate:0 28px;transition:opacity .8s ease,translate .8s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;translate:0 0}

.music.on .eq i{animation:eq 1s ease-in-out infinite}
.music.on .eq i:nth-child(2){animation-delay:-.3s}
.music.on .eq i:nth-child(3){animation-delay:-.6s}
.music.on .eq i:nth-child(4){animation-delay:-.9s}
@keyframes eq{0%,100%{height:4px}50%{height:16px}}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv,.hero-text>*,.portrait{opacity:1;translate:none}
  html{scroll-behavior:auto}
}