/* ==========================================================================
   Limitless — Canonical Design Tokens (April 26ʼ)  —  forked verbatim
   Source: Limitless_design_system_april26/src/styles/tokens.css
   DO NOT edit the canon block. NAVI co-brand additions are appended below
   and clearly marked.
   ========================================================================== */

:root {
  /* --- Primitive / Base / Gray --- */
  --color-gray-50:  #ffffff;
  --color-gray-100: #fafafa;
  --color-gray-200: #f0f0f0;
  --color-gray-300: #ededed;
  --color-gray-400: #e5e5e5;
  --color-gray-500: #cdcdcd;
  --color-gray-600: #a8a8a8;
  --color-gray-700: #747474;
  --color-gray-800: #393939;
  --color-gray-900: #000000;

  /* --- Primitive / Base / Brand Neon --- */
  --color-neon-500: #c3ff00;

  /* --- Semantic --- */
  --color-yes:   #389a57;
  --color-no:    #ed5023;
  --color-live:  #ed5023;
  --color-warn:  #ff9200;

  /* --- Semantic Light Theme aliases --- */
  --bg-app:        var(--color-gray-50);
  --bg-surface:    var(--color-gray-50);
  --bg-muted:      var(--color-gray-200);
  --bg-button:     var(--color-gray-300);
  --border-subtle: var(--color-gray-400);
  --text-primary:  var(--color-gray-900);
  --text-secondary:var(--color-gray-700);
  --text-tertiary: var(--color-gray-600);
  --text-on-neon:  var(--color-gray-900);

  /* --- Typography --- */
  --font-body:  'Inter', system-ui, -apple-system, sans-serif;
  --font-title: 'MD Nichrome', 'Inter', system-ui, sans-serif;

  --fs-h1: 32px;        --lh-h1: 40px;
  --fs-h2: 24px;        --lh-h2: 28px;
  --fs-h3: 20px;        --lh-h3: 24px;  --ls-h3: 2px;
  --fs-paragraph: 14px; --lh-paragraph: 20px;
  --fs-caption: 12px;   --lh-caption: 16px;
  --fs-ui: 14px;        --lh-ui: 16px;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-bold:    700;

  /* --- Radius --- */
  --radius-card: 12px;
  --radius-btn: 8px;
  --radius-pill: 9999px;

  /* --- Shadow --- */
  --shadow-button: 0 1px 4px 0 rgba(2, 6, 23, 0.05);
  --shadow-card:   0 1px 2px 0 rgba(2, 6, 23, 0.04);

  /* --- Easing (Emil Kowalski non-negotiables) --- */
  --ease-out:    cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);

  /* --- Layout --- */
  --container-max: 1328px;
  --container-gutter: 76px;
  --card-width: 320px;
  --card-height: 172px;
  --card-gap: 16px;

  /* ======================================================================
     NAVI CO-BRAND ADDITIONS  (NOT part of the Limitless canon)
     ----------------------------------------------------------------------
     Added for the NAVI × Cologne Warm-up co-branded activation only.
     NAVI's brand identity is black + signature yellow. These two tokens
     let the hero / accents read as "NAVI" while the rest of the page stays
     on the Limitless light-theme palette above.
     If NAVI co-brands become recurring, promote these into the canon.
     ====================================================================== */
  --navi-yellow:      #ffe500;  /* NAVI signature yellow — co-brand accent */
  --navi-yellow-dim:  #d9c400;  /* darker yellow for text-on-yellow hovers */
  --navi-black:       #0a0a0a;  /* NAVI hero panel ground (near-black) */
  --navi-panel:       #141414;  /* raised surfaces inside the dark hero */
  --navi-panel-line:  #2a2a2a;  /* hairline borders inside the dark hero */
}