/* Slow, diffuse light stays behind the editorial content. */
.hero:before{filter:none;transform-origin:55% 40%;animation:hero-light-a 24s ease-in-out infinite alternate;will-change:transform,opacity}
.hero:after{filter:none;transform-origin:65% 70%;animation:hero-light-b 29s ease-in-out infinite alternate;will-change:transform,opacity}

.home-intro,.page-opening,.about-opening,.detail-overview,.project-directory,.practice-section,.site-footer{position:relative;isolation:isolate;overflow:hidden}
.home-intro::before,.page-opening::before,.about-opening::before,.detail-overview::before,.project-directory::before,.practice-section::before,.site-footer::before{
  content:"";position:absolute;z-index:0;inset:-24%;pointer-events:none;
  background:radial-gradient(ellipse 42% 48% at 25% 45%,rgba(137,78,230,.22),transparent 72%),radial-gradient(ellipse 37% 44% at 78% 62%,rgba(40,97,180,.15),transparent 75%);
  animation:ambient-drift 27s ease-in-out infinite alternate;will-change:transform;
}
.home-intro>:not(style),.page-opening>:not(style),.about-opening>:not(style),.detail-overview>:not(style),.project-directory>:not(style),.practice-section>:not(style),.site-footer>:not(style){position:relative;z-index:1}
.page-opening::before,.detail-overview::before{animation-delay:-13s}
.about-opening::before,.site-footer::before{animation-delay:-7s}
.project-directory::before,.practice-section::before{
  background:radial-gradient(ellipse 38% 42% at 22% 54%,rgba(176,139,217,.095),transparent 76%),radial-gradient(ellipse 37% 40% at 77% 34%,rgba(142,176,219,.075),transparent 77%);
  animation-duration:33s;
}
.practice-section::before{animation-delay:-16s}

@keyframes hero-light-a{from{transform:translate3d(-5%,-5%,0) scale(.94);opacity:.78}to{transform:translate3d(10%,8%,0) scale(1.14);opacity:1}}
@keyframes hero-light-b{from{transform:translate3d(7%,7%,0) scale(.9);opacity:.65}to{transform:translate3d(-10%,-8%,0) scale(1.18);opacity:1}}
@keyframes ambient-drift{from{transform:translate3d(-4%,-2%,0) scale(.98)}to{transform:translate3d(5%,3%,0) scale(1.08)}}

@media(max-width:760px){
  .home-intro::before,.page-opening::before,.about-opening::before,.detail-overview::before,.project-directory::before,.practice-section::before,.site-footer::before{inset:-12%;background-size:130% 100%}
  .hero:before{left:-12%;width:112vw;height:85%}
  .hero:after{width:85vw}
}
@media(prefers-reduced-motion:reduce){
  .hero:before,.hero:after,.home-intro::before,.page-opening::before,.about-opening::before,.detail-overview::before,.project-directory::before,.practice-section::before,.site-footer::before{animation:none;transform:none;will-change:auto}
}