/* ============================================================
   Avittat — Effects: radii, borders, shadows, motion
   Architectural & restrained. Crisp corners, soft warm shadows,
   calm easing. No bouncy motion.
   ============================================================ */

:root {
  /* Corner radii — modest, architectural */
  --radius-none: 0;
  --radius-xs:   3px;
  --radius-sm:   6px;
  --radius-md:   10px;   /* default cards, inputs, buttons */
  --radius-lg:   16px;
  --radius-xl:   22px;
  --radius-pill: 999px;

  /* Borders */
  --border-thin:  1px;
  --border-med:   1.5px;
  --border-thick: 2px;

  /* Shadows — deep, cinematic voids for a dark luxury elevation system */
  --shadow-xs:  0 1px 2px rgba(0, 0, 0, 0.45);
  --shadow-sm:  0 1px 3px rgba(0, 0, 0, 0.5), 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-md:  0 8px 24px rgba(0, 0, 0, 0.5), 0 2px 6px rgba(0, 0, 0, 0.35);
  --shadow-lg:  0 20px 50px rgba(0, 0, 0, 0.55), 0 6px 14px rgba(0, 0, 0, 0.4);
  --shadow-xl:  0 32px 80px rgba(0, 0, 0, 0.6), 0 10px 24px rgba(0, 0, 0, 0.45);
  /* Gold glow — for the primary CTA / focus emphasis */
  --shadow-gold: 0 8px 28px rgba(232, 184, 0, 0.35);
  --shadow-inset-top: inset 0 1px 0 rgba(247, 243, 234, 0.06);

  /* Focus ring */
  --ring: 0 0 0 3px rgba(232, 184, 0, 0.4); /* @kind shadow */

  /* Motion — calm, confident */
  --ease-out:   cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-inout: cubic-bezier(0.65, 0.05, 0.36, 1); /* @kind other */
  --dur-fast:   140ms; /* @kind other */
  --dur-base:   240ms; /* @kind other */
  --dur-slow:   420ms; /* @kind other */

  /* Z layers */
  --z-base: 0; /* @kind other */
  --z-sticky: 100; /* @kind other */
  --z-overlay: 800; /* @kind other */
  --z-modal: 900; /* @kind other */
  --z-toast: 1000; /* @kind other */
}