:root{
  /* ======================================================
     Brand Colors
     ====================================================== */
  --brand-green: #17A051;
  --brand-green-2: #64CA4F;
  --brand-lime: #9FCC2E;
  --brand-yellow: #F2C94C;
  --brand-navy: #101323;

  /* Neutrals */
  --white: #ffffff;
  --black: #000000;

  --bg: #ffffff;
  --bg-soft: #F2F3F4;

  --surface: #ffffff;
  --surface-2: #F7F8FA;

  --text: #111827;
  --text-2: #2B2F3A;
  --muted: #666672;
  --muted-2: #98999D;

  --line: #E6E8EE;
  --line-2: #D6DAE4;

  /* ======================================================
     Typography
     ====================================================== */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-head: "Poppins", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --fs-12: 12px;
  --fs-14: 14px;
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-20: 20px;
  --fs-24: 24px;
  --fs-32: 32px;
  --fs-40: 40px;
  --fs-52: 52px;

  --lh: 1.55;

  /* ======================================================
     Layout
     ====================================================== */
  --container: 1200px;
  --gutter: clamp(14px, 2.4vw, 24px);
  --section-pad: clamp(36px, 5vw, 72px);

  /* ======================================================
     Radius & Shadows
     ====================================================== */
  --r-10: 10px;
  --r-12: 12px;
  --r-14: 14px;
  --r-16: 16px;
  --r-18: 18px;
  --r-20: 20px;

  --shadow-sm: 0 10px 24px rgba(16, 19, 35, .08);
  --shadow-md: 0 14px 34px rgba(16, 19, 35, .12);
  --shadow-lg: 0 24px 60px rgba(16, 19, 35, .16);

  /* ======================================================
     Buttons
     ====================================================== */
  --btn-h: 46px;
  --btn-r: 12px;

  /* ======================================================
     Focus / A11y
     ====================================================== */
  --focus: 0 0 0 3px rgba(23, 160, 81, .25);

  /* ======================================================
     UI helpers
     ====================================================== */
  --hero-bg: linear-gradient(135deg, rgba(23,160,81,.12), rgba(16,19,35,0) 55%);
  --nav-h: 72px;

  --ease: cubic-bezier(.2,.8,.2,1);
  --t-fast: .15s;
  --t-med: .25s;

  --success: var(--brand-green);
  --info: #2F80ED;

  /* ======================================================
     Added helpers (avoid hardcodes)
     ====================================================== */
  --alpha-ink-02: rgba(16,19,35,.02);
  --alpha-ink-03: rgba(16,19,35,.03);
  --alpha-ink-06: rgba(16,19,35,.06);
  --alpha-ink-08: rgba(16,19,35,.08);
  --alpha-ink-10: rgba(16,19,35,.10);
  --alpha-ink-12: rgba(16,19,35,.12);

  --alpha-brand-08: rgba(23,160,81,.08);
  --alpha-brand-10: rgba(23,160,81,.10);
  --alpha-brand-12: rgba(23,160,81,.12);
  --alpha-brand-14: rgba(23,160,81,.14);
  --alpha-brand-16: rgba(23,160,81,.16);
  --alpha-brand-18: rgba(23,160,81,.18);
  --alpha-brand-22: rgba(23,160,81,.22);
  --alpha-brand-25: rgba(23,160,81,.25);

  --panel-bg: rgba(255,255,255,.72);
  --pill-soft-bg: rgba(23,160,81,.10);
  --pill-soft-brd: rgba(23,160,81,.18);
}