/*
 * Optional site atmosphere layer.
 * Remove this stylesheet and ambient-grid.js from index.html to restore the
 * original CSS background without leaving feature-specific overrides behind.
 */

@media (min-width: 1301px) and (prefers-reduced-motion: no-preference) {
  body {
    isolation: isolate;
  }

  main,
  .site-footer {
    position: relative;
    z-index: 1;
  }

  .site-ambient-grid {
    position: fixed;
    z-index: 0;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
    pointer-events: none;
    transition: opacity 760ms ease;
  }

  .hero::before {
    transition: opacity 520ms ease;
  }

  body.is-ambient-grid-ready .site-ambient-grid {
    opacity: 1;
  }

  body.is-ambient-grid-ready .hero::before {
    opacity: 0;
  }
}