/* ============================================================
   Lunet — Brand tokens
   ------------------------------------------------------------
   This is the customization layer. Rebrand the template by
   editing the values below; index.html reads all of them.
   Loaded BEFORE the inline <style> in index.html.
   ============================================================ */

:root{
  /* ---- Core palette ---------------------------------------
     ink / ink-2  = primary, secondary text (and dark surfaces)
     paper        = page background
     mist         = recessed band / image placeholder background
     line         = 1px borders and hairlines
     lemon        = PRIMARY ACCENT — badges, highlights, CTAs
     cobalt       = SECONDARY ACCENT — links, focus ring, icons (6.6:1 on white — AA for small text)
     cobalt-ink   = darker cobalt for tiny text on lemon
  --------------------------------------------------------- */
  --paper:#ffffff;
  --ink:#0b0b0c;
  --ink-2:#4a4a52;
  --mist:#f4f4f1;
  --line:#e2e2dd;
  --lemon:#f2e14c;
  --cobalt:#1f41e5;
  --cobalt-ink:#16309f;

  /* ---- Typefaces ------------------------------------------
     Change these AND the Google Fonts <link> in index.html.
  --------------------------------------------------------- */
  --f-display:'Archivo',system-ui,sans-serif;   /* headings, prices, product names */
  --f-body:'Inter',system-ui,sans-serif;        /* body / UI */
  --f-mono:'JetBrains Mono',ui-monospace,monospace; /* labels, meta, ticker */

  /* ---- Shape ------------------------------------------------ */
  --radius:4px;
}