/* The navigation and footer are cloned from the existing homepage at runtime.
   These rules only complete the two interactions that normally come from the
   homepage animation bundle, so both components keep the exact home layout. */
[data-noxus-header], [data-noxus-footer] { display: block; }
[data-noxus-header] { min-height: 6.5rem; }
[data-noxus-footer] { min-height: 20rem; background: #310706; }

.noxus-home-nav .nav-ham::after {
  content: '+' !important;
  display: grid;
  place-items: center;
  background: transparent !important;
  color: #310706;
  font: 500 2rem/1 Arial, sans-serif;
  mix-blend-mode: normal !important;
}

.noxus-home-nav.is-menu-open .nav-ham::after { content: '×' !important; }
.noxus-home-nav .nav-ham canvas { opacity: 0; }
.noxus-home-nav .nav-menu-w,
.noxus-home-nav .nav-menu-img-w,
.noxus-home-nav .nav-menu-link-w { will-change: clip-path, transform; }

.noxus-home-footer .footer-statement-w,
.noxus-home-footer .footer-links-w,
.noxus-home-footer .footer-marquee,
.noxus-home-footer .footer-bg-bottom-btn-w {
  opacity: 0;
  transform: translate3d(0, 2rem, 0);
  transition: opacity .65s ease, transform .85s cubic-bezier(.22,1,.36,1);
}
.noxus-home-footer .footer-bg-helmet-w { opacity: 0; transform: scale(.94) translate3d(0, 2rem, 0); transition: opacity .8s ease, transform 1.15s cubic-bezier(.22,1,.36,1); }
.noxus-home-footer.is-visible .footer-statement-w,
.noxus-home-footer.is-visible .footer-links-w,
.noxus-home-footer.is-visible .footer-marquee,
.noxus-home-footer.is-visible .footer-bg-bottom-btn-w,
.noxus-home-footer.is-visible .footer-bg-helmet-w { opacity: 1; transform: none; }
.noxus-home-footer.is-visible .footer-links-w { transition-delay: .1s; }
.noxus-home-footer.is-visible .footer-marquee { transition-delay: .18s; }
.noxus-home-footer.is-visible .footer-bg-bottom-btn-w { transition-delay: .25s; }
.noxus-home-footer.is-visible .footer-bg-helmet-w { transition-delay: .08s; }
.noxus-home-footer .marquee-adv-row { overflow: hidden; }
.noxus-home-footer .marquee-adv-scroll { display: flex; align-items: center; }
.noxus-home-footer .marquee-adv-collection { flex: 0 0 auto; }

/* The source homepage changes its nav theme while moving between dark and
   light sections. The cloned shell keeps that same contrast behaviour. */
.noxus-home-nav[data-nav-theme="light"] .noxusai-brand,
.noxus-home-nav[data-nav-theme="light"] .noxusai-brand * { color: #f8f3f1 !important; }
.noxus-home-nav[data-nav-theme="dark"] .noxusai-brand,
.noxus-home-nav[data-nav-theme="dark"] .noxusai-brand * { color: #310706 !important; }

@media (max-width: 767px) {
  [data-noxus-header] { min-height: 5rem; }
}

@media (prefers-reduced-motion: reduce) {
  .noxus-home-nav .nav-menu-w .nav-menu-link-w,
  .noxus-home-nav .nav-menu-w .nav-menu-img-w,
  .noxus-home-footer .footer-statement-w,
  .noxus-home-footer .footer-links-w,
  .noxus-home-footer .footer-marquee,
  .noxus-home-footer .footer-bg-bottom-btn-w,
  .noxus-home-footer .footer-bg-helmet-w { opacity: 1 !important; transform: none !important; transition: none !important; }
  .noxus-home-footer.is-visible .noxus-footer-robot { animation: none; }
}