:root {
  --color-primary: #0867f2;
  --color-primary-dark: #054dbd;
  --color-primary-soft: #eaf3ff;
  --color-secondary: #12a9ff;
  --color-text: #0a2147;
  --color-muted: #60738f;
  --color-background: #ffffff;
  --color-surface: #f6f9fd;
  --color-line: #dce6f2;
  --color-success: #0f9f62;
  --container-width: 1320px;
  --container-gutter: clamp(16px, 3vw, 32px);
  --header-height: 88px;
  --spacing-xs: .375rem;
  --spacing-sm: .75rem;
  --spacing-md: 1.25rem;
  --spacing-lg: 2rem;
  --spacing-xl: clamp(3rem, 7vw, 6.5rem);
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --shadow-sm: 0 8px 24px rgba(9, 42, 91, .07);
  --shadow-md: 0 18px 54px rgba(9, 42, 91, .12);
  --font-xs: clamp(.75rem, .72rem + .12vw, .82rem);
  --font-sm: clamp(.875rem, .84rem + .14vw, .96rem);
  --font-base: clamp(1rem, .96rem + .18vw, 1.1rem);
  --font-lg: clamp(1.125rem, 1.03rem + .35vw, 1.35rem);
  --font-h3: clamp(1.35rem, 1.15rem + .65vw, 1.8rem);
  --font-h2: clamp(1.8rem, 1.35rem + 1.45vw, 2.75rem);
  --font-h1: clamp(2.15rem, 1.45rem + 2.35vw, 4.25rem);
  --line-body: 1.95;
  --focus-ring: 0 0 0 4px rgba(8, 103, 242, .18);
  --transition-fast: 160ms ease;
  --transition-base: 260ms cubic-bezier(.2,.75,.2,1);

  /* Backward-compatible aliases used by v14 templates. */
  --rayan-blue: var(--color-primary);
  --rayan-navy: var(--color-text);
  --rayan-ink: var(--color-text);
  --rayan-muted: var(--color-muted);
  --rayan-soft: var(--color-surface);
  --rayan-line: var(--color-line);
  --rayan-radius: var(--radius-lg);
  --rayan-shadow: var(--shadow-md);
}