/* LuxBMI Blend BG: existing indigo, typography and click targets remain intact.
   8.10-sec loop at 70pct of previous playback speed cuts the original last 1.5s, replaces only black GIF initialization frame, and fades at the forward endpoint. */
.lux-blend-bg {
  position: fixed;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none !important;
  user-select: none;
  -webkit-user-select: none;
  mix-blend-mode: screen;
  opacity: .10;
  background-color: #081435;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.lux-blend-bg__video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 50%;
  filter: hue-rotate(10deg) saturate(.76) brightness(.90);
}
/* Keep actual content crisp ABOVE the screen-blended clouds.
   Limit this to the page content wrappers; do not change section backgrounds,
   hero art, overlays, header controls, or existing panel layout. */
body.lux-home main .lux-shell,
body.lux-home .lux-footer .lux-shell {
  position: relative;
  z-index: 3;
}
/* Gentle cloud transparency fade on the turnarounds. This never darkens the
   background or adds a black overlay: only the video becomes less opaque,
   revealing the original indigo layer already below it. */
@keyframes lux-blend-bg-cloud-dissolve {
   0%, 42%, 58%, 100% { opacity: 1; }
   48%, 52% { opacity: .72; }
}
.lux-blend-bg--playing .lux-blend-bg__video {
  animation: lux-blend-bg-cloud-dissolve 8.095238s linear infinite;
}
.lux-blend-bg--paused .lux-blend-bg__video { animation-play-state: paused; }
.lux-blend-bg--still .lux-blend-bg__video { display: none; }
@media (max-width: 820px) {
  .lux-blend-bg { opacity: .08; }
  .lux-blend-bg__video { object-position: center center; }
}
@media (prefers-reduced-motion: reduce) {
  .lux-blend-bg__video { display: none !important; animation: none !important; }
}
@media (forced-colors: active) {
  .lux-blend-bg { display: none; }
}

/* The three-tier hero-to-indigocloud seam sits ABOVE decorative artwork but
   BELOW content. Original hero ::before/::after effects remain unchanged. */
/* ALL hero covers are opaque stacking contexts above the cloud animation.
   Covers stay fully visible. The existing bottom seam blends indigo at edges. */
.lux-hero, .lux-page-hero {
  position: relative;
  z-index: 4;
  isolation: isolate;
}
.lux-hero-blend-seam {
  --lux-seam-rgb: 4, 17, 38;
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: clamp(110px, 12vw, 180px);
  z-index: 1;
  pointer-events: none !important;
  background: linear-gradient(to bottom,
    rgba(var(--lux-seam-rgb), 0) 0%,
    rgba(var(--lux-seam-rgb), .22) 48%,
    rgba(var(--lux-seam-rgb), .96) 100%);
}
.lux-page-hero > .lux-hero-blend-seam { --lux-seam-rgb: 6, 21, 44; }
.lux-hero > .lux-shell,
.lux-hero > .lux-hero__inner,
.lux-hero > .lux-hero-services,
.lux-page-hero > .lux-page-hero__grid { position: relative; z-index: 3; }
@media(max-width:600px) { .lux-hero-blend-seam { height: 118px; } }
@media(forced-colors:active) { .lux-hero-blend-seam { display:none; } }