/* =========================================================
   WURUS · POESAM 2026 — Logo, mouvements de base, mode lecture
   Les timelines complexes vivent en JS (GSAP). Ici : les états
   de départ, les boucles douces, et ce qui doit tenir sans JS.
   ========================================================= */

/* ---------------------------------------------------------
   Logo inline
   --------------------------------------------------------- */

.logo {
  width: 100%;
  height: auto;
  color: var(--gold);
  overflow: visible;
}

/* Le tracé lettre par lettre passe par ces propriétés — GSAP les pilote,
   le CSS garantit un état par défaut correct si le JS ne se charge pas. */
.logo__mark-path,
.logo__letter {
  fill: currentColor;
  fill-opacity: 1;
  stroke: currentColor;
  stroke-width: 0;
  vector-effect: non-scaling-stroke;
}

/* ---------------------------------------------------------
   Boucles douces
   --------------------------------------------------------- */

@keyframes wurus-breathe {
  0%, 100% { transform: scale(1);    opacity: 0.5; }
  50%      { transform: scale(1.06); opacity: 0.85; }
}

@keyframes wurus-cta-pulse {
  0%, 100% { box-shadow: var(--shadow-md), 0 0 0 0 var(--gold-a40); }
  60%      { box-shadow: var(--shadow-md), 0 0 0 14px rgba(184, 134, 43, 0); }
}

@keyframes wurus-dot {
  0%, 100% { opacity: 1;   transform: scale(1); }
  50%      { opacity: 0.35; transform: scale(0.72); }
}

.pulse-cta { animation: wurus-cta-pulse 3.2s var(--ease-in-out) infinite 1.4s; }

@media (prefers-reduced-motion: reduce) {
  .pulse-cta { animation: none; }
}

/* ---------------------------------------------------------
   Mode lecture automatique
   --------------------------------------------------------- */

.reading-bar {
  position: absolute;
  left: 50%;
  bottom: 26px;
  z-index: 44;
  transform: translate(-50%, 20px);
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 10px 9px 18px;
  border-radius: 999px;
  background: var(--chrome-bg);
  border: var(--hairline) solid var(--chrome-border);
  backdrop-filter: blur(8px);
  box-shadow: var(--shadow-sm);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity var(--dur-mid) var(--ease-out),
    transform var(--dur-mid) var(--ease-out),
    visibility var(--dur-mid);
}
.reading-bar.is-on {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

.reading-bar__dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--gold);
  animation: wurus-dot 1.8s var(--ease-in-out) infinite;
}
.reading-bar__label {
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--brown);
}
.reading-bar__stop {
  padding: 5px 13px;
  border-radius: 999px;
  background: var(--brown);
  color: var(--cream);
  font-size: 12px;
  font-weight: 600;
  transition: background-color var(--dur-fast) var(--ease-out);
}
.reading-bar__stop:hover { background: var(--brown-deep); }

/* ---------------------------------------------------------
   États du chrome
   --------------------------------------------------------- */

/* Sur l'écran d'accueil, le chrome de pitch s'efface. */
.deck.is-home .nav-arrow,
.deck.is-home .progress,
.deck.is-home .counter { opacity: 0 !important; pointer-events: none; }

/* Quand le mode présentateur est ouvert, on relève le chrome du bas
   pour qu'il ne passe pas sous le bandeau de notes. */
.deck.has-presenter .nav-arrow  { bottom: 214px; }
.deck.has-presenter .counter    { bottom: 210px; }
.deck.has-presenter .progress   { bottom: 190px; }
.deck.has-presenter .reading-bar { bottom: 216px; }

/* ---------------------------------------------------------
   Repli sans JS / sans GSAP : tout doit rester lisible
   --------------------------------------------------------- */

.no-gsap .slide,
.no-js .slide { opacity: 1; visibility: visible; }