:root {
  /* === COLOR TOKENS === */
  --bg-main: #f5f7fa;
  --bg-blue: #eaf2ff;
  --bg-green: #dcfce7;

  --brand: #1b3a8a;
  --brand-700: #152f73;
  --brand-600: #2047a3;
  --brand-050: rgba(27, 58, 138, 0.05);
  --brand-080: rgba(27, 58, 138, 0.08);
  --brand-120: rgba(27, 58, 138, 0.12);
  --brand-150: rgba(27, 58, 138, 0.15);
  --brand-250: rgba(27, 58, 138, 0.25);
  --brand-350: rgba(27, 58, 138, 0.35);
  --brand-500: rgba(27, 58, 138, 0.5);

  --green: #16a34a;
  --green-700: #15803d;
  --green-050: rgba(22, 163, 74, 0.05);
  --green-120: rgba(22, 163, 74, 0.12);

  --warning: #f59e0b;
  --warning-700: #92400e;

  --danger: #ef4444;
  --danger-120: rgba(239, 68, 68, 0.12);

  --text-dark: #1f2937;
  --text-gray: #6b7280;
  --text-soft: #94a3b8;
  --text-inverse: rgba(255, 255, 255, 0.88);
  --text-inverse-soft: rgba(255, 255, 255, 0.72);
  --text-inverse-muted: rgba(255, 255, 255, 0.56);

  --white: #ffffff;
  --black: #000000;

  --surface-0: #ffffff;
  --surface-1: #f8fafc;
  --surface-2: #eef2f7;

  --border: #e5e7eb;
  --border-strong: #cbd5e1;
  --border-inverse: rgba(255, 255, 255, 0.12);

  /* === TYPOGRAPHY === */
  --font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;

  --fs-12: 0.75rem;
  --fs-13: 0.8125rem;
  --fs-14: 0.875rem;
  --fs-15: 0.9375rem;
  --fs-16: 1rem;
  --fs-18: 1.125rem;
  --fs-20: 1.25rem;
  --fs-24: 1.5rem;
  --fs-32: 2rem;
  --fs-36: 2.25rem;
  --fs-40: 2.5rem;
  --fs-44: 2.75rem;
  --fs-52: 3.25rem;

  --fw-400: 400;
  --fw-500: 500;
  --fw-600: 600;
  --fw-700: 700;
  --fw-800: 800;

  --lh-tight: 1.15;
  --lh-title: 1.2;
  --lh-body: 1.6;
  --lh-relaxed: 1.65;

  --ls-tight: -0.04em;
  --ls-medium: -0.02em;
  --ls-wide: 0.08em;

  --fs-heading-xl: clamp(2.25rem, 5vw, 3.25rem);
  --fs-heading-lg: clamp(1.75rem, 3.6vw, 2.25rem);
  --fs-heading-md: clamp(1.375rem, 2.8vw, 1.75rem);
  --fs-heading-sm: clamp(1.125rem, 2.2vw, 1.5rem);
  --fs-lead: clamp(1rem, 2vw, 1.125rem);

  /* === SPACING === */
  --space-0: 0;
  --space-2: 0.125rem;
  --space-4: 0.25rem;
  --space-6: 0.375rem;
  --space-8: 0.5rem;
  --space-10: 0.625rem;
  --space-12: 0.75rem;
  --space-14: 0.875rem;
  --space-16: 1rem;
  --space-18: 1.125rem;
  --space-20: 1.25rem;
  --space-24: 1.5rem;
  --space-28: 1.75rem;
  --space-32: 2rem;
  --space-36: 2.25rem;
  --space-40: 2.5rem;
  --space-48: 3rem;
  --space-56: 3.5rem;
  --space-64: 4rem;
  --space-72: 4.5rem;
  --space-80: 5rem;
  --space-88: 5.5rem;

  /* === RADIUS === */
  --radius-xs: 0.375rem;
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.25rem;
  --radius-full: 999px;

  /* === SHADOWS === */
  --shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.08);
  --shadow-md: 0 4px 20px rgba(15, 23, 42, 0.1);
  --shadow-lg: 0 8px 32px rgba(15, 23, 42, 0.14);

  --shadow-brand: 0 4px 16px rgba(27, 58, 138, 0.35);
  --shadow-brand-lg: 0 6px 20px rgba(27, 58, 138, 0.4);
  --shadow-brand-soft: 0 8px 24px rgba(27, 58, 138, 0.18);

  --focus-ring: 0 0 0 3px rgba(27, 58, 138, 0.14);

  /* === LAYOUT === */
  --container-max: 75rem;
  --container-pad: 1.5rem;
  --grid-columns: 12;
  --grid-gap: 1.5rem;

  --section-space: clamp(3.5rem, 7vw, 5rem);
  --section-space-compact: clamp(2.5rem, 4vw, 3.5rem);

  --header-height: 4.5rem;
  --pre-header-height: 2.25rem;
  --page-offset: 6.75rem;
  --anchor-offset: calc(var(--header-height) + var(--space-16));

  /* === MOTION === */
  --transition-fast: 0.16s ease;
  --transition-base: 0.22s ease;
  --transition-slow: 0.32s ease;

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

  /* === Z-INDEX === */
  --z-base: 1;
  --z-header: 1000;
  --z-overlay: 1100;
  --z-drawer: 1200;
  --z-skip-link: 1300;

  /* === MISC === */
  --icon-size-sm: 1rem;
  --icon-size-md: 1.25rem;
  --icon-size-lg: 1.5rem;
  --icon-size-xl: 2rem;

  --gradient-brand-soft:
    radial-gradient(circle at 0% 0%, rgba(27, 58, 138, 0.12), transparent 42%),
    radial-gradient(circle at 100% 100%, rgba(22, 163, 74, 0.08), transparent 38%);

  --bp-mobile-max: 47.99875rem;
  --bp-tablet-min: 48rem;
  --bp-tablet-max: 64rem;
  --bp-desktop-min: 64.0625rem;
}