/* ==========================================================================
   JSR CONTRACTS LIMITED — DESIGN TOKENS
   ========================================================================== */

:root {
  /* Brand — primary */
  --jsr-deep-green: #022f16;
  --jsr-lime: #52a519;
  --jsr-white: #ffffff;

  /* Brand — supporting */
  --jsr-near-black: #07110c;
  --jsr-forest: #0b2417;
  --jsr-muted-green: #294936;
  --jsr-light-green: #eaf4e4;
  --jsr-soft-grey: #f4f6f4;
  --jsr-grey: #68716b;
  --jsr-dark-text: #101713;

  /* Semantic */
  --color-bg: var(--jsr-white);
  --color-bg-alt: var(--jsr-soft-grey);
  --color-bg-dark: var(--jsr-deep-green);
  --color-bg-darker: var(--jsr-near-black);
  --color-text: var(--jsr-dark-text);
  --color-text-muted: var(--jsr-grey);
  --color-text-on-dark: var(--jsr-white);
  --color-text-on-dark-muted: #b7c9bd;
  --color-accent: var(--jsr-lime);
  --color-border: rgba(16, 23, 19, 0.1);
  --color-border-on-dark: rgba(255, 255, 255, 0.14);

  /* Typography */
  --font-display: "Manrope", "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --fs-2xs: 0.6875rem;
  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.375rem;
  --fs-xl: 1.75rem;
  --fs-2xl: 2.25rem;
  --fs-3xl: 3rem;
  --fs-4xl: 4rem;
  --fs-5xl: 5.5rem;
  --fs-6xl: 7.5rem;

  /* Spacing scale */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 9rem;

  /* Layout */
  --container-max: 1440px;
  --container-pad: clamp(1.25rem, 4vw, 4rem);
  --radius-sm: 2px;
  --radius-md: 4px;

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 200ms;
  --dur-base: 400ms;
  --dur-slow: 700ms;
  --dur-transition: 650ms;

  /* Layering */
  --z-cursor: 9999;
  --z-preloader: 9100;
  --z-transition: 9000;
  --z-modal: 7000;
  --z-chat: 650;
  --z-nav: 500;
  --z-scroll-jump: 450;
}

@media (max-width: 767px) {
  :root {
    --fs-6xl: 3.25rem;
    --fs-5xl: 2.75rem;
    --fs-4xl: 2.25rem;
    --fs-3xl: 1.875rem;
    --fs-2xl: 1.5rem;
    --container-pad: 1.25rem;
  }
}
