:root {
  /* ── DEFINITIVNÍ brand paleta (revize 2026-09-03: modrá padla — Inkoust
     #14304A i Obloha #D8F0FD nahrazeny; tmavou nese Sépie, Papír zesvětlen,
     Příležitost prosvětlena; sekundární plochy jen tóny Papíru) ──
     pojmenované barvy dle brand manuálu (/brand/) */
  --sepie: #32002A;        /* tmavá — text, tmavá pozadí */
  --prilezitost: #C4512B;  /* terakota — marker, anomálie, signály */
  --papir: #F1EEE9;        /* krémová — světlé pozadí i sekundární plochy */
  --aktivni: #22B8AD;      /* tyrkys — CTA, akční prvky */
  /* tmavé odstíny JEN pro dissolve hover tlačítek (mimo paletu):
     výplň se do tlačítka sype v tmavším tónu téže barvy */
  --aktivni-tma: #116A62;
  --prilezitost-tma: #6E3210;

  /* aliasy původních jmen — používá je zbytek CSS a JS */
  --inkoust: var(--sepie);
  --oxblood: var(--sepie);
  --beige: var(--papir);
  --terracotta: var(--prilezitost);
  --accent: var(--aktivni);
  --latent-terra: rgba(196, 81, 43, 0.55);
  /* RGB složky pro průhledné odstíny v CSS (rgba(var(--aktivni-rgb), .08)) */
  --aktivni-rgb: 34, 184, 173;

  /* role tokeny — světlý režim (výchozí) */
  --color-text: var(--sepie);
  --color-bg: var(--papir);
  --color-latent: rgba(50, 0, 42, 0.14);

  /* typografie a mřížka — beze změny s tématem
     hlavní písmo (nadpisy) = Stack Sans Text, obsahové = Sofia Sans
     — párování dle brand manuálu (/brand/) */
  --font-display: 'Sofia Sans', sans-serif;
  --font-head: 'Stack Sans Text', 'Sofia Sans', sans-serif;
  /* ── typografická škála — velikosti písma na JEDNOM místě
     (v závorce hodnota na okně 1440 px; Marek 2026-09-03: „text je všeobecně
     malý“ — obsah 20, volné odstavce 24, popisek 30; h1 60, h2/tlačítka beze změny) ── */
  --fs-text: 1.25rem;                           /* obsahový text: karty, medailonky, menu, články (20 px) */
  --fs-copy: 1.5rem;                            /* volné odstavce a modelové příklady na podstránkách (24 px) */
  --fs-small: 1rem;                             /* drobné popisky: meta článků, patička menu (16 px) */
  --fs-lead: clamp(1.4rem, 2.2vw, 1.875rem);    /* popisek pod úvodním nadpisem (30 px) */
  --fs-h1: clamp(2.2rem, 5vw, 3.75rem);         /* úvodní nadpis (60 px) */
  --fs-h2: clamp(1.7rem, 3.2vw, 2.4rem);        /* nadpisy sekcí (38 px) */
  --fs-h3: 1.5rem;                              /* nadpisy karet (24 px) */
  --fs-btn: clamp(0.85rem, 1.3vw, 1.05rem);     /* tlačítka (17 px) */
  --cell: clamp(30px, 5.2vw, 56px);
  --gap: clamp(6px, 1vw, 11px);
  --mask-pad-x: clamp(10px, 1.6vw, 16px);
  --mask-pad-y: clamp(5px, 0.7vw, 8px);
  --tilt-deg: -9;
  --type-speed: 42;
  /* rychlejší psaní pro delší texty (data-typewriter="fast") */
  --type-speed-fast: 14;
  --edge-margin: 12px;
  /* jednotná tloušťka obrysu čtverečků — napříč celým webem (CSS i canvas) */
  --line-w: 1.5px;
  /* utlumení mřížky mimo reflektor: násobek plné síly (--color-latent).
     1 = původní vzhled bez reflektoru */
  --grid-dim: 0.3;
  /* krok mřížky = buňka + mezera; rozměry obsahu se zarovnávají na jeho násobky */
  --step: calc(var(--cell) + var(--gap));

  /* šířka menu = šířka loga Probis (124 px) + 24 px okraje z obou stran;
     CTA se láme na dva řádky, ať šířku nediktuje ono (Marek 2026-09-11) */
  --sidebar-w: 172px;
  /* MENU NIKDY NEHÝBE OBSAHEM: rezervace --sidebar-w je pro obsah
     konstantní. Po scrollu se sidebar zasune do lišty ikon (--rail-w)
     a pole si jen dokreslí čtverce do uvolněného pásu — --nav-w je
     VIDITELNÁ šířka menu, čte ji field.js (leftExt). */
  --rail-w: calc(var(--gap) + var(--step));
  --nav-w: var(--sidebar-w);
}

[data-theme="dark"] {
  --color-text: var(--papir);
  --color-bg: var(--sepie);
  --color-latent: var(--latent-dark, rgba(241, 238, 233, 0.16));
}

/* ── inverzní tokeny (Marek 2026-09-27): sekce, která se má barevně
   PŘEVRÁTIT vůči aktuálnímu režimu (závěr homepage), si přepíše
   --color-* na tyhle hodnoty ── */
:root {
  --inv-bg: var(--sepie);
  --inv-text: var(--papir);
  --inv-latent: var(--latent-dark, rgba(241, 238, 233, 0.16));
}
[data-theme="dark"] {
  --inv-bg: var(--papir);
  --inv-text: var(--sepie);
  --inv-latent: rgba(50, 0, 42, 0.14);
}

/* ── BAREVNÉ VARIANTY (Marek 2026-09-11, přepínač A/B v menu, theme.js;
   původní paleta výše zůstává jako výchozí bez atributu) ──
   Mapování: tmavá → Sépie (text / tmavé pozadí), velmi světlá → Papír
   (místo krémové), první akcent → Příležitost (marker, terakotové
   tlačítko), druhý akcent → Aktivní (CTA). Tmavé odstíny hoveru jsou
   ztmavené tóny týchž barev. Kdo chce akcenty prohodit, prohodí
   --prilezitost a --aktivni (a jejich -tma / -rgb / latent). */
[data-palette="a"] {
  --sepie: #2E0025;
  --prilezitost: #C1297C;
  --papir: #FFF7F2;
  --aktivni: #43D392;
  --aktivni-tma: #1F7A52;
  --prilezitost-tma: #6B1545;
  --latent-terra: rgba(193, 41, 124, 0.55);
  --aktivni-rgb: 67, 211, 146;
  --color-latent: rgba(46, 0, 37, 0.14);
  --latent-dark: rgba(255, 247, 242, 0.16);
}
[data-palette="b"] {
  --sepie: #2E0153;
  --prilezitost: #8766FA;
  --papir: #FBF6F9;
  --aktivni: #00C1AD;
  --aktivni-tma: #00695E;
  --prilezitost-tma: #45308F;
  --latent-terra: rgba(135, 102, 250, 0.55);
  --aktivni-rgb: 0, 193, 173;
  --color-latent: rgba(46, 1, 83, 0.14);
  --latent-dark: rgba(251, 246, 249, 0.16);
}
[data-palette][data-theme="dark"] { --color-latent: var(--latent-dark); }