/* Fitness OS — styles shared by any page carrying the site navigation */

body { font-family: 'Geist', sans-serif; }

/* --- Floating nav: detaches into a translucent, red-tinted glass bar on scroll --- */
#site-header { transition: padding 500ms cubic-bezier(.4,0,.2,1); }
#site-header .nav-track { transition: max-width 500ms cubic-bezier(.4,0,.2,1); }
#site-header .nav-shell {
  padding-inline: 0;
  border: 1px solid transparent;
  border-radius: 20px;
  transition: background-color 500ms cubic-bezier(.4,0,.2,1),
              border-color 500ms cubic-bezier(.4,0,.2,1),
              box-shadow 500ms cubic-bezier(.4,0,.2,1),
              padding 500ms cubic-bezier(.4,0,.2,1),
              height 500ms cubic-bezier(.4,0,.2,1);
}
/* red light bleeding through the glass */
#site-header .nav-shell::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background:
    radial-gradient(120% 180% at 0% 50%, rgba(239,68,68,.13), transparent 42%),
    radial-gradient(120% 180% at 100% 50%, rgba(239,68,68,.10), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.05), transparent 60%);
  opacity: 0; transition: opacity 500ms cubic-bezier(.4,0,.2,1);
}
#site-header.is-stuck { padding-top: .875rem; }
#site-header.is-stuck .nav-track { max-width: 76rem; }
#site-header.is-stuck .nav-shell {
  height: 4rem;
  padding-inline: 1.25rem;
  background-color: rgba(10,10,10,.45);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  backdrop-filter: blur(20px) saturate(160%);
  border-color: rgba(239,68,68,.14);
  box-shadow: 0 16px 40px -24px rgba(220,38,38,.45),
              0 10px 30px -20px rgba(0,0,0,.7),
              0 1px 0 0 rgba(255,255,255,.05) inset;
}
#site-header.is-stuck .nav-shell::before { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  #site-header, #site-header .nav-shell, #site-header .nav-track { transition: none; }
}