/* XSI DEPTH FIELD
   Gaussian-splat-inspired ambient depth layer.
   Page content never depends on this effect; it degrades to CSS atmosphere.
*/
html{background:#02070d}
body{background:transparent!important;position:relative;isolation:isolate}
body:before{display:none!important}
.xsi-depth-field{
  position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  background:
    radial-gradient(900px 650px at 82% 10%,rgba(16,63,82,.25),transparent 68%),
    radial-gradient(780px 620px at 10% 72%,rgba(11,54,61,.12),transparent 70%),
    linear-gradient(180deg,#02070d,#031019 100%);
}
.xsi-depth-field canvas{
  position:absolute;inset:-1.5%;width:103%;height:103%;display:block;
  opacity:0;filter:saturate(.9) contrast(1.03);
  transition:opacity .8s ease;
}
.xsi-depth-field.is-ready canvas{opacity:.50}
.xsi-depth-scrim{
  position:absolute;inset:0;
  background:
    radial-gradient(1000px 680px at 82% 8%,rgba(2,7,13,.10),rgba(2,7,13,.39) 66%,rgba(2,7,13,.68) 100%),
    linear-gradient(180deg,rgba(2,7,13,.22),rgba(2,7,13,.34) 38%,rgba(2,7,13,.60) 100%);
}
main,.site-footer{position:relative;z-index:2}
.site-header{background:rgba(2,7,13,.76)}
.section,.hero{position:relative}
@media(max-width:760px){
  .xsi-depth-field.is-ready canvas{opacity:.26}
  .xsi-depth-scrim{background:linear-gradient(180deg,rgba(2,7,13,.52),rgba(2,7,13,.75))}
}
@media(prefers-reduced-motion:reduce){.xsi-depth-field canvas{transition:none!important}}