/* ==========================================================================
   BrandMark — sphere idle, chrome NRL on hover (homepage nav)
   ========================================================================== */

.brand-mark {
  display: block;
  flex-shrink: 0;
}

/* Sky hero nav — brighter monogram on blue gradient */
.brand-mark--hero .brand-mark__nrl {
  background: linear-gradient(115deg, #fff 0%, #D4EBFF 24%, #fff 46%, #B8C8E0 62%, #fff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  filter: drop-shadow(0 6px 14px rgba(0, 60, 120, 0.22));
}

.brand-mark--hero .brand-mark__glow {
  opacity: 0.72;
  width: 52px;
  height: 52px;
}

.brand-mark--hero .brand-mark__stage {
  width: 52px;
  height: 46px;
}

.brand-mark--hero .brand-mark__sphere-svg {
  width: 42px;
  height: 42px;
  filter: drop-shadow(0 10px 18px rgba(197, 38, 223, 0.3));
}

.brand-mark__stage {
  position: relative;
  display: grid;
  place-items: center;
  width: 52px;
  height: 40px;
  perspective: 160px;
}

.brand-mark__glow {
  position: absolute;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(240, 56, 215, 0.32) 0%,
    rgba(109, 70, 248, 0.14) 44%,
    transparent 72%
  );
  pointer-events: none;
  transition: opacity 400ms ease, scale 400ms ease, background 400ms ease;
}

.brand-mark__layer {
  grid-area: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    opacity 380ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 380ms cubic-bezier(0.22, 1, 0.36, 1),
    filter 380ms cubic-bezier(0.22, 1, 0.36, 1);
}

.brand-mark__layer--sphere {
  opacity: 1;
  transform: scale(1);
  filter: none;
}

.brand-mark__layer--monogram {
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px) scale(0.96);
  filter: blur(2px);
  pointer-events: none;
}

.brand-mark__sphere-orbit,
.brand-mark__sphere-float {
  display: flex;
  align-items: center;
  justify-content: center;
  transform-style: preserve-3d;
}

.brand-mark__sphere-svg {
  display: block;
  width: 38px;
  height: 38px;
  filter: drop-shadow(0 10px 18px rgba(197, 38, 223, 0.28));
}

/* NRL hover wordmark — chromium-inspired metallic */
.brand-mark__nrl {
  display: block;
  font-family: var(--font-sans, Inter, ui-sans-serif, system-ui, sans-serif);
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -0.05em;
  line-height: 1;
  white-space: nowrap;
  background: linear-gradient(115deg, #fff 0%, #9CCBFF 26%, #F5F7FF 48%, #7B8DA8 64%, #fff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 8px 18px rgba(0, 85, 160, 0.18));
}

/* ── Idle motion ─────────────────────────────────────────── */

@media (prefers-reduced-motion: no-preference) {
  .brand-mark__glow {
    animation: brandMarkGlow 10s ease-in-out infinite;
  }

  .brand-mark__sphere-orbit {
    animation: brandMarkOrbit 12s ease-in-out infinite;
  }

  .brand-mark__sphere-float {
    animation: brandMarkFloat 10s ease-in-out infinite;
  }

  .brand-mark__sphere-svg {
    animation: brandMarkBreathe 8s ease-in-out infinite;
  }

  .brand-mark .nrlc-sphere-revolve {
    animation-duration: 12s !important;
    animation-timing-function: linear !important;
  }
}

@keyframes brandMarkGlow {
  0%,
  100% {
    opacity: 0.5;
    scale: 0.94;
  }
  50% {
    opacity: 0.88;
    scale: 1.05;
  }
}

@keyframes brandMarkOrbit {
  0%,
  100% {
    transform: rotateY(-10deg) rotateZ(0deg);
  }
  50% {
    transform: rotateY(10deg) rotateZ(6deg);
  }
}

@keyframes brandMarkFloat {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-2px);
  }
}

@keyframes brandMarkBreathe {
  0%,
  100% {
    scale: 1;
  }
  50% {
    scale: 1.04;
  }
}

/* ── Hover / focus ───────────────────────────────────────── */

.home-nav__brand:hover .brand-mark__layer--sphere,
.home-nav__brand:focus-visible .brand-mark__layer--sphere,
.nav-primary__brand:hover .brand-mark__layer--sphere,
.nav-primary__brand:focus-visible .brand-mark__layer--sphere {
  opacity: 0.18;
  transform: scale(0.72) rotate(24deg);
  filter: blur(0.5px);
}

.home-nav__brand:hover .brand-mark__layer--monogram,
.home-nav__brand:focus-visible .brand-mark__layer--monogram,
.nav-primary__brand:hover .brand-mark__layer--monogram,
.nav-primary__brand:focus-visible .brand-mark__layer--monogram {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  filter: none;
}

.home-nav__brand:hover .brand-mark__glow,
.home-nav__brand:focus-visible .brand-mark__glow,
.nav-primary__brand:hover .brand-mark__glow,
.nav-primary__brand:focus-visible .brand-mark__glow {
  opacity: 0.45;
  scale: 0.9;
  background: radial-gradient(
    circle,
    rgba(220, 228, 255, 0.5) 0%,
    rgba(160, 180, 230, 0.18) 48%,
    transparent 72%
  );
}

@media (prefers-reduced-motion: no-preference) {
  .home-nav__brand:hover .brand-mark__glow,
  .home-nav__brand:focus-visible .brand-mark__glow {
    animation: none;
  }

  .home-nav__brand:hover .brand-mark__sphere-orbit,
  .home-nav__brand:hover .brand-mark__sphere-float,
  .home-nav__brand:hover .brand-mark__sphere-svg,
  .home-nav__brand:focus-visible .brand-mark__sphere-orbit,
  .home-nav__brand:focus-visible .brand-mark__sphere-float,
  .home-nav__brand:focus-visible .brand-mark__sphere-svg,
  .nav-primary__brand:hover .brand-mark__sphere-orbit,
  .nav-primary__brand:hover .brand-mark__sphere-float,
  .nav-primary__brand:hover .brand-mark__sphere-svg,
  .nav-primary__brand:focus-visible .brand-mark__sphere-orbit,
  .nav-primary__brand:focus-visible .brand-mark__sphere-float,
  .nav-primary__brand:focus-visible .brand-mark__sphere-svg {
    animation-play-state: paused;
  }

  .home-nav__brand:hover .brand-mark .nrlc-sphere-revolve,
  .home-nav__brand:focus-visible .brand-mark .nrlc-sphere-revolve,
  .nav-primary__brand:hover .brand-mark .nrlc-sphere-revolve,
  .nav-primary__brand:focus-visible .brand-mark .nrlc-sphere-revolve {
    animation-play-state: paused !important;
  }

}

.nav-primary__brand {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

/* ── Reduced motion ──────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  .brand-mark__glow,
  .brand-mark__sphere-orbit,
  .brand-mark__sphere-float,
  .brand-mark__sphere-svg,
  .brand-mark .nrlc-sphere-revolve {
    animation: none !important;
  }

  .brand-mark__layer {
    transition: opacity 180ms ease;
  }

  .home-nav__brand:hover .brand-mark__layer--sphere,
  .home-nav__brand:focus-visible .brand-mark__layer--sphere,
  .nav-primary__brand:hover .brand-mark__layer--sphere,
  .nav-primary__brand:focus-visible .brand-mark__layer--sphere {
    filter: none;
    transform: none;
  }

  .home-nav__brand:hover .brand-mark__layer--monogram,
  .home-nav__brand:focus-visible .brand-mark__layer--monogram,
  .nav-primary__brand:hover .brand-mark__layer--monogram,
  .nav-primary__brand:focus-visible .brand-mark__layer--monogram {
    filter: none;
    transform: none;
  }
}