/* EFXspirit section-aware loading screen. Full-screen, brand-led and intentionally frameless. */
#efx-section-loading{
  --efx-load-accent:#4bdcff;
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  padding:28px;
  background:
    radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--efx-load-accent) 10%,transparent),transparent 26%),
    radial-gradient(circle at 18% 14%,rgba(75,220,255,.045),transparent 24%),
    linear-gradient(180deg,#05070a,#080b0f 62%,#05070a);
  color:#f4f5f4;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .18s ease,visibility 0s linear .18s;
}
html.efx-loading-active #efx-section-loading,
html.efx-identity-callback-pending #efx-section-loading{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity .18s ease;
}
html.efx-loading-active,
html.efx-identity-callback-pending{overflow:hidden}
.efxLoadingStage{
  width:min(100%,520px);
  text-align:center;
  position:relative;
  isolation:isolate;
}
.efxLoadingStage:before{
  content:"";
  position:absolute;
  left:50%;top:42%;
  width:310px;height:310px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--efx-load-accent) 10%,transparent),transparent 68%);
  filter:blur(10px);
  z-index:-1;
}
.efxLoadingBrand{
  margin-bottom:28px;
  font-size:11px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:#9da8ae;
}
.efxLoadingBrand b{color:#e8ecee;font-weight:600}
.efxLoadingGlyph{
  position:relative;
  width:92px;height:92px;
  margin:0 auto 30px;
}
.efxLoadingGlyph:before,
.efxLoadingGlyph:after{
  content:"";
  position:absolute;
  left:50%;top:50%;
  width:82px;height:2px;
  transform-origin:center;
  background:linear-gradient(90deg,transparent 0 8%,var(--efx-load-accent) 46% 54%,transparent 92% 100%);
  box-shadow:0 0 18px color-mix(in srgb,var(--efx-load-accent) 34%,transparent);
}
.efxLoadingGlyph:before{transform:translate(-50%,-50%) rotate(45deg)}
.efxLoadingGlyph:after{transform:translate(-50%,-50%) rotate(-45deg)}
.efxLoadingRing{
  position:absolute;
  inset:8px;
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--efx-load-accent) 22%,transparent);
  animation:efxLoadingTurn 7s linear infinite;
}
.efxLoadingRing:before,.efxLoadingRing:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--efx-load-accent) 11%,transparent);
}
.efxLoadingRing:before{inset:-9px;border-style:dashed}
.efxLoadingRing:after{inset:11px}
@keyframes efxLoadingTurn{to{transform:rotate(360deg)}}
.efxLoadingEyebrow{
  color:var(--efx-load-accent);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  margin-bottom:10px;
}
.efxLoadingTitle{
  margin:0;
  font-size:clamp(34px,7vw,52px);
  line-height:1;
  letter-spacing:-.045em;
  font-weight:430;
}
.efxLoadingDetail{
  margin:15px auto 0;
  max-width:420px;
  color:#b7c0c5;
  font-size:14px;
  line-height:1.55;
}
.efxLoadingLine{
  position:relative;
  width:min(270px,68vw);
  height:1px;
  margin:28px auto 16px;
  overflow:hidden;
  background:rgba(255,255,255,.10);
}
.efxLoadingLine i{
  position:absolute;
  top:0;left:-42%;
  width:42%;height:1px;
  background:linear-gradient(90deg,transparent,var(--efx-load-accent),transparent);
  animation:efxLoadingTravel 1.3s ease-in-out infinite;
}
@keyframes efxLoadingTravel{0%{left:-42%}100%{left:100%}}
.efxLoadingFoot{
  margin:0;
  color:#89959b;
  font-size:10.5px;
  letter-spacing:.04em;
}
@media(max-width:640px){
  #efx-section-loading{padding:22px}
  .efxLoadingBrand{margin-bottom:24px;font-size:10.5px}
  .efxLoadingGlyph{width:82px;height:82px;margin-bottom:27px}
  .efxLoadingGlyph:before,.efxLoadingGlyph:after{width:72px}
  .efxLoadingTitle{font-size:38px}
  .efxLoadingDetail{font-size:14px;max-width:330px}
  .efxLoadingFoot{font-size:10.5px}
}
@media(prefers-reduced-motion:reduce){
  #efx-section-loading{transition:none}
  .efxLoadingRing,.efxLoadingLine i{animation:none}
  .efxLoadingLine i{left:29%}
}
