/* ═══════════════════════════════════════════════════════════
   Ajeto — design tokens
   Mirrored from the product, so the landing and the app cannot
   drift apart by accident.

   Source: github.com/Flowmatic-AI/Ajeto @ d6416b2 (2026-08-14)
     apps/web/tailwind.config.ts     — palette, type scale, radii
     apps/web/src/app/globals.css    — semantic light/dark tokens
     apps/portal/app/_tokens.css     — the same set, written out

   Everything here is namespaced --ajeto-*. The landing has its own
   short names (--cream, --orange, …) that alias onto these in
   styles.css; the prefix keeps the two sets from colliding and makes
   an imported value greppable.

   This is a copy, not a link. When the app's palette moves, re-pull
   it here — the header commit is what tells you how stale it is.

   NOT imported: the app's status pairs (running/completed/failed/…),
   its spacing scale and sidebar widths, and its dark theme. None of
   them have anything to answer to on a one-page landing. They live in
   the sources above if that changes.
   ═══════════════════════════════════════════════════════════ */

:root {
  /* ---------- Surfaces ---------- *
   * --ajeto-off-white is the app's --background: the canvas the whole
   * product sits on. The landing's cream section is already exactly
   * this, which is the one colour the two sides never disagreed on. */
  --ajeto-off-white:  #FFFDF8;
  --ajeto-paper:      #F9F7F2;   /* --surface-muted: columns, chips */
  --ajeto-white:      #FFFFFF;   /* --bg-elevated */

  /* ---------- Ink ---------- */
  --ajeto-navy:       #1E2A45;   /* primary text · sidebar · --foreground */
  --ajeto-navy-700:   #2B364F;
  --ajeto-navy-800:   #15243A;
  --ajeto-navy-900:   #0F1A2D;
  --ajeto-ink-2:      #45464D;   /* secondary body text */
  --ajeto-muted:      #6B7280;   /* meta, captions */

  /* ---------- Lines ---------- */
  --ajeto-line:       #EAE8E2;
  --ajeto-line-2:     #D9D6CE;

  /* ---------- Brand accents ---------- *
   * In the app --brand-primary and --brand-accent are white-label
   * hooks: an org with its own huisstijl overrides them at runtime and
   * the product re-skins. The landing sells Ajeto itself, so it always
   * wants the Ajeto defaults — the values below are those defaults. */
  --ajeto-orange:        #F57C00;   /* --brand-primary */
  --ajeto-orange-hover:  #E57100;   /* --brand-primary-hover */
  --ajeto-orange-light:  #F9A547;
  --ajeto-on-orange:     #FFFFFF;   /* --brand-on-primary */
  --ajeto-sunshine:      #FFCD57;
  --ajeto-teal:          #2EC4B6;   /* --brand-accent */
  --ajeto-teal-light:    #A5F0E0;
  --ajeto-purple:        #8B5CF6;
  --ajeto-purple-light:  #DDD6FE;
  --ajeto-purple-deep:   #6D28D9;

  /* decorative only, in both places */
  --ajeto-grad-sunrise: linear-gradient(
    90deg,
    #F9A547 0%,
    #FFCD57 38%,
    #A5F0E0 74%,
    #2EC4B6 100%
  );

  /* ---------- Type ---------- *
   * Same two families as the app. It loads them through next/font; the
   * landing takes them from Google Fonts in the <head>, so only the
   * stacks are shared, not the loading. */
  --ajeto-font-display: "Funnel Display", "Figtree", ui-sans-serif, system-ui, sans-serif;
  --ajeto-font-body:    "Figtree", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  --ajeto-tracking-display:       -0.02em;
  --ajeto-tracking-display-tight: -0.015em;
  --ajeto-tracking-caps:           0.14em;
  --ajeto-tracking-caps-tight:     0.16em;

  /* The app's fixed type scale is for a dense product UI. A landing
     headline is fluid and much larger, so the sizes are not shared —
     only the families and the tracking, which are what actually make
     the two read as one brand. */

  /* ---------- Radii ---------- */
  --ajeto-r-sm:   8px;
  --ajeto-r-md:   12px;
  --ajeto-r-lg:   16px;
  --ajeto-r-xl:   20px;
  --ajeto-r-pill: 999px;

  /* ---------- Shadow ---------- */
  --ajeto-shadow-sm: 0 1px 2px rgba(15, 23, 42, .05);
  --ajeto-shadow-md: 0 2px 8px rgba(15, 23, 42, .06), 0 1px 2px rgba(15, 23, 42, .04);
  --ajeto-shadow-lg: 0 8px 32px rgba(15, 23, 42, .08);
}
