/* Home hero: soft iridescent light using only the existing BCOTN palette. */
.home-hero{
  isolation:isolate;
  background:
    linear-gradient(118deg,rgba(21,19,47,.99) 0%,rgba(45,43,127,.92) 54%,rgba(143,50,141,.74) 100%),
    #15132f;
}

.home-hero:before,
.home-hero:after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  border:0;
}

.home-hero:before{
  width:min(900px,72vw);
  aspect-ratio:1.12;
  right:-14%;
  top:-30%;
  border-radius:42% 58% 61% 39% / 53% 42% 58% 47%;
  background:
    conic-gradient(
      from 205deg at 51% 49%,
      rgba(88,184,214,.44),
      rgba(77,90,194,.55) 24%,
      rgba(143,50,141,.62) 50%,
      rgba(214,90,176,.54) 71%,
      rgba(88,184,214,.38) 100%
    );
  filter:blur(72px) saturate(112%);
  opacity:.88;
  transform:translate3d(0,0,0) rotate(-8deg) scale(1.02);
  animation:bcotn-halo-drift 18s ease-in-out infinite alternate;
}

.home-hero:after{
  width:min(720px,60vw);
  aspect-ratio:1;
  right:-4%;
  bottom:-48%;
  border-radius:58% 42% 47% 53% / 44% 61% 39% 56%;
  background:
    radial-gradient(circle at 24% 30%,rgba(88,184,214,.44),transparent 38%),
    radial-gradient(circle at 68% 34%,rgba(214,90,176,.46),transparent 45%),
    radial-gradient(circle at 46% 76%,rgba(143,50,141,.58),transparent 53%);
  filter:blur(88px) saturate(118%);
  opacity:.78;
  transform:translate3d(0,0,0) rotate(10deg);
  animation:bcotn-halo-breathe 22s ease-in-out infinite alternate;
}

.home-hero .hero-inner{position:relative;z-index:2}

@keyframes bcotn-halo-drift{
  0%{transform:translate3d(-3%,2%,0) rotate(-8deg) scale(1.02)}
  48%{transform:translate3d(4%,7%,0) rotate(5deg) scale(1.08)}
  100%{transform:translate3d(-1%,13%,0) rotate(12deg) scale(1.04)}
}

@keyframes bcotn-halo-breathe{
  0%{transform:translate3d(2%,-4%,0) rotate(10deg) scale(.96);opacity:.68}
  55%{transform:translate3d(-7%,2%,0) rotate(-3deg) scale(1.07);opacity:.84}
  100%{transform:translate3d(3%,-1%,0) rotate(-11deg) scale(1.02);opacity:.75}
}

@media(max-width:720px){
  .home-hero:before{width:115vw;right:-55%;top:-14%;filter:blur(56px);opacity:.72}
  .home-hero:after{width:92vw;right:-42%;bottom:-20%;filter:blur(62px);opacity:.66}
}

@media(prefers-reduced-motion:reduce){
  .home-hero:before,.home-hero:after{animation:none}
}