/* Majulah Solutions — brand design tokens */

:root {
  /* Brand colours */
  --color-primary:        #0047AB;
  --color-primary-dark:   #003075;
  --color-accent-red:     #EF3340;
  --color-accent-purple:  #aa08de;

  /* Neutral palette */
  --color-bg:             #f9f9fb;
  --color-surface:        #ffffff;
  --color-text:           #1a1a1a;
  --color-text-muted:     #555555;
  --color-border:         #dde1e9;

  /* Typography */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               Helvetica, Arial, sans-serif, "Apple Colour Emoji";
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;

  --text-xs:   0.75rem;   /*  12px */
  --text-sm:   0.875rem;  /*  14px */
  --text-base: 1rem;      /*  16px */
  --text-lg:   1.125rem;  /*  18px */
  --text-xl:   1.25rem;   /*  20px */
  --text-2xl:  1.5rem;    /*  24px */
  --text-3xl:  1.875rem;  /*  30px */
  --text-4xl:  2.25rem;   /*  36px */

  --leading-tight:  1.25;
  --leading-normal: 1.6;

  /* Spacing scale (multiples of 4 px) */
  --space-1:  0.25rem;   /*  4px */
  --space-2:  0.5rem;    /*  8px */
  --space-3:  0.75rem;   /* 12px */
  --space-4:  1rem;      /* 16px */
  --space-6:  1.5rem;    /* 24px */
  --space-8:  2rem;      /* 32px */
  --space-12: 3rem;      /* 48px */
  --space-16: 4rem;      /* 64px */

  /* Layout */
  --max-width: 1100px;
  --header-height: 64px;

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
}