/* =========================================================
   TOKENS.CSS — DESIGN SYSTEM REFINEMENT
   Purpose:
   - tighten the visual system
   - support a more elegant / technical / editorial feel
   - give components better spacing, radius and shadow consistency
   ========================================================= */

:root {
  /* ---------------------------------------------------------
     Core colors
     --------------------------------------------------------- */
  --color-navy: #1B2F52;
  --color-charcoal: #1E1F20;
  --color-grey: #4C4C4C;
  --color-mist: #F2F4F7;
  --color-line: #D7DCE3;
  --color-white: #FFFFFF;

  /* ---------------------------------------------------------
     Typography tokens
     --------------------------------------------------------- */
  --font-body: "Lato", Helvetica, Arial, sans-serif;
  --font-ui: "Inter", Helvetica, Arial, sans-serif;

  /* ---------------------------------------------------------
     Layout tokens
     --------------------------------------------------------- */
  --container-max: 1220px;
  --header-height: 82px;

  /* Shared asymmetrical language */
  --radius-button: 2px 6px 2px 6px;
  --radius-button-hover: 6px 2px 6px 2px;
  --radius-card: 2px 6px 2px 6px;
  --radius-card-hover: 6px 2px 6px 2px;

  /* Larger structural radii */
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 28px;
  --radius-pill: 28px;

  /* ---------------------------------------------------------
     Shadows
     --------------------------------------------------------- */
  --shadow-soft: 0 10px 30px rgba(17, 29, 48, 0.08);
  --shadow-card-hover: 0 14px 34px rgba(17, 29, 48, 0.12);
  --shadow-panel: 0 18px 42px rgba(17, 29, 48, 0.08);

  /* ---------------------------------------------------------
     Spacing scale
     --------------------------------------------------------- */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4rem;
  --space-7: 6rem;

  /* ---------------------------------------------------------
     Motion
     --------------------------------------------------------- */
  --ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-fast: 180ms;
  --duration-medium: 280ms;
  --duration-slow: 420ms;
}
