/* Decorative environments only. No layout, input or access-control behavior. */
body[data-environment] { isolation:isolate; }
.page-environment {
  position:fixed;
  inset:0;
  z-index:-1;
  overflow:hidden;
  pointer-events:none;
  user-select:none;
  background:#09090b;
}

/* Main site: visible charcoal wisps, with transform-only drift. */
body[data-environment="site"] .page-environment::before,
body[data-environment="site"] .page-environment::after {
  content:"";
  position:absolute;
  inset:-18%;
  pointer-events:none;
  opacity:.72;
  background:
    radial-gradient(ellipse 48% 18% at 20% 32%,rgba(104,108,114,.52),transparent 100%),
    radial-gradient(ellipse 42% 24% at 80% 66%,rgba(93,99,107,.48),transparent 100%),
    radial-gradient(ellipse 54% 16% at 40% 91%,rgba(88,93,101,.40),transparent 100%);
  animation:mist-near 36s ease-in-out -9s infinite;
}
body[data-environment="site"] .page-environment::after {
  opacity:.56;
  background:
    radial-gradient(ellipse 44% 20% at 75% 24%,rgba(106,110,117,.46),transparent 100%),
    radial-gradient(ellipse 52% 16% at 25% 62%,rgba(95,101,111,.48),transparent 100%);
  animation:mist-far 53s ease-in-out -19s infinite;
}
@keyframes mist-near {
  0%,100% { transform:translate(-12%,-4%) scale(1.04); }
  50% { transform:translate(12%,5%) scale(1.08); }
}
@keyframes mist-far {
  0%,100% { transform:translate(13%,5%) scale(1.06); }
  50% { transform:translate(-12%,-5%) scale(1.02); }
}

/* Let the environment show through broad page surfaces, not cards or controls. */
body[data-environment="site"] :is(.hero,.featured-case-section,.how-section,
  .cases-page-hero,.cases-library,.faq-page-hero,.faq-section,.info-page-hero,
  .info-page-section,.legal-section,.bellmere-hero,.bellmere-included,
  .bellmere-purchase,.reviews-section) {
  background:rgba(11,11,13,.30);
}

/* Reusable case system: each future case supplies these custom properties. */
body[data-environment="case"] {
  --case-environment-image:none;
  --case-environment-position:50% 50%;
  --case-environment-shade:rgba(6,8,12,.84);
}
body[data-case-theme="bellmere"] {
  --case-environment-image:url("/bellmere-night.webp");
}
body[data-environment="case"]:not(.access-pending) > .page-environment {
  background-image:
    linear-gradient(var(--case-environment-shade),var(--case-environment-shade)),
    var(--case-environment-image);
  background-position:center,var(--case-environment-position);
  background-size:cover;
  background-repeat:no-repeat;
}
body[data-environment="case"] > .preview-gate { background:transparent; }
/* The existing access-pending mask and all opaque evidence/form panels stay intact. */
@media(max-width:768px) {
  body[data-environment="site"] .page-environment::before,
  body[data-environment="site"] .page-environment::after { inset:-18%; }
  body[data-environment="site"] .page-environment::before { opacity:.65; }
  body[data-environment="site"] .page-environment::after { opacity:.50; }
  body[data-case-theme="bellmere"] {
    --case-environment-image:url("/bellmere-night-mobile.webp");
    --case-environment-position:60% 50%;
    --case-environment-shade:rgba(6,8,12,.87);
  }
}
@media(prefers-reduced-motion:reduce) {
  body[data-environment="site"] .page-environment::before,
  body[data-environment="site"] .page-environment::after {
    animation:none;
    transform:none;
  }
}
@media(forced-colors:active), print {
  .page-environment { display:none; }
}
