/* Thème de la niche FORMATION (organismes de formation Qualiopi qui forment des praticiens), créé le 22/10/2026.
   Même jeux de jetons que theme-energie.css, mêmes rôles. Teinte : prune encre (le sérieux de l'école, la toge)
   avec un signal ocre (la lampe qu'on se passe : la transmission). Cousine du violet de marketway.fr.
   Contrastes (WCAG AA, calculés le 22/10) : encre/papier 16,0 · ink-3/papier 6,7 · ink-3/papier-2 5,9 ·
   ink-3/mauve clair 6,3 · accent-text/papier 8,1 · texte du bouton clair 10,1 · texte nuit/nuit 16,4 ·
   night-text-2/nuit 11,8 · night-muted/nuit 7,2 (6,1 sur night-3) · accent-night/nuit 9,8 · texte du bouton sombre 10,3 ·
   encre sur les quatre étiquettes de spécialité 13,6 à 14,3 · perdu/fond perdu 5,6.
   --accent (#9a5bb8) reste décoratif : jamais pour du texte.
   En bas : trois petits composants propres à cette page (places de session, citations, carte d'exclusivité),
   à remonter dans common/base.css si une autre niche les reprend. */

:root{
  color-scheme:light;
  /* Fonds et encre clairs (ivoire chaud, encre prune, jamais de noir ni de gris purs) */
  --paper:#f6f2ee;
  --paper-2:#ece4de;
  --surface:#fcfaf8;
  --ink:#1d1520;
  --ink-rgb:29 21 32;
  --ink-2:#3b2f40;
  --ink-3:#5e5163;
  --line:#dcd1d8;
  --line-strong:#c2b3bf;

  /* Accent réservé aux actions */
  --accent:#9a5bb8;
  --accent-text:#6a2c8a;
  --on-accent:#140c18;
  --focus:#6a2c8a;

  /* Signal : le point du logo et des surtitres, ici la lampe */
  --signal:#e0a24e;
  --logo-mark:#1d1520;
  --niche-border:#cdb1d9;

  /* Bouton principal sur fond clair */
  --cta-bg:#5a2478;
  --cta-fg:#fbf6fd;
  --cta-fill:#1d1520;
  --cta-fg-hover:#fbf6fd;
  --cta-icon-bg:#ffffff26;

  /* Prune foncé : hero, bandes sombres, pied de page */
  --night:#1a1120;
  --night-rgb:26 17 32;
  --night-2:#221729;
  --night-3:#2c1f35;
  --night-line:#3e2f49;
  --night-text:#f6f0f8;
  --night-text-2:#d8cbe0;
  --night-muted:#ad9db8;
  --accent-night:#d5b0ec;
  --accent-night-rgb:213 176 236;
  --cta-night-bg:#d5b0ec;
  --cta-night-fg:#140c18;
  --cta-night-fill:#f6f0f8;
  --cta-night-fg-hover:#140c18;
  --cta-night-icon-bg:#140c181f;

  /* Illustrations */
  --phone-body:#0d0910;
  --phone-edge:#3e2f49;
  --motif-opacity:.9;
  --radius-zone:#d5b0ec;
  --dot-other:#6f5f7a;

  /* Fonds clairs teintés (agenda, après, démonstrations) et étiquettes de spécialité
     (tag-heat = naturopathie, tag-iso = hypnose et thérapies, tag-wood = massage et bien-être, tag-sun = esthétique) */
  --mint:#f1e9f4;
  --mint-2:#e7dcec;
  --mint-line:#d6c3df;
  --tag-sun:#f6e3c0;
  --tag-heat:#dcebd9;
  --tag-iso:#dae2f2;
  --tag-wood:#f3dcd8;
  --lost:#9a3b22;
  --lost-bg:#f5e4dd;
  --ok-bg:#5a2478;
  --ok-fg:#fbf6fd;
}

/* Motif du hero propre à la niche : un livre ouvert dont les pages s'éventent, en traits fins */
.hero::before{background-image:url(images/motif-formation.svg)}

/* ---------- Composant de la page : la session qui se remplit (démonstration) ---------- */
.seats{padding:1.1rem;display:grid;gap:.9rem}
.seats-h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.2rem .8rem}
.seats-h b{font-weight:660;font-size:1rem;line-height:1.3}
.seats-h span{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.seats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.45rem}
.seat{display:grid;place-items:center;gap:.15rem;min-height:58px;border-radius:12px;border:1px dashed var(--line-strong);background:var(--paper);font-size:.72rem;color:var(--ink-3);line-height:1.2;transition:background .35s,border-color .35s,color .35s}
.seat svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.seat.is-on{background:var(--ok-bg);border:1px solid var(--ok-bg);color:var(--ok-fg)}
.seat.is-new{animation:ping 1.4s ease-out 1}
.seats-bar{height:8px;border-radius:99px;background:var(--paper-2);overflow:hidden}
.seats-bar i{display:block;height:100%;width:var(--w,50%);border-radius:inherit;background:var(--accent);transition:width .5s var(--ease-out)}
.seats-foot{display:flex;align-items:center;gap:.6rem;padding:.65rem .8rem;border-radius:12px;background:var(--mint);border:1px solid var(--mint-line);font-size:.875rem;line-height:1.35}
.seats-foot svg{flex:none;width:18px;height:18px;fill:none;stroke:var(--accent-text);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.seats-foot b{font-weight:640}

/* ---------- Composant de la page : deux exemples réels et leurs citations (bande sombre) ---------- */
.cases2{display:grid;gap:clamp(1.6rem,1rem + 2vw,2.4rem)}
.case-block{display:grid;gap:.2rem}
.quotes{display:grid;gap:1rem}
.quote{margin:0;display:grid;gap:.9rem;align-content:start;padding:clamp(1.2rem,1rem + 1vw,1.6rem);border-radius:var(--radius-lg);background:var(--night-2);border:1px solid var(--night-line)}
.quote-label{justify-self:start;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--on-accent);background:var(--accent-night);border-radius:99px;padding:.22rem .6rem;line-height:1.35}
.quote blockquote{margin:0;font-size:var(--fs-lg);line-height:1.5;color:var(--night-text);font-weight:480}
.quote figcaption{font-size:.875rem;color:var(--night-muted);line-height:1.4}
.quote figcaption b{color:var(--night-text-2);font-weight:600}
@media (min-width:860px){.quotes{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}}

/* ---------- Composant de la page : la carte d'exclusivité par spécialité ---------- */
.zm-lab{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;fill:var(--night-text-2)}
.zm-lab-2{fill:var(--accent-night)}
.zm-far{fill:none;stroke:var(--night-line);stroke-width:1.2;stroke-dasharray:2 5}
.spe-chip{justify-self:start;display:inline-flex;align-items:center;gap:.5rem;font-size:.85rem;font-weight:600;padding:.35rem .75rem .35rem .45rem;border-radius:99px;background:var(--night-2);border:1px solid var(--night-line);color:var(--night-text)}
.spe-chip i{width:18px;height:18px;border-radius:50%;background:var(--accent-night)}

/* Deux séries de chiffres dans la preuve : un cran plus petites que le chiffre unique de l'énergie, pour tenir en trois colonnes */
.proof .cases2 .stat b{font-size:clamp(1.55rem,1.05rem + 2vw,2.9rem)}
