/* Sartor — jetons de design v3, « le patron » (19/10/2026)
   Thème clair par défaut ; sombre via prefers-color-scheme + [data-theme].

   ⚠️ Ce fichier sert un ÉCRAN. Pour un document PDF, ne pas recopier ces
   valeurs : importer `sartor_doc` (via `tools/lib/sartor_brand.py` ou
   `sartor_tools.brand`), qui porte la palette d'impression et les polices
   embarquées.

   v3, 19/10/2026 — la charte v2 (papier crème, serif classique, indigo, fil
   rouge brique, couture pointillée, tout centré) reprenait trait pour trait le
   style par défaut des pages générées par Claude : clients et réseau le
   disaient. Nouvelle direction validée par Enzo, maquette :
   https://claude.ai/artifact/4M3D3gYxJ5AjzHNwi2HRab
   - le vert drap en aplat sur les surfaces de marque (héros, deck, blocs forts),
     avec un quadrillage de patron à peine visible ;
   - le blanc et un gris de section pour les pages courantes ;
   - une seule famille, Archivo : fine (300) en grand corps pour les titres,
     400 pour le texte, étroite (Archivo Narrow 600) pour les cotes et mentions,
     large (Archivo Expanded 600) pour le wordmark ;
   - la craie jaune n'existe que dans le cran du logo ;
   - composition alignée à gauche, angles droits, aucun bouton en pilule.

   Les polices web sont dans `web/` (woff2), à servir en @font-face :
     @font-face{font-family:"Archivo";font-weight:300;src:url(archivo-300-normal.woff2) format("woff2")}
     … 400, 500, 600 ; "Archivo Narrow" 600 ; "Archivo Expanded" 600.
   À défaut, Google Fonts : family=Archivo:wdth,wght@62..125,300..800, et alors
   font-stretch:72% / 115% au lieu des familles Narrow / Expanded.
   En email, le repli est la règle : Arial partout, wordmark en texte. */

:root {
  /* Surfaces & encres */
  --sartor-paper:   #FFFFFF;  /* le blanc : pages courantes */
  --sartor-mist:    #EEEFEC;  /* gris de section */
  --sartor-ink:     #0E1110;  /* texte principal */
  --sartor-ink-2:   #474D4A;  /* texte secondaire */
  --sartor-ink-3:   #737A76;  /* légendes, cotes, méta */
  --sartor-line:    #D3D7D3;  /* filets, bordures */

  /* Marque */
  --sartor-drap:      #143D33;  /* le vert drap : seule couleur posée en surface */
  --sartor-drap-2:    #24584A;  /* drap éclairci : graphiques, lien actif sur blanc */
  --sartor-on-drap:   #F2F5F3;  /* texte sur le drap */
  --sartor-on-drap-2: #A9BDB5;  /* texte secondaire sur le drap */
  --sartor-drap-grid: rgba(255,255,255,.14); /* quadrillage et filets sur le drap */
  --sartor-craie:     #EFD34A;  /* la craie : le cran du logo, nulle part ailleurs */

  /* Typo — mêmes piles que sartor_fonts.py, à garder alignées. */
  --sartor-display: "Archivo", "Helvetica Neue", Arial, sans-serif;           /* 300, grand corps */
  --sartor-sans:    "Archivo", "Helvetica Neue", Arial, sans-serif;           /* 400 texte */
  --sartor-label:   "Archivo Narrow", "Arial Narrow", Arial, sans-serif;      /* 600, capitales, .1em */
  --sartor-wordmark:"Archivo Expanded", "Archivo", Arial, sans-serif;         /* 600, capitales, .16em */
  --sartor-mono:    "DejaVu Sans Mono", ui-monospace, Menlo, Consolas, monospace; /* code seulement */

  /* Wordmark */
  --sartor-wm-tracking: 0.16em;
  --sartor-wm-weight: 600;

  /* Formes */
  --sartor-radius: 0;          /* angles droits partout */
  --sartor-grid-step: 40px;    /* pas du quadrillage sur le drap */

  /* Alias v2, gardés pour ne rien casser chez un consommateur pas encore migré.
     Ne plus les employer dans un fichier neuf. */
  --sartor-surface: var(--sartor-paper);
  --sartor-hair:    var(--sartor-line);
  --sartor-indigo:  var(--sartor-drap);
  --sartor-indigo-soft: var(--sartor-drap-2);
  --sartor-thread:  var(--sartor-drap-2);
  --sartor-serif:   var(--sartor-display);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --sartor-paper: #101413; --sartor-mist: #181D1B;
    --sartor-ink: #EEF1EF; --sartor-ink-2: #B6BDB9; --sartor-ink-3: #88908C;
    --sartor-line: #2A302D;
    --sartor-drap: #123A30; --sartor-drap-2: #5FA58C;
    color-scheme: dark;
  }
}
:root[data-theme="light"] {
  --sartor-paper: #FFFFFF; --sartor-mist: #EEEFEC;
  --sartor-ink: #0E1110; --sartor-ink-2: #474D4A; --sartor-ink-3: #737A76;
  --sartor-line: #D3D7D3;
  --sartor-drap: #143D33; --sartor-drap-2: #24584A;
}
:root[data-theme="dark"] {
  --sartor-paper: #101413; --sartor-mist: #181D1B;
  --sartor-ink: #EEF1EF; --sartor-ink-2: #B6BDB9; --sartor-ink-3: #88908C;
  --sartor-line: #2A302D;
  --sartor-drap: #123A30; --sartor-drap-2: #5FA58C;
  color-scheme: dark;
}

/* La cote : un libellé de section tracé comme une mesure de patron.
   <div class="sartor-cote">Notre métier</div> */
.sartor-cote {
  font-family: var(--sartor-label); font-weight: 600; font-size: 12.5px;
  letter-spacing: .1em; text-transform: uppercase; color: var(--sartor-ink-3);
  display: flex; align-items: center; gap: 10px;
}
.sartor-cote::before, .sartor-cote::after { content: ""; height: 1px; background: currentColor; flex: 1 }
.sartor-cote::before { flex: 0 0 18px }