/**
 * @file motion.css
 * @layer 1: Foundation (Motion, Stacking, & Accessibility Utilities)
 *
 * Defines global architectural primitives for:
 * 1. Stacking Contexts (z-index boundaries)
 * 2. Dynamic Motion & Transition Tokens
 * 3. Scoped Accessibility (prefers-reduced-motion)
 *
 * GOVERNANCE CONTRACT:
 * - Never use !important outside of the Accessibility Overrides block.
 * - Keep stacking context indexes tightly clustered to prevent float collisions.
 */

/* ==========================================================================
   1. Global Stacking Context Contracts
   ========================================================================== */
:root {
  /* Stacking Scales */
  --z-below: -1;
  --z-flat: 0;
  --z-above: 1;
  --z-frame: 5;
  --z-overlay: 10;
  --z-nav-fixed: 100;
  --z-modal: 1000;
}

/* ==========================================================================
   2. Shared Transition & Interaction Primitives
   ========================================================================== */
:root {
  /* Timing & Easings */
  --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-smooth: 0.35s cubic-bezier(0.25, 1, 0.5, 1);
  --transition-bouncy: 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Shared Micro-interactions */
.hover-scale {
  transition: transform var(--transition-smooth);
}
.hover-scale:hover {
  transform: scale(1.02);
}

/* ==========================================================================
   3. Explicit Position Context Enforcers
   ========================================================================== */
.relative-context {
  position: relative !important; /* Governed exception: Utility utility enforcer */
}

/* ==========================================================================
   4. ACCESSIBILITY: Scoped Reduced-Motion Overrides
   * STRICT DOMAIN RULE: We only kill motion within marketing (.page-home)
   * so we don't break spinners/loaders in the transactional booking engine!
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .page-home *,
  .page-home *::before,
  .page-home *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
