/* ============================================================
   MODULINO — COLOR TOKENS
   One brand surface: the warm cream + orange marketing identity
   (modulino.vercel.app). Sourced from the landing page + logos.
   ============================================================ */
:root {
  /* --- Brand orange (the Modulino mark) --- */
  --orange-700: #c2410c;
  --orange-600: #ea580c;   /* deep — hover / pressed / accent text */
  --orange-500: #f97316;   /* primary brand */
  --orange-400: #fb923c;
  --orange-300: #fdba74;   /* on-dark accent */
  --orange-200: #fed7aa;
  --orange-100: #ffedd5;   /* soft fill (eyebrows, pills) */
  --orange-50:  #fff8f0;   /* tint wash */

  /* --- Ink (near-black navy: dark sections + wordmark) --- */
  --ink:        #1f2937;
  --ink-2:      #374151;
  --ink-soft:   #9aa3b2;   /* muted text on ink backgrounds */

  /* --- Warm neutrals (all surfaces) --- */
  --bg:          #fffaf4;  /* page cream */
  --bg-warm:     #fdf4ea;  /* alternating warm section */
  --paper:       #ffffff;  /* cards */
  --line:        #f1e2cf;  /* warm hairline */
  --line-strong: #e2cbac;  /* warm border */
  --muted:       #6b7280;  /* secondary text */
  --neutral:     #d8d4c5;  /* inert dot / placeholder chip */

  /* --- Accent set (module tags, quotes, "from" chips) --- */
  --accent-blue:   #4f7cc4;
  --accent-purple: #7f6bce;
  --accent-orange: #d68b3a;
  --accent-red:    #c95a4a;
  --accent-teal:   #287882;

  /* ============================================================
     SEMANTIC ALIASES — prefer these
     ============================================================ */
  --brand:          var(--orange-500);
  --brand-deep:     var(--orange-600);
  --brand-soft:     var(--orange-100);
  --brand-tint:     var(--orange-50);
  --brand-on-dark:  var(--orange-300);

  --text-strong:    var(--ink);
  --text-body:      var(--ink-2);
  --text-muted:     var(--muted);
  --text-on-brand:  #ffffff;
  --text-on-ink:    var(--bg);
  --text-muted-ink: var(--ink-soft);

  --surface-page:   var(--bg);
  --surface-warm:   var(--bg-warm);
  --surface-card:   var(--paper);
  --surface-ink:    var(--ink);

  --border-hair:    var(--line);
  --border-strong:  var(--line-strong);

  --focus-ring:     var(--orange-500);

  /* Module category tag colours (landing "Alap / Komplex / Standard") */
  --tag-base:    rgba(14,20,17,.78);
  --tag-complex: rgba(102,64,184,.94);
  --tag-std:     rgba(40,120,130,.94);
}
