/*
  SPACE TOOLS BRAND GLOW
  Important:
  The actual SVG artwork is NOT modified.
*/

.site-header .topbar {
  min-height: 90px !important;
}


/* ------------------------------------------------------------
   Brand footprint
   ------------------------------------------------------------ */

body .site-header .topbar > a.brand {
  position: relative !important;

  width: 104px !important;
  min-width: 104px !important;

  height: 78px !important;
  min-height: 78px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;

  overflow: visible !important;
}


/* ------------------------------------------------------------
   Logo stage
   ------------------------------------------------------------ */

body .site-header .topbar
.brand
.brand-logo-wrap {

  position: relative !important;

  width: 94px !important;
  height: 76px !important;

  display: grid !important;
  place-items: center !important;

  overflow: visible !important;
  isolation: isolate;

  transform: translateZ(0);
}


/* ------------------------------------------------------------
   Soft energy aura
   ------------------------------------------------------------ */

body .site-header .topbar
.brand
.brand-logo-wrap::before {

  content: "" !important;

  position: absolute !important;
  inset: 5px 8px !important;

  display: block !important;

  border: 0 !important;
  border-radius: 50% !important;

  background:
    radial-gradient(
      ellipse at center,
      rgba(255,255,255,.13) 0%,
      rgba(185,139,230,.16) 20%,
      rgba(111,45,163,.13) 38%,
      rgba(51,0,102,.07) 53%,
      transparent 72%
    ) !important;

  filter: blur(10px);

  opacity: .72 !important;

  transform:
    scale(1.03)
    translateZ(0) !important;

  pointer-events: none;

  z-index: -2 !important;

  animation:
    stLogoAura 4.8s ease-in-out infinite;
}


/* ------------------------------------------------------------
   Subtle futuristic light ring
   ------------------------------------------------------------ */

body .site-header .topbar
.brand
.brand-logo-wrap::after {

  content: "" !important;

  position: absolute !important;

  width: 88px !important;
  height: 43px !important;

  left: 2px !important;
  top: 17px !important;

  display: block !important;

  border-radius: 50% !important;

  border:
    1px solid
    rgba(185,139,230,.18) !important;

  background: transparent !important;

  box-shadow:
    0 0 9px rgba(185,139,230,.08),
    inset 0 0 9px rgba(185,139,230,.035);

  opacity: .7 !important;

  transform:
    rotate(-20deg)
    translateZ(0) !important;

  transform-origin: center;

  pointer-events: none;

  z-index: -1 !important;

  animation:
    stLogoRing 8s ease-in-out infinite;
}


/* ------------------------------------------------------------
   ORIGINAL LOGO
   No path / SVG modification.
   ------------------------------------------------------------ */

html body .site-header .topbar
a.brand
.brand-logo-wrap
img.spacetools-icon-logo {

  width: auto !important;

  height: 72px !important;
  max-height: none !important;
  max-width: none !important;

  display: block !important;

  object-fit: contain !important;

  opacity: 1 !important;

  transform:
    translateZ(0)
    scale(1) !important;

  filter:
    brightness(1.12)
    drop-shadow(
      0 0 2px
      rgba(255,255,255,.58)
    )
    drop-shadow(
      0 0 7px
      rgba(255,255,255,.20)
    )
    drop-shadow(
      0 0 13px
      rgba(185,139,230,.23)
    )
    drop-shadow(
      0 0 24px
      rgba(51,0,102,.32)
    )
    drop-shadow(
      0 7px 18px
      rgba(0,0,0,.7)
    ) !important;

  transition:
    transform .32s cubic-bezier(.2,.8,.2,1),
    filter .32s ease !important;

  animation:
    stLogoGlow 5s ease-in-out infinite;
}


/* ------------------------------------------------------------
   Hover
   ------------------------------------------------------------ */

html body .site-header .topbar
a.brand:hover
.brand-logo-wrap
img.spacetools-icon-logo {

  transform:
    translateY(-1px)
    scale(1.075)
    translateZ(0) !important;

  filter:
    brightness(1.18)
    drop-shadow(
      0 0 3px
      rgba(255,255,255,.76)
    )
    drop-shadow(
      0 0 10px
      rgba(255,255,255,.30)
    )
    drop-shadow(
      0 0 18px
      rgba(185,139,230,.40)
    )
    drop-shadow(
      0 0 31px
      rgba(51,0,102,.46)
    )
    drop-shadow(
      0 9px 20px
      rgba(0,0,0,.72)
    ) !important;
}


body .site-header .topbar
.brand:hover
.brand-logo-wrap::before {

  opacity: 1 !important;

  transform:
    scale(1.14)
    translateZ(0) !important;
}


body .site-header .topbar
.brand:hover
.brand-logo-wrap::after {

  opacity: .95 !important;

  border-color:
    rgba(185,139,230,.40) !important;

  transform:
    rotate(-25deg)
    scale(1.04)
    translateZ(0) !important;
}


/* ------------------------------------------------------------
   Animations
   ------------------------------------------------------------ */

@keyframes stLogoAura {

  0%,
  100% {
    opacity: .58;
    filter: blur(10px);
  }

  50% {
    opacity: .9;
    filter: blur(13px);
  }
}


@keyframes stLogoRing {

  0%,
  100% {
    opacity: .48;
    transform:
      rotate(-20deg)
      scale(1);
  }

  50% {
    opacity: .82;
    transform:
      rotate(-16deg)
      scale(1.035);
  }
}


@keyframes stLogoGlow {

  0%,
  100% {
    filter:
      brightness(1.10)
      drop-shadow(
        0 0 2px
        rgba(255,255,255,.52)
      )
      drop-shadow(
        0 0 7px
        rgba(255,255,255,.17)
      )
      drop-shadow(
        0 0 13px
        rgba(185,139,230,.20)
      )
      drop-shadow(
        0 0 23px
        rgba(51,0,102,.27)
      )
      drop-shadow(
        0 7px 18px
        rgba(0,0,0,.7)
      );
  }

  50% {
    filter:
      brightness(1.16)
      drop-shadow(
        0 0 3px
        rgba(255,255,255,.68)
      )
      drop-shadow(
        0 0 9px
        rgba(255,255,255,.25)
      )
      drop-shadow(
        0 0 17px
        rgba(185,139,230,.32)
      )
      drop-shadow(
        0 0 29px
        rgba(51,0,102,.38)
      )
      drop-shadow(
        0 7px 18px
        rgba(0,0,0,.7)
      );
  }
}


/* ------------------------------------------------------------
   Responsive
   ------------------------------------------------------------ */

@media (max-width: 1100px) {

  .site-header .topbar {
    min-height: 72px !important;
  }

  body .site-header .topbar > a.brand {
    width: 78px !important;
    min-width: 78px !important;
    height: 62px !important;
    min-height: 62px !important;
  }

  body .site-header .topbar
  .brand
  .brand-logo-wrap {

    width: 72px !important;
    height: 60px !important;
  }

  html body .site-header .topbar
  a.brand
  .brand-logo-wrap
  img.spacetools-icon-logo {

    height: 57px !important;
  }

  body .site-header .topbar
  .brand
  .brand-logo-wrap::after {

    width: 67px !important;
    height: 33px !important;

    left: 2px !important;
    top: 14px !important;
  }
}


@media (prefers-reduced-motion: reduce) {

  body .site-header .brand-logo-wrap::before,
  body .site-header .brand-logo-wrap::after,
  body .site-header img.spacetools-icon-logo {

    animation: none !important;
  }
}


/* BRAND POLISH — remove added outer ring only */
.brand-logo-wrap::before {
  display: none !important;
}

/* Preserve the original SpaceTools symbol and futuristic glow */
.brand .spacetools-icon-logo,
.brand img.spacetools-icon-logo {
  filter:
    drop-shadow(0 0 3px rgba(255,255,255,.50))
    drop-shadow(0 0 9px rgba(255,255,255,.18))
    drop-shadow(0 0 17px rgba(185,139,230,.32))
    drop-shadow(0 0 30px rgba(51,0,102,.34)) !important;
}

.brand:hover .spacetools-icon-logo,
.brand:hover img.spacetools-icon-logo {
  transform: scale(1.07);
  filter:
    drop-shadow(0 0 4px rgba(255,255,255,.65))
    drop-shadow(0 0 12px rgba(255,255,255,.24))
    drop-shadow(0 0 22px rgba(185,139,230,.46))
    drop-shadow(0 0 40px rgba(51,0,102,.44)) !important;
}


/* =========================================================
   SPACETOOLS HEADER + LOGO SIZE FINAL
   ========================================================= */

/* Desktop */
.site-header .topbar {
  min-height: 72px !important;

  padding-top: 7px !important;
  padding-bottom: 7px !important;

  align-items: center !important;
}


/* Brand container */
.site-header .brand {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  flex: 0 0 auto !important;

  margin: 0 !important;
  margin-left: 6px !important;

  padding: 0 !important;

  width: 64px !important;
  height: 58px !important;

  overflow: visible !important;
}


/* Remove oversized wrapper behaviour */
.site-header .brand-logo-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 58px !important;
  height: 58px !important;

  min-width: 58px !important;
  min-height: 58px !important;

  margin: 0 !important;
  padding: 0 !important;

  transform: none !important;
}


/* Actual SpaceTools logo */
.site-header .spacetools-icon-logo {
  display: block !important;

  width: 56px !important;
  height: 56px !important;

  max-width: 56px !important;
  max-height: 56px !important;

  object-fit: contain !important;
  object-position: center !important;

  margin: 0 !important;

  transform: none !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 680px) {

  /*
   * Header no longer consumes a huge part of the viewport.
   */
  .site-header .topbar {
    min-height: 76px !important;
    height: 76px !important;

    padding-top: 6px !important;
    padding-bottom: 6px !important;

    box-sizing: border-box !important;
  }


  /*
   * Bring the logo slightly inward from the left edge.
   */
  .site-header .brand {
    width: 60px !important;
    height: 56px !important;

    margin-left: 8px !important;
  }


  .site-header .brand-logo-wrap {
    width: 54px !important;
    height: 54px !important;

    min-width: 54px !important;
    min-height: 54px !important;
  }


  .site-header .spacetools-icon-logo {
    width: 52px !important;
    height: 52px !important;

    max-width: 52px !important;
    max-height: 52px !important;
  }


  /*
   * Keep avatar + hamburger vertically balanced with logo.
   */
  .site-header .topbar-actions {
    align-items: center !important;
  }

}


/* Very narrow phones */
@media (max-width: 390px) {

  .site-header .brand {
    margin-left: 6px !important;
  }

  .site-header .brand-logo-wrap,
  .site-header .spacetools-icon-logo {
    width: 50px !important;
    height: 50px !important;

    min-width: 50px !important;
    min-height: 50px !important;

    max-width: 50px !important;
    max-height: 50px !important;
  }

}

/* SPACESTL_HEADER_LOGO_BIG_V2 */

#st-navigation .brand {
  width: 104px !important;
  min-width: 104px !important;
  height: 88px !important;
  min-height: 88px !important;
  margin-left: 0 !important;
}

#st-navigation .brand-logo-wrap {
  width: 100px !important;
  min-width: 100px !important;
  max-width: 100px !important;

  height: 88px !important;
  min-height: 88px !important;
  max-height: 88px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#st-navigation .brand-logo-wrap img.spacetools-icon-logo {
  width: 90px !important;
  min-width: 90px !important;
  max-width: 90px !important;

  height: 90px !important;
  min-height: 90px !important;
  max-height: 90px !important;

  object-fit: contain !important;
  transform: none !important;
}

@media (max-width: 900px) {

  #st-navigation .brand {
    width: 78px !important;
    min-width: 78px !important;
    height: 68px !important;
    min-height: 68px !important;
  }

  #st-navigation .brand-logo-wrap {
    width: 74px !important;
    min-width: 74px !important;
    max-width: 74px !important;

    height: 68px !important;
    min-height: 68px !important;
    max-height: 68px !important;
  }

  #st-navigation .brand-logo-wrap img.spacetools-icon-logo {
    width: 68px !important;
    min-width: 68px !important;
    max-width: 68px !important;

    height: 68px !important;
    min-height: 68px !important;
    max-height: 68px !important;
  }
}


/* SPACESTL_HEADER_LOGO_150_V3 */

#st-navigation .brand {
  width: 168px !important;
  min-width: 168px !important;
  height: 118px !important;
  min-height: 118px !important;
  margin-left: 0 !important;
}

#st-navigation .brand-logo-wrap {
  width: 160px !important;
  min-width: 160px !important;
  max-width: 160px !important;

  height: 118px !important;
  min-height: 118px !important;
  max-height: 118px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#st-navigation .brand-logo-wrap img.spacetools-icon-logo {
  width: 150px !important;
  min-width: 150px !important;
  max-width: 150px !important;

  height: 150px !important;
  min-height: 150px !important;
  max-height: 150px !important;

  object-fit: contain !important;
  transform: none !important;
}

@media (max-width: 900px) {
  #st-navigation .brand {
    width: 96px !important;
    min-width: 96px !important;
    height: 82px !important;
    min-height: 82px !important;
  }

  #st-navigation .brand-logo-wrap {
    width: 92px !important;
    min-width: 92px !important;
    max-width: 92px !important;

    height: 82px !important;
    min-height: 82px !important;
    max-height: 82px !important;
  }

  #st-navigation .brand-logo-wrap img.spacetools-icon-logo {
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;

    height: 84px !important;
    min-height: 84px !important;
    max-height: 84px !important;
  }
}