/* Shared loading screen for the static site. */
html.loader-active,
html.loader-active body{overflow:hidden;}

.site-loader{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  background:#000;
  opacity:1;
  visibility:visible;
  transition:opacity .55s ease, visibility .55s ease;
}

.site-loader.is-hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.site-loader-logo{
  width:clamp(64px,12vw,96px);
  height:clamp(64px,12vw,96px);
  display:block;
  animation:loader-pulse 1.6s ease-in-out infinite;
}

@keyframes loader-pulse{
  0%,100%{opacity:.55;transform:scale(.94);}
  50%{opacity:1;transform:scale(1);}
}

@media (prefers-reduced-motion:reduce){
  .site-loader-logo{animation:none;opacity:1;transform:none;}
  .site-loader{transition:none;}
}

/* Navigating from another page on the site back to the homepage: no black
   loader, just the incoming page blurred until it's ready, then it clears.
   Scoped to only apply `filter` while .blur-loading is present (and removed
   entirely once clear) — any filter value, even blur(0), gives an element
   a new containing block, which would break every position:fixed element
   on the page (nav, back-link, theme toggle) if left on body permanently. */
html.blur-loading body{
  filter:blur(22px);
  transition:filter .6s ease;
}
html.blur-loading.is-clear body{
  filter:blur(0);
}
@media (prefers-reduced-motion:reduce){
  html.blur-loading body{transition:none;}
}
