/* ==========================================================================
   Business Flow Group — Effects: shadows, transitions, motion
   Soft, low, cool-grey shadows (never black). Motion is calm and assured —
   short eases, no bounce. "Flow", not flashy.
   ========================================================================== */

:root {
  /* ---- Shadows — tinted with slate, low opacity, generous spread ---- */
  --shadow-xs: 0 1px 2px rgba(21, 31, 38, 0.05);
  --shadow-sm: 0 1px 3px rgba(21, 31, 38, 0.06), 0 1px 2px rgba(21, 31, 38, 0.04);
  --shadow-md: 0 4px 12px rgba(21, 31, 38, 0.07), 0 2px 4px rgba(21, 31, 38, 0.04);
  --shadow-lg: 0 12px 28px rgba(21, 31, 38, 0.09), 0 4px 10px rgba(21, 31, 38, 0.05);
  --shadow-xl: 0 24px 56px rgba(21, 31, 38, 0.12);

  /* lift on accent surfaces */
  --shadow-accent: 0 8px 24px rgba(241, 98, 52, 0.22);

  /* ---- Transitions ---- */
  --ease-standard: cubic-bezier(0.22, 0.61, 0.36, 1);   /* @kind other */ /* calm ease-out */
  --ease-emphasis: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --dur-fast: 120ms;  /* @kind other */
  --dur-base: 200ms;  /* @kind other */
  --dur-slow: 320ms;  /* @kind other */

  --transition-base: all var(--dur-base) var(--ease-standard);
  --transition-color: color var(--dur-fast) var(--ease-standard),
                      background-color var(--dur-fast) var(--ease-standard),
                      border-color var(--dur-fast) var(--ease-standard);
}