/* sd-page-transition.css
   Smooth content-only fade between pages (navbar never changes).
   This avoids full-page overlays that can look like a "flash".
*/

:root{
  --sd-pt-duration: 160ms;
  --sd-pt-ease: ease;
}

/* Fade only content below the navbar (wrapped in #sd-page-content) */
#sd-page-content{
  transition: opacity var(--sd-pt-duration) var(--sd-pt-ease);
}

/* Enter state: keep content hidden until JS clears it */
html.sd-pt-enter #sd-page-content{
  opacity: 0;
}

/* Leave state: fade content away */
html.sd-pt-leave #sd-page-content{
  opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
  #sd-page-content{ transition: none !important; }
}
