/* ============================================================
   GetHealthPlans — Radius, borders, shadows, motion
   Health/insurance feel: clean, soft, trustworthy.
   Generous corners, soft layered blue-tinted shadows.
   ============================================================ */
:root {
  /* Corner radii */
  --radius-xs:   6px;
  --radius-sm:   8px;
  --radius-md:   12px;   /* default control radius */
  --radius-lg:   16px;   /* cards */
  --radius-xl:   24px;   /* feature cards / panels */
  --radius-2xl:  32px;
  --radius-pill: 999px;

  /* Border widths */
  --border-thin:   1px;
  --border-medium: 1.5px;
  --border-thick:  2px;

  /* Shadows — blue-tinted, soft (rgba of navy) */
  --shadow-xs: 0 1px 2px rgba(15, 36, 102, 0.06);
  --shadow-sm: 0 2px 6px rgba(15, 36, 102, 0.07);
  --shadow-md: 0 6px 16px rgba(15, 36, 102, 0.09);
  --shadow-lg: 0 14px 34px rgba(15, 36, 102, 0.12);
  --shadow-xl: 0 26px 64px rgba(15, 36, 102, 0.16);

  /* Focus ring */
  --shadow-focus: 0 0 0 3px rgba(14, 148, 255, 0.35);
  --shadow-focus-accent: 0 0 0 3px rgba(255, 102, 0, 0.32);

  /* 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 */
  --dur-fast:   120ms;   /* @kind other */
  --dur-base:   200ms;   /* @kind other */
  --dur-slow:   320ms;   /* @kind other */
}