/* ============================================================
   VIQ ENGLISH — RADII & SHADOWS
   Rounded, soft, friendly. Shadows are soft + colored-tinted,
   never harsh black. = premium but playful.
   ============================================================ */
:root {
  /* ---------- Corner radii (generous rounding) ---------- */
  --radius-xs:   6px;
  --radius-sm:   10px;
  --radius-md:   16px;  /* default card/input */
  --radius-lg:   22px;  /* large cards */
  --radius-xl:   30px;  /* feature panels */
  --radius-2xl:  40px;  /* hero blobs */
  --radius-pill: 999px; /* buttons, chips, badges */
  --radius-circle: 50%;

  /* ---------- Soft shadows (cool navy-tinted, never pure black) ---------- */
  --shadow-xs:  0 1px 2px rgba(20, 35, 59, 0.06);
  --shadow-sm:  0 2px 8px rgba(20, 35, 59, 0.08);
  --shadow-md:  0 8px 20px rgba(20, 35, 59, 0.10);
  --shadow-lg:  0 16px 36px rgba(20, 35, 59, 0.12);
  --shadow-xl:  0 28px 60px rgba(20, 35, 59, 0.16);

  /* ---------- Brand-tinted lifts (for primary cards / CTAs) ---------- */
  --shadow-blue:   0 12px 28px rgba(34, 118, 236, 0.30);
  --shadow-orange: 0 12px 28px rgba(255, 90, 35, 0.30);

  /* ---------- Focus ---------- */
  --ring: 0 0 0 4px rgba(34, 118, 236, 0.28);

  /* ---------- Motion ---------- */
  --ease-out:    cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */
  --dur-fast:    140ms; /* @kind other */
  --dur-base:    220ms; /* @kind other */
  --dur-slow:    360ms; /* @kind other */
}