/* ============================================================
   KOBROKR — EFFECTS: shadow, blur, motion, focus
   Crisp and low. Cobalt-tinted shadows, no heavy drop blur.
   ============================================================ */

:root {
  /* ---- Elevation (cobalt-tinted ink, low + crisp) ---- */
  --shadow-xs:  0 1px 2px rgba(11, 20, 48, 0.06);
  --shadow-sm:  0 1px 3px rgba(11, 20, 48, 0.08), 0 1px 2px rgba(11, 20, 48, 0.04);
  --shadow-md:  0 4px 12px rgba(11, 20, 48, 0.08), 0 2px 4px rgba(11, 20, 48, 0.04);
  --shadow-lg:  0 12px 28px rgba(11, 20, 48, 0.12), 0 4px 8px rgba(11, 20, 48, 0.05);
  --shadow-xl:  0 24px 56px rgba(11, 20, 48, 0.16);
  --shadow-brand: 0 8px 24px rgba(43, 84, 240, 0.28); /* cobalt glow under CTAs */

  /* ---- Rings / focus ---- */
  --ring-focus: 0 0 0 3px rgba(43, 84, 240, 0.32);
  --ring-inset: inset 0 0 0 1px var(--border-default);

  /* ---- Blur ---- */
  --blur-panel: blur(16px); /* @kind other */ /* frosted nav / sticky headers */

  /* ---- Motion: durations ---- */
  --dur-fast:  120ms;  /* @kind other */
  --dur-base:  180ms;  /* @kind other */
  --dur-slow:  280ms;  /* @kind other */

  /* ---- Motion: easing — confident, no bounce ---- */
  --ease-standard: cubic-bezier(0.2, 0.8, 0.2, 1);  /* @kind other */
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);   /* @kind other */
  --ease-in:       cubic-bezier(0.4, 0, 1, 1);      /* @kind other */

  /* ---- Interaction tokens ---- */
  --press-scale: 0.97;            /* @kind other */ /* press: slight shrink */
  --hover-lift: translateY(-1px); /* @kind other */ /* cards/CTAs lift 1px */
}