/* A single sphere scene spans About and Work without a fade at their boundary. */
.work-contact-scene.studio-scene{
  position:relative;isolation:isolate;overflow:hidden;background:#050505!important;
}
.studio-scene::before{content:none;display:none}
.about-work-scene{
  position:relative;isolation:isolate;overflow:hidden;background:#050505;
}
.about-work-scene::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:url("assets/backgrounds/about-work-spheres.png") center top/cover no-repeat;
  background-position:center calc(-1 * clamp(0px,calc(5vw - 42px),54px));
  mask-image:linear-gradient(180deg,transparent,#000 16px);
}
.about-work-scene::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,#050505,rgba(5,5,5,.85) 30px,transparent 180px),
    linear-gradient(90deg,rgba(5,5,5,.8),rgba(5,5,5,.74) 44%,rgba(5,5,5,.52) 65%,transparent 90%);
}
.about-work-scene>:is(#about.about-studio,#work.work-cinematic){
  position:relative;z-index:2;isolation:auto;overflow:hidden;background:transparent!important;
}
#work.work-cinematic{padding-top:var(--work-content-top,clamp(80px,10svh,116px))!important}
:is(.about-work-scene,.studio-scene)>:is(#about.about-studio,#work.work-cinematic,#contact.contact-cinematic)::before,
:is(.about-work-scene,.studio-scene)>:is(#about.about-studio,#work.work-cinematic,#contact.contact-cinematic)::after{
  content:none!important;display:none!important;
}
:is(.about-work-scene,.studio-scene)>:is(#work.work-cinematic,#contact.contact-cinematic){border-top-color:transparent}
#about .studio-toolkit{position:relative;isolation:isolate}
#about .studio-toolkit::before{
  content:"";position:absolute;inset:0 -20px -8px;z-index:-1;pointer-events:none;
  background:rgba(5,5,5,.6);filter:blur(18px);
}
#contact.contact-cinematic{isolation:isolate;background:transparent!important}
#contact.contact-cinematic>.contact-atmosphere{display:none}
#contact.contact-cinematic>.contact-studio-background[aria-hidden]{
  position:absolute!important;inset:0;z-index:-1!important;pointer-events:none;overflow:hidden;
  background:#050505;mask-image:linear-gradient(180deg,transparent,#000 16px,#000 calc(100% - 24px),transparent);
}
#contact .contact-studio-background img{width:100%;height:100%;object-fit:cover;object-position:center top;max-width:none}
#contact .contact-studio-background::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(5,5,5,.72),rgba(5,5,5,.4) 30%,transparent 59%);
}
@media(max-width:700px){
  .about-work-scene::after{background:linear-gradient(0deg,#050505,transparent 140px),linear-gradient(rgba(5,5,5,.72),rgba(5,5,5,.72))}
  #contact .contact-studio-background::after{background:rgba(5,5,5,.66)}
}