/* Portal dashboard sky background for interior public pages only. */
body:not(.home-page){
  isolation:isolate;
  background:#dff1ff url("becca-alpine-background.png") 70% center/cover fixed no-repeat!important;
}

body:not(.home-page) > .cloud-bg#cloudBg{
  position:fixed;
  z-index:0;
  inset:0;
  overflow:hidden;
  background:transparent!important;
  opacity:1!important;
}

/* Retire the old flat, gray cloud-band treatment on interior sections. */
body:not(.home-page) .cloud-section::before,
body:not(.home-page) .cloud-section::after{display:none!important}
body:not(.home-page) .cloud-bg-section{background:transparent!important;opacity:.5!important}
/* Remove the old full-width section seams that cut across the scenic sky. */
body:not(.home-page) .page-head,
body:not(.home-page) main > .section{border-bottom:0!important}

body:not(.home-page) > :not(#cloudBg){
  position:relative;
  z-index:1;
}

/* Replace the repeated cartoon cloud rows with one quiet atmospheric mist layer. */
body:not(.home-page) > #cloudBg .cloud-layer{display:none!important}

/* Match the translucent, slow-moving smoke wisps used in the portal dashboard. */
body:not(.home-page) > #cloudBg::after{
  position:absolute;
  inset:0;
  content:"";
  pointer-events:none;
  background:
    radial-gradient(ellipse 34% 15% at 5% 66%,rgba(255,255,255,.28),transparent 78%),
    radial-gradient(ellipse 28% 12% at 39% 79%,rgba(255,255,255,.22),transparent 80%),
    radial-gradient(ellipse 38% 15% at 78% 62%,rgba(255,255,255,.24),transparent 78%),
    radial-gradient(ellipse 25% 11% at 104% 83%,rgba(255,255,255,.22),transparent 80%);
  filter:blur(22px);
  animation:portal-smoke-drift 92s ease-in-out infinite alternate;
}

@keyframes portal-smoke-drift{
  from{transform:translate3d(-3%,1%,0) scale(1)}
  to{transform:translate3d(3%,-1%,0) scale(1.08)}
}

@media(prefers-reduced-motion:reduce){
  body:not(.home-page) > #cloudBg::after{animation:none}
}

@media(max-width:720px){
  body:not(.home-page){background-position:62% center}
  body:not(.home-page) #cloudBg .cloud-layer.back{opacity:.08}
  body:not(.home-page) #cloudBg .cloud-layer.mid{opacity:.14}
}
