/* ============================================================
   Marsa Foundation — Elevation & motion
   Archival/editorial: shadows are quiet and warm-tinted; prefer
   hairlines over heavy drop shadows. Motion is calm and considered
   — ease-out, no bounce.
   ============================================================ */

:root {
  /* Warm-tinted shadows (ink, low alpha) */
  --shadow-xs: 0 1px 2px rgba(24, 23, 21, 0.06);
  --shadow-sm: 0 2px 6px rgba(24, 23, 21, 0.07);
  --shadow-md: 0 8px 20px -6px rgba(24, 23, 21, 0.12);
  --shadow-lg: 0 20px 44px -12px rgba(24, 23, 21, 0.18);
  --shadow-xl: 0 36px 80px -20px rgba(24, 23, 21, 0.24);
  /* Inset hairline used on cards/inputs for an engraved edge */
  --ring-inset: inset 0 0 0 1px var(--border-hairline);
  --focus-shadow: 0 0 0 3px rgba(197, 83, 43, 0.35); /* clay focus ring */

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --ease-entrance: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --dur-1: 120ms; /* @kind other */
  --dur-2: 180ms; /* @kind other */
  --dur-3: 240ms; /* @kind other */
  --dur-4: 320ms; /* @kind other */
  --dur-5: 480ms; /* @kind other */
  --transition-base: var(--dur-2) var(--ease-out);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-1: 0ms; /* @kind other */
    --dur-2: 0ms; /* @kind other */
    --dur-3: 0ms; /* @kind other */
    --dur-4: 0ms; /* @kind other */
    --dur-5: 0ms; /* @kind other */
  }
}
