/* ==========================================================================
   DevGenZ — Radius, shadow, and border tokens
   Soft rounded corners (friendly, approachable) + soft blue-tinted shadows.
   The CTA button on the site uses a ~8px radius; cards are softer.
   ========================================================================== */

:root {
  /* --- Corner radii ---------------------------------------------------- */
  --radius-xs:   4px;
  --radius-sm:   8px;    /* buttons, inputs */
  --radius-md:   12px;
  --radius-lg:   16px;   /* cards */
  --radius-xl:   24px;   /* feature panels, hero blobs */
  --radius-2xl:  32px;
  --radius-pill: 999px;  /* chips, avatars, tags */

  /* --- Shadows: soft, cool, blue-tinted -------------------------------- */
  --shadow-xs:   0 1px 2px rgba(13, 36, 60, 0.06);
  --shadow-sm:   0 2px 6px rgba(13, 36, 60, 0.07);
  --shadow-md:   0 8px 20px rgba(13, 36, 60, 0.08);
  --shadow-lg:   0 16px 40px rgba(13, 36, 60, 0.10);
  --shadow-xl:   0 28px 64px rgba(13, 36, 60, 0.14);
  /* Brand-colored lift for primary CTAs */
  --shadow-brand: 0 10px 24px rgba(37, 99, 235, 0.28);

  /* --- Border widths --------------------------------------------------- */
  --border-hairline: 1px;
  --border-thick:    2px;
}