:root {
  --tr-white: #fff;
  --tr-ink: #15181b;
  --tr-near-black: #111315;
  --tr-carbon: #191c1f;
  --tr-charcoal: #272b2f;
  --tr-text-2: #454b51;
  --tr-muted: #747c84;
  --tr-bg: #f5f6f7;
  --tr-surface: #fff;
  --tr-surface-2: #eef0f2;
  --tr-border: #d8dde1;
  --tr-border-strong: #bcc3c9;
  --tr-footer-text: #c9ced3;
  --tr-footer-muted: #aab1b8;
  --tr-footer-subtle: #8e969e;
  --tr-footer-border: #363b40;

  --tr-brand-primary: #234999;
  --tr-brand-primary-hover: #1c3b7e;
  --tr-brand-primary-active: #142d63;
  --tr-brand-primary-subtle: #eaf0fb;
  --tr-brand-primary-border: #afc0e1;
  --tr-brand-primary-foreground: #fff;
  --tr-brand-primary-rgb: 35, 73, 153;

  --tr-success: #247a48;
  --tr-success-bg: #eaf6ef;
  --tr-warning: #9a6400;
  --tr-warning-bg: #fff4d6;
  --tr-error: #b4232d;
  --tr-error-bg: #fcebed;
  --tr-error-border: #efb7bc;
  --tr-info: #276b9a;

  --tr-radius-sm: 8px;
  --tr-radius-md: 10px;
  --tr-radius-lg: 12px;
  --tr-shadow-card: 0 1px 2px rgba(17, 19, 21, 0.05), 0 4px 12px rgba(17, 19, 21, 0.04);
  --tr-shadow-elevated: 0 4px 12px rgba(17, 19, 21, 0.08), 0 12px 32px rgba(17, 19, 21, 0.08);

  --tr-space-1: 4px;
  --tr-space-2: 8px;
  --tr-space-3: 12px;
  --tr-space-4: 16px;
  --tr-space-5: 20px;
  --tr-space-6: 24px;
  --tr-space-8: 32px;
  --tr-space-10: 40px;
  --tr-space-12: 48px;
  --tr-space-16: 64px;
  --tr-space-20: 80px;
  --tr-space-24: 96px;
  --tr-space-30: 120px;

  --tr-container: 1320px;
  --tr-container-wide: 1440px;
  --tr-page-gutter: 20px;
  --tr-header-height: 76px;
  --tr-transition: 180ms cubic-bezier(0.2, 0, 0, 1);
  --tr-focus-color: var(--tr-brand-primary);

  /* Stable aliases for Elementor and custom-code consumers. */
  --brand-primary: var(--tr-brand-primary);
  --brand-primary-hover: var(--tr-brand-primary-hover);
  --brand-primary-active: var(--tr-brand-primary-active);
  --brand-primary-subtle: var(--tr-brand-primary-subtle);
  --brand-primary-border: var(--tr-brand-primary-border);
  --brand-primary-foreground: var(--tr-brand-primary-foreground);
  --e-global-color-primary: var(--tr-brand-primary);
  --e-global-color-secondary: var(--tr-near-black);
  --e-global-color-text: var(--tr-ink);
  --e-global-color-accent: var(--tr-brand-primary);
}

@media (max-width: 900px) {
  :root {
    --tr-page-gutter: 16px;
    --tr-header-height: 68px;
  }
}
