/* Fichier généré par tools/jetons.mjs, ne pas éditer. Source : design/jetons.json ; commande : npm run jetons.
   Valeurs de DESIGN.md sections 2 à 6. Les feuilles d'écran ne redéclarent JAMAIS une de ces variables
   (tests/architecture-site.test.mjs, T12) et n'écrivent aucune couleur ni taille en dur (tests/css-jetons.test.mjs). */

:root {
  /* Les cinq de la direction */
  --fond: #F4F7FB;
  --surface: #FFFFFF;
  --dominante: #2340B0;
  --accent: #C42B67;
  --sourdine: #586783;

  /* Texte et lignes */
  --encre: #0F1A3A;
  --filet: #D5DEEA;
  --filet-fort: #76839E;

  /* Teintes dérivées */
  --dominante-douce: #EAF0F9;
  --dominante-pale: #DCE5F4;
  --accent-fort: #A12257;
  --accent-pale: #FBE6EE;

  /* États */
  --succes: #1E7B4F;
  --succes-pale: #E3F1EA;
  --attention: #8F5B00;
  --attention-pale: #FBEFD2;
  --info: #2B5CA8;
  --info-pale: #E8EEF8;

  /* Canal WhatsApp */
  --whatsapp: #0B6B3A;

  /* Typographie */
  --police-titre: "Fraunces", Georgia, serif;
  --police-texte: "Figtree", system-ui, sans-serif;
  --police-titre-he: "Frank Ruhl Libre", "Times New Roman", serif;
  --police-texte-he: "Heebo", system-ui, sans-serif;
  --t-micro: 0.8125rem;
  --t-petit: 0.9375rem;
  --t-corps: 1rem;
  --t-lead: 1.1875rem;
  --t-h4: 1.375rem;
  --t-h3: 1.75rem;
  --t-h2: clamp(2rem, 4vw, 2.75rem);
  --t-h1: clamp(2.5rem, 6vw, 4.5rem);
  --lh-corps: 1.6;
  --ls-h1: -0.02em;
  --ls-micro: 0.06em;
  --t-affiche: calc(clamp(3.5rem, 9vw, 8rem) * var(--echelle-titre));
  --t-titre: calc(clamp(2.5rem, 5.5vw, 5rem) * var(--echelle-titre));
  --t-nom: calc(clamp(2.5rem, 5.5vw, 5rem) * var(--echelle-titre));
  --t-sous-titre: clamp(1.625rem, 2.6vw, 2.25rem);
  --t-chiffre: clamp(2.25rem, 4vw, 3.5rem);
  --t-intro: clamp(1.1875rem, 1.5vw, 1.375rem);
  --t-surtitre: 0.8125rem;
  --lh-affiche: 1.02;
  --lh-titre: 1.06;
  --lh-sous-titre: 1.2;
  --lh-intro: 1.5;
  --ls-affiche: -0.03em;
  --ls-titre: -0.02em;
  --ls-surtitre: 0.18em;
  --mesure-texte: 34rem;
  --mesure-titre: 16ch;
  --echelle-titre: 1;

  /* Espacement, rayons, filets */
  --e1: 0.25rem;
  --e2: 0.5rem;
  --e3: 1rem;
  --e4: 1.5rem;
  --e5: 2rem;
  --e6: 3rem;
  --e7: 4rem;
  --e8: 6rem;
  --e9: 8rem;
  --rayon-s: 6px;
  --rayon-m: 12px;
  --rayon-l: 20px;
  --filet-trait: 1px solid var(--filet);
  --ombre-carte: 0 1px 2px rgb(15 26 58 / 0.06), 0 8px 24px rgb(15 26 58 / 0.06);

  /* Motion */
  --ease-entree: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-deplacement: cubic-bezier(0.65, 0, 0.35, 1);
  --d-micro: 150ms;
  --d-court: 240ms;
  --d-moyen: 400ms;
  --d-long: 720ms;

  /* Hauteur de l'en-tête (72 px, 64 px sur téléphone) */
  --entete-h: 72px;

  /* Traits et anneaux de focus (DESIGN.md sections 5 et 7) */
  --trait: 1px;
  --trait-champ: 1.5px;
  --trait-fort: 2px;
  --anneau: 3px;
  --anneau-decalage: 2px;

  /* Opacités (cases éteintes avant l'allumage du calendrier) */
  --opacite-eteint: 0.35;

  /* Dimensions des composants (DESIGN.md sections 4 et 5, bloc 2) */
  --cible: 44px;
  --champ-h: 48px;
  --socle-h: 56px;
  --hauteur-bouton: var(--champ-h);
  --ligne-devis: 48px;
  --case: 24px;
  --badge-h: 28px;
  --icone-s: 14px;
  --icone-m: 20px;
  --taille-picto: 32px;
  --taille-picto-s: 20px;
  --disque-picto: 48px;
  --cercle-coche: 56px;
  --case-mois: 44px;
  --case-cockpit: 32px;
  --hachure: 6px;
  --puce: 6px;
  --conteneur: 1200px;
  --gouttiere: 24px;
  --cadre-telephone: 390px;
  --decalage-entree: 12px;
  --glissement-photo: 8px;

  /* Voiles sur photo (DESIGN.md section 2) */
  --voile-photo: color-mix(in srgb, var(--dominante) 8%, transparent);
  --voile-local: rgb(15 26 58 / 0.6);

  /* Calendrier de disponibilité : états des cases (DESIGN.md section 5) */
  --cal-libre-fond: var(--surface);
  --cal-libre-bord: var(--filet-fort);
  --cal-libre-survol: var(--dominante-douce);
  --cal-occupe-fond: var(--dominante-pale);
  --cal-occupe-hachure: var(--filet-fort);
  --cal-selection-fond: var(--dominante);
  --cal-selection-texte: var(--surface);
  --cal-selection-point: var(--surface);
  --cal-retenue-point: var(--accent);
  --cal-plage-fond: var(--dominante-douce);
  --cal-exemple-bord: var(--attention);

  /* Statuts de paiement et de caution : reçu, attendu, à surveiller, neutre (libérée) */
  --statut-recu-texte: var(--succes);
  --statut-recu-fond: var(--succes-pale);
  --statut-attendu-texte: var(--info);
  --statut-attendu-fond: var(--info-pale);
  --statut-attention-texte: var(--attention);
  --statut-attention-fond: var(--attention-pale);
  --statut-neutre-texte: var(--sourdine);
  --statut-neutre-fond: var(--dominante-douce);

  /* Tailles de chiffres par rôle (DESIGN.md section 3, tailles retenues par écran) */
  --t-total: var(--t-h4);
  --t-heure-allumage: var(--t-h2);

  /* Durées par rôle (DESIGN.md sections 5 et 6) */
  --d-sortie: var(--d-micro);
  --d-roulement: var(--d-moyen);
  --d-coche: var(--d-moyen);
  --d-trait: 1080ms;

  /* Éditorial de la passe luxe : grille, rythme, filets, ratios (05-SPEC-systeme sections 2 et 4) */
  --marge-ed: clamp(1.25rem, 4.5vw, 4rem);
  --gouttiere-ed: clamp(1rem, 2.2vw, 2rem);
  --largeur-ed: 90rem;
  --rythme-xs: clamp(2rem, 4vw, 4rem);
  --rythme-s: clamp(4rem, 8vw, 8rem);
  --rythme-m: clamp(6rem, 12vw, 12rem);
  --rythme-l: clamp(8rem, 16vw, 16rem);
  --filet-ed: 1px solid color-mix(in srgb, var(--dominante) 28%, var(--fond));
  --filet-sur-fonce: 1px solid color-mix(in srgb, var(--surface) 35%, transparent);
  --ratio-large: 21 / 9;
  --ratio-paysage: 3 / 2;
  --ratio-chapitre: 4 / 3;
  --ratio-portrait: 4 / 5;
  --ratio-salle: 5 / 4;
  --reserve-parallaxe: 10%;

  /* Mouvement de la passe luxe : apparitions, titres, filets, parallaxe (05-SPEC-systeme sections 3 et 4) */
  --m-apparition-d: 1100ms;
  --m-apparition-y: 32px;
  --m-titre-d: 1000ms;
  --m-titre-decalage: 110ms;
  --m-titre-y: 110%;
  --m-filet-d: 1400ms;
  --m-lot: 120ms;
  --m-parallaxe: 6;
  --m-parallaxe-lissage: 0.6;
  --m-declenche: 88%;
  --m-page-sortie: var(--d-sortie);
  --m-page-entree: var(--d-moyen);
}

@media (max-width: 759px) {
  :root {
    --entete-h: 64px;
    --gouttiere: 16px;
    --ratio-large: 4 / 3;
    --ratio-chapitre: 4 / 5;
    --m-apparition-y: 20px;
  }
}

/* Hébreu : polices, corps majoré, aucun espacement de lettres (DESIGN.md section 3) */
html[lang="he"] {
  --police-titre: var(--police-titre-he);
  --police-texte: var(--police-texte-he);
  --t-corps: 1.0625rem;
  --lh-corps: 1.7;
  --ls-h1: 0;
  --ls-micro: 0;
  --ls-affiche: 0;
  --ls-titre: 0;
  --ls-surtitre: 0;
  --lh-affiche: 1.12;
  --lh-titre: 1.16;
  --echelle-titre: 1.08;
}