/* ═══════════════════════════════════════════════════════════════
   Mouvement — « Le fil de la soirée »
   Trois effets seulement : le fil, la parallaxe, la révélation mot à mot.
   Reprend les jetons de style.css, n'en introduit aucun nouveau.
   Pour tout désactiver : retirer ce fichier et /js/anim.js des pages.
   ═══════════════════════════════════════════════════════════════ */

:root { --sortie: cubic-bezier(0.16, 1, 0.3, 1); }   /* ease-out-expo */

/* ── Le fil : un filet d'or qui se dévide le long de la page ── */
.fil {
  position: fixed;
  left: max(10px, calc(var(--pad) / 3));
  top: var(--nav-h); bottom: 0;
  width: 1px;
  background: var(--line);
  z-index: 80;
  pointer-events: none;
}
.fil-jauge { position: absolute; top: 0; left: 0; width: 100%; height: 0; background: var(--gold); }
.fil-chapitre {
  position: fixed;
  left: max(10px, calc(var(--pad) / 3));
  transform: translate(-50%, -50%);
  background: var(--paper);
  padding: 10px 0;
  font-weight: 700;
  font-size: .62rem;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ink-3);
  writing-mode: vertical-rl;
  z-index: 81;
  pointer-events: none;
  white-space: nowrap;
  transition: color .35s, background .35s, opacity .35s;
}
.fil-chapitre.sur-sombre { background: var(--ink); color: var(--gold); }
@media (max-width: 980px) { .fil, .fil-chapitre { display: none; } }

/* ── Parallaxe ──────────────────────────────────────────────── */
.pl { will-change: transform; }
/* Filigrane de marque : présent, jamais lisible avant le texte. */
.pl-fond {
  font-family: var(--serif);
  font-size: clamp(3.5rem, 17vw, 14rem);
  color: var(--paper-3);
  opacity: .55;
  line-height: .82;
  white-space: nowrap;
  user-select: none;
  text-align: center;
  font-style: italic;
}

/* ── Révélation mot à mot ───────────────────────────────────── */
.lecture .mot { display: inline-block; opacity: .15; transition: opacity .5s var(--sortie); }

/* ── Compteurs ──────────────────────────────────────────────── */
.compte { font-variant-numeric: tabular-nums; }

/* ── Mobile : on ne détourne jamais le pouce ────────────────── */
@media (prefers-reduced-motion: reduce) {
  .lecture .mot { opacity: 1 !important; }
  .pl { transform: none !important; }
}