/* Shared atmospheric background for the customer-facing web and H5 surfaces. */
:root {
  --global-video-bg: url("https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260315_073750_51473149-4350-4920-ae24-c8214286f323.mp4");
}

body.has-global-video-bg {
  position: relative;
  isolation: isolate;
  background: #10131a !important;
}

body.has-global-video-bg .global-video-bg,
body.has-global-video-bg .global-video-shade {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

body.has-global-video-bg .global-video-bg {
  z-index: 0;
  object-fit: cover;
  object-position: center;
  filter: grayscale(.18) brightness(.66) saturate(.78);
  transform: translateZ(0);
}

body.has-global-video-bg .global-video-shade {
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(5, 8, 14, .56), rgba(8, 11, 18, .34) 42%, rgba(7, 10, 16, .62)),
    radial-gradient(circle at 50% 16%, rgba(255, 255, 255, .08), transparent 46%);
}

body.has-global-video-bg .app-shell,
body.has-global-video-bg .free-shell {
  position: relative;
  z-index: 10;
}

/* Preserve readable surfaces while letting the moving background remain visible around them. */
body.has-global-video-bg .topbar {
  background: rgba(5, 14, 27, .72) !important;
  backdrop-filter: blur(18px);
}

body.has-global-video-bg .page {
  background: transparent !important;
}

body.has-global-video-bg .free-page {
  background: transparent !important;
}

body.has-global-video-bg .free-panel {
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(18px);
}

/* The standalone free-energy card is light, so its content needs a dark text scale. */
body.free-page.has-global-video-bg .free-panel .free-title,
body.free-page.has-global-video-bg .free-panel h1.free-title {
  color: #172033 !important;
  text-shadow: none;
}

body.free-page.has-global-video-bg .free-panel .free-copy {
  color: #61708a !important;
}

body.free-page.has-global-video-bg .free-panel .form-label {
  color: #26364f !important;
}

body.free-page.has-global-video-bg .free-panel .free-method {
  color: #b42318 !important;
  background: rgba(255, 241, 240, .94) !important;
  border-color: #ff3b30 !important;
}

body.free-page.has-global-video-bg .free-panel .free-method i {
  color: #ff3b30 !important;
}

body.free-page.has-global-video-bg .free-panel .text-secondary {
  color: #68778f !important;
}

@media (max-width: 768px) {
  body.has-global-video-bg .global-video-bg {
    filter: grayscale(.12) brightness(.72) saturate(.76);
  }

  body.has-global-video-bg .global-video-shade {
    background: linear-gradient(180deg, rgba(5, 8, 14, .48), rgba(7, 10, 16, .56));
  }
}

@media (prefers-reduced-motion: reduce) {
  body.has-global-video-bg .global-video-bg {
    display: none;
  }
}