/* ══════════════════════════════════════════════════════════════════════════
   brand.css — Layer 1, celermedia.com v1

   Colors: the locked 22-token celer palette. Pulled from the canonical source
   (lifePanel internal/web/static/css/app.css) and verified against the locked
   spec in tasks/01_scaffold-and-tokens.md. This is celermedia.com's OWN copy —
   no runtime dependency on lifePanel.

   Every hex literal in this repo lives in the :root block below. A rule
   elsewhere with a literal hex is a bug — rules reference var(--…) only.
   ══════════════════════════════════════════════════════════════════════════ */

:root {
  /* ── surfaces — cool charcoal, layered not flat ───────────────── */
  --surface-0:  #16181b;   /* page */
  --surface-1:  #1c1f23;   /* header, footer, cards */
  --surface-2:  #23272c;   /* raised / hover */
  --border:     #2c3036;
  --border-hi:  #3a3f46;

  /* ── text — grey, never white ─────────────────────────────────── */
  --text:       #c5c9ce;
  --text-dim:   #888e96;
  --text-faint: #575d65;

  /* ── accent — MUTED, greener + darker than brand webGreen ─────── */
  --accent:     #7ba05a;   /* the working green. NOT #a4d65e. */
  --accent-hi:  #93bd6b;   /* hover / focus only */
  --accent-dim: #7ba05a26; /* fills, ~15% */

  /* ── secondary accents — muted from brand ─────────────────────── */
  --accent-blue:      #4a7f8c;   /* from webBlue #4a90a4 */
  --accent-blue-hi:   #4fa1b5;
  --accent-blue-dim:  #4a7f8c26;
  --accent-purple:    #6b5f9e;   /* from celerPurple #5854a9 */
  --accent-purple-hi: #7f72bb;
  --accent-purple-dim:#6b5f9e26;

  /* ── semantic ─────────────────────────────────────────────────── */
  --warn:   #b8883f;
  --danger: #a8514e;

  /* ── canonical brand — REFERENCE ONLY, never used outside :root ─ */
  --brand-green:  #a4d65e;
  --brand-blue:   #4a90a4;
  --brand-purple: #5854a9;

  /* ══════════════════════════════════════════════════════════════════════
     PROVISIONAL — celermedia.com v1.
     Graduation candidate for master design-language home (Decision #64
     Part B). Tune by eye; do not treat as locked.
     ══════════════════════════════════════════════════════════════════════ */

  /* ── surfaces — gradient endpoints (task 04) ──────────────────────
     NOT part of the locked 22. Two extra surface values either side of
     --surface-0, used only as the endpoints of the page's diagonal ground
     gradient. Tokenised rather than left as bare hex so the "no literal hex
     in a rule" law holds. Graduation candidates: if the locked palette ever
     gains surface steps, these are the two it wants. */
  --surface-ink: #131518;   /* darker than --surface-0 — gradient start */
  --surface-hi:  #20242a;   /* lighter than --surface-2 — gradient end   */

  /* ── type — families ──────────────────────────────────────────── */
  --font-head: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body: 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* ── type — modular scale, 1rem base, ~1.25 ratio ─────────────── */
  --fs-1: 0.8rem;     /* 12.8px — fine print, footer */
  --fs-2: 1rem;       /* 16px   — body */
  --fs-3: 1.25rem;    /* 20px   — lead / subhead */
  --fs-4: 1.563rem;   /* 25px   — h3 */
  --fs-5: 1.953rem;   /* 31px   — h2 */
  --fs-6: 2.441rem;   /* 39px   — h1 / hero */

  /* ── spacing — 8px base ───────────────────────────────────────── */
  --sp-1: 0.5rem;     /*  8px */
  --sp-2: 1rem;       /* 16px */
  --sp-3: 1.5rem;     /* 24px */
  --sp-4: 2rem;       /* 32px */
  --sp-5: 3rem;       /* 48px */
  --sp-6: 4rem;       /* 64px */

  /* ── layout / shape ───────────────────────────────────────────── */
  --content-max: 1100px;
  --radius: 6px;

  /* ══ end PROVISIONAL block ══════════════════════════════════════════ */
}
