/* Galaxy shader adapted from React Bits. Attribution: react-bits-LICENSE.txt. */
body { isolation: isolate; }
.galaxy-background {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background: radial-gradient(ellipse at 74% 22%, rgba(68, 81, 110, .13), transparent 60%),
              radial-gradient(ellipse at 14% 76%, rgba(141, 78, 49, .12), transparent 60%);
}
.galaxy-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: .5; transition: opacity .6s; }
.galaxy-background[data-motion="video"] .galaxy-canvas { opacity: .35; }
.galaxy-background::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .34;
  background-image: radial-gradient(1px 1px at 19px 31px, #e9dec9 95%, transparent),
                    radial-gradient(1px 1px at 102px 56px, #a5bfd5 95%, transparent),
                    radial-gradient(1px 1px at 63px 117px, #c0a078 95%, transparent);
  background-size: 193px 171px, 239px 211px, 281px 257px;
}
.galaxy-background[data-renderer="webgl2"]::before { opacity: 0; }
/* Let the shared starfield show through the original cinematic layers. */
.intro { background: transparent; }
.intro-bg { opacity: .08; }
.intro::after { background: linear-gradient(180deg, rgba(10,9,8,.62), rgba(10,9,8,.34) 45%, rgba(10,9,8,.6)); }
.works-band::before { opacity: .08; }
.works-band::after { background: linear-gradient(180deg, rgba(10,9,8,.5), rgba(10,9,8,.62) 50%, rgba(10,9,8,.5)); }
.craft-card, .process, .episodes { background-color: rgba(10,9,8,.88); }
.contact::before { opacity: .65; }
@media (max-width: 760px) {
  .galaxy-canvas { opacity: .7; }
  .intro-bg, .works-band::before { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .galaxy-canvas { transition: none; }
}

/* keep the starfield behind the content, never through the text */
.galaxy-background::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(130% 90% at 50% 0%, rgba(10, 9, 8, .18), rgba(10, 9, 8, .5) 72%),
    linear-gradient(180deg, rgba(10, 9, 8, .32), rgba(10, 9, 8, .12) 50%, rgba(10, 9, 8, .34));
}