:root {
  --preloader-color: #487eb0;
  --preloader-z: 99999;
}

/* Reserve the classic scrollbar lane from the first paint. The preloader
   temporarily locks document scrolling; without a stable gutter, releasing
   that lock narrows the Hero and forces a late full-width repaint. */
html {
  scrollbar-gutter: stable;
}

/* The reserved lane sits outside the fixed overlay in Chromium. Paint it as
   part of the opaque shell only; after Hero release the document owns it. */
html.is-preloading {
  background-color: var(--preloader-color);
  scrollbar-color: var(--preloader-color) var(--preloader-color);
}

html.is-preloading::-webkit-scrollbar-track,
html.is-preloading::-webkit-scrollbar-thumb {
  background-color: var(--preloader-color);
}

* {
  box-sizing: border-box;
}

html.is-preloading,
html.is-preloading body {
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

/* Compact runtime CSS is asynchronous. Keep the document out of paint until
   those styles apply, then allow the Hero to paint behind the opaque shell. */
html.is-preloading #smooth-wrapper {
  visibility: hidden;
}

html.is-preloading.slc-critical-styles-ready #smooth-wrapper {
  visibility: visible;
}

/* While Hero media is pending, expose a deterministic dark surface instead
   of the light document canvas. Copy can paint independently above it. */
html.is-preloading .hero,
html.is-preloading .hero-media,
html[data-slc-preloader-phase="released"]:not([data-slc-hero-ready="ready"]) .hero,
html[data-slc-preloader-phase="released"]:not([data-slc-hero-ready="ready"]) .hero-media {
  background: #06152b;
}

#slc-preloader-mount {
  position: fixed;
  z-index: var(--preloader-z);
  inset: 0;
  background: var(--preloader-color);
}

#slc-preloader-mount:empty::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 42px;
  height: 42px;
  border: 3px solid rgb(255 255 255 / 0.24);
  border-top-color: rgb(255 255 255 / 0.88);
  border-radius: 50%;
  animation: slc-preloader-bootstrap-spin 0.8s linear infinite;
  content: "";
  translate: -50% -50%;
}

/* Cover the outgoing document during a hard navigation/refresh. */
html.is-page-leaving {
  overflow: hidden;
}

html.is-page-leaving::before {
  position: fixed;
  z-index: calc(var(--preloader-z) + 1);
  inset: 0;
  background: var(--preloader-color, #487eb0);
  content: "";
  pointer-events: none;
}

@keyframes slc-preloader-bootstrap-spin {
  to { transform: rotate(360deg); }
}

body {
  margin: 0;
}