/* ============================================================
   RAM Technologies — Effects: shadow, blur, motion, focus
   Shadows are cool-tinted (navy) to sit in the brand family.
   ============================================================ */

:root {
  /* ---- Elevation (navy-tinted, soft) ---- */
  --shadow-xs:  0 1px 2px rgba(22, 32, 91, 0.06);
  --shadow-sm:  0 1px 3px rgba(22, 32, 91, 0.08), 0 1px 2px rgba(22, 32, 91, 0.06);
  --shadow-md:  0 4px 12px rgba(22, 32, 91, 0.10), 0 2px 4px rgba(22, 32, 91, 0.06);
  --shadow-lg:  0 12px 28px rgba(22, 32, 91, 0.14), 0 4px 8px rgba(22, 32, 91, 0.06);
  --shadow-xl:  0 24px 50px rgba(22, 32, 91, 0.18), 0 8px 16px rgba(22, 32, 91, 0.08);

  /* ---- Brand glow (cyan/azure) for emphasis on dark ---- */
  --shadow-glow-cyan:  0 0 0 1px rgba(48, 209, 255, 0.4), 0 8px 30px rgba(48, 209, 255, 0.25);
  --shadow-glow-azure: 0 8px 30px rgba(3, 114, 255, 0.35);

  /* ---- Focus ring ---- */
  --ring-width: 3px;
  --ring-color: rgba(3, 114, 255, 0.45);
  --ring: 0 0 0 var(--ring-width) var(--ring-color); /* @kind shadow */

  /* ---- Blur ---- */
  --blur-sm: 6px;  /* @kind other */
  --blur-md: 14px; /* @kind other */
  --blur-lg: 28px; /* @kind other */

  /* ---- Motion ---- */
  --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-out:    cubic-bezier(0.65, 0, 0.35, 1);    /* @kind other */
  --duration-fast:  120ms; /* @kind other */
  --duration-base:  200ms; /* @kind other */
  --duration-slow:  320ms; /* @kind other */

  /* ---- Hairline / overlay ---- */
  --overlay-scrim:  rgba(13, 18, 56, 0.55);
}