/*
  Design tokens — LEJN premium demo
  Single source of truth for colour, type and spacing.
  Keep this file framework-agnostic: pure custom properties,
  safe to carry unchanged into a future WordPress theme.
*/

:root {
  /* ---- Colour: Navy / Blue (retained LEJN identity, modernised) ---- */
  --c-navy-900: #071322;
  --c-navy-800: #0b1e35;
  --c-navy-700: #10294a;
  --c-navy-600: #163863;
  --c-blue-600: #1c4c8c;
  --c-blue-500: #2864ad;
  --c-blue-400: #3f7fcc;

  /* ---- Neutrals ---- */
  --c-white: #ffffff;
  --c-grey-50: #f6f8fa;
  --c-grey-100: #eef1f4;
  --c-grey-200: #dde3e9;
  --c-grey-300: #c3ccd4;
  --c-grey-400: #94a1ad;
  --c-grey-600: #5a6672;
  --c-grey-700: #3d4750;
  --c-grey-800: #262e35;

  /* ---- Accent (restrained, used only for primary actions) ---- */
  /* accent-600 is the button/text-safe default: 4.6:1 white-on-accent, AA compliant */
  --c-accent-700: #9c5115;
  --c-accent-600: #b45f1c;
  --c-accent-500: #cf7226;
  --c-accent-400: #e08a3d;

  /* ---- Semantic aliases ---- */
  --c-bg: var(--c-white);
  --c-bg-alt: var(--c-grey-50);
  --c-bg-dark: var(--c-navy-800);
  --c-text: var(--c-grey-800);
  --c-text-muted: var(--c-grey-600);
  --c-text-on-dark: #eef2f6;
  --c-text-on-dark-muted: #a9b7c6;
  --c-border: var(--c-grey-200);
  --c-border-on-dark: rgba(255, 255, 255, 0.12);

  /* ---- Typography ---- */
  --font-heading: "IBM Plex Sans", -apple-system, "Segoe UI", sans-serif;
  --font-body: "Inter", -apple-system, "Segoe UI", sans-serif;

  --text-xs: clamp(0.75rem, 0.73rem + 0.1vw, 0.8125rem);
  --text-sm: clamp(0.875rem, 0.85rem + 0.12vw, 0.9375rem);
  --text-base: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 1.08rem + 0.2vw, 1.25rem);
  --text-xl: clamp(1.3rem, 1.22rem + 0.4vw, 1.5rem);
  --text-2xl: clamp(1.6rem, 1.45rem + 0.75vw, 2rem);
  --text-3xl: clamp(2rem, 1.75rem + 1.2vw, 2.75rem);
  --text-4xl: clamp(2.5rem, 2.1rem + 1.8vw, 3.75rem);
  --text-5xl: clamp(3rem, 2.4rem + 2.8vw, 4.75rem);

  --leading-tight: 1.15;
  --leading-snug: 1.35;
  --leading-normal: 1.6;

  /* ---- Spacing scale (4px base) ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;

  /* ---- Layout ---- */
  --container-max: 1280px;
  --container-pad: clamp(1.25rem, 4vw, 3rem);
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 10px;

  /* ---- Motion ---- */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration-base: 300ms;
  --duration-slow: 600ms;

  /* ---- Elevation ---- */
  --shadow-sm: 0 1px 2px rgba(7, 19, 34, 0.06), 0 1px 1px rgba(7, 19, 34, 0.04);
  --shadow-md: 0 8px 24px rgba(7, 19, 34, 0.09), 0 2px 6px rgba(7, 19, 34, 0.06);
  --shadow-lg: 0 20px 48px rgba(7, 19, 34, 0.16), 0 4px 12px rgba(7, 19, 34, 0.08);
}
