/* src/styles.css */
@layer synced-motion {
  :root {
    --motion-duration-fast: 180ms;
    --motion-duration-base: 480ms;
    --motion-duration-slow: 800ms;
    --motion-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  }
  html[data-motion-scroll-locked] {
    overflow: hidden;
  }
  [data-motion-hover-group][data-motion-recipe] [data-motion-hover-media],
  [data-motion-scroll-steps][data-motion-recipe] [data-motion-step-panel] {
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
  }
  [data-motion-hover-group][data-motion-recipe] [data-motion-hover-media][data-active],
  [data-motion-scroll-steps][data-motion-recipe] [data-motion-step-panel][data-active] {
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
  }
  [data-motion-step-link] {
    color: var(--sf-colour-muted, currentColor);
    transition: color var(--motion-duration-base) var(--motion-ease-out);
  }
  [data-motion-step-link][data-active] {
    color: var(--sf-colour-primary, currentColor);
  }
  [data-motion-expand-panel] {
    transition: flex var(--motion-duration-slow) var(--motion-ease-out), color var(--motion-duration-base) var(--motion-ease-out);
  }
  [data-motion-menu][data-state=closed] [data-motion-menu-panel] {
    pointer-events: none;
    visibility: hidden;
  }
  [data-motion-menu][data-state=open] [data-motion-menu-panel] {
    pointer-events: auto;
    visibility: visible;
  }
  @media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
      scroll-behavior: auto !important;
    }
    [data-motion-reveal],
    [data-motion-stagger] > *,
    [data-motion-parallax] {
      opacity: 1 !important;
      transform: none !important;
      visibility: visible !important;
    }
  }
}
/*# sourceMappingURL=styles.css.map */