/* ============================================================
   Finger Marketing Services — Color System
   Architecture (Designhandbuch §4): each business area has an
   internal anchor tone; each product carries its own audience-
   specific shade. Communication always shows the PRODUCT shade,
   never the area label.
   ============================================================ */

:root {
  /* --- Brand core --- */
  --brand-blue: #3D63FF;      /* Signature dot — CMYK 76/61/0/0 */
  --brand-navy: #2A3B5C;      /* Wordmark "finger" — CMYK 54/36/0/64 */
  --meta-gray: #5B6B7D;       /* Sub-line "marketing services" — CMYK 27/14/0/51 */

  /* --- Neutrals --- */
  --neutral-bg: #F7F6F3;      /* Warm off-white page background — CMYK 0/0/2/3 */
  --neutral-white: #FFFFFF;
  --neutral-dark: #12213D;    /* Dark surface / body text — CMYK 70/46/0/76 */

  /* Neutral tints derived for borders, dividers, fills */
  --neutral-border: #E4E2DC;  /* subtle warm border on --neutral-bg */
  --neutral-border-strong: #D2CFC6;
  --neutral-muted: #8A96A3;   /* lighter meta / placeholder */
  --neutral-surface-sunken: #EEEDE8;

  /* --- Lettershop (zuverlässig, modern) — blue family --- */
  --lettershop-1: #6D8FF0;    /* Wahlunterlagen-Versand — CMYK 55/40/0/6 */
  --lettershop-2: #3D63FF;    /* Individualisierte Händlermailings — CMYK 76/61/0/0 */
  --lettershop-3: #2A45B8;    /* Vertrauliche Dokumentenströme — CMYK 77/62/0/28 */

  /* --- Konfektionierung (schnell, günstig) — amber family --- */
  --konfekt-1: #FFB648;       /* Onboarding-/Geburtstagspakete — CMYK 0/29/72/0 */
  --konfekt-2: #FF8F3F;       /* POS-Paket-Erstellung — CMYK 0/44/75/0 */
  --konfekt-3: #E08A2B;       /* Handveredelung / Corporate Gifting — CMYK 0/38/81/12 */

  /* --- Fulfillment (innovativ, modern) — teal family --- */
  --fulfillment-1: #14B8AE;   /* Werbemittel-Bestellportal — CMYK 89/0/5/28 */
  --fulfillment-2: #6FCEC9;   /* Fulfillment für Werbemittelhändler — CMYK 46/0/2/19 */

  /* ============================================================
     Semantic aliases
     ============================================================ */

  /* Surfaces */
  --color-bg: var(--neutral-bg);
  --surface-page: var(--neutral-bg);
  --surface-card: var(--neutral-white);
  --surface-sunken: var(--neutral-surface-sunken);
  --surface-dark: var(--neutral-dark);

  /* Text */
  --text-body: var(--neutral-dark);
  --text-heading: var(--brand-navy);
  --text-meta: var(--meta-gray);
  --text-muted: var(--neutral-muted);
  --text-on-dark: var(--neutral-white);
  --text-link: var(--brand-blue);
  --text-link-hover: var(--lettershop-3);

  /* Borders */
  --border-subtle: var(--neutral-border);
  --border-strong: var(--neutral-border-strong);

  /* Accent (default = brand blue; product pages override --accent) */
  --accent: var(--brand-blue);
  --accent-strong: var(--lettershop-3);

  /* Signature */
  --signature: var(--brand-blue);

  /* ------------------------------------------------------------
     Button text-color rule (Designhandbuch §4 contrast audit):
     White text ONLY works on the two darker Lettershop blues.
     On every Konfektionierung/Fulfillment tone AND on #6D8FF0,
     use --brand-navy as the text color, never white.
     Per-product `--on-<product>` tokens encode the verified choice.
     ------------------------------------------------------------ */
  --on-lettershop-1: var(--brand-navy);   /* #6D8FF0 → navy */
  --on-lettershop-2: var(--neutral-white); /* #3D63FF → white */
  --on-lettershop-3: var(--neutral-white); /* #2A45B8 → white */
  --on-konfekt-1: var(--brand-navy);
  --on-konfekt-2: var(--brand-navy);
  --on-konfekt-3: var(--brand-navy);
  --on-fulfillment-1: var(--brand-navy);
  --on-fulfillment-2: var(--brand-navy);
}
