/* ==========================================================================
   Intro Counter — 15 000 entreprises accompagnées
   Fond : mur de noms ultra-dense, texte continu
   Premier plan : compteur GSAP
   ========================================================================== */

.intro-counter {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #fff;
  z-index: 150;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.intro-counter::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: #009892;
  z-index: 10;
}

/* ──────────────────────────────────────────────
   Mur de noms — bandes verticales de texte continu
   ────────────────────────────────────────────── */

.intro-counter__wall {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  overflow: hidden;
}

.intro-counter__col {
  flex: 1 0 0%;
  min-width: 0;
  position: relative;
  overflow: hidden;
}

.intro-counter__col-inner {
  will-change: transform;
  font-family: var(--font-corps, 'DM Sans', sans-serif);
  font-size: 9px;
  line-height: 1.3;
  color: rgba(0, 0, 0, 0.18);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  word-break: break-all;
  overflow-wrap: break-word;
  padding: 0 3px;
}

.intro-counter__col-inner strong {
  font-weight: 700;
  color: inherit;
}

/* Variation par colonne — nuances de gris */
.intro-counter__col:nth-child(odd) .intro-counter__col-inner {
  color: rgba(0, 0, 0, 0.12);
  font-size: 8px;
}

.intro-counter__col:nth-child(3n) .intro-counter__col-inner {
  color: rgba(0, 0, 0, 0.22);
  font-size: 10px;
}

.intro-counter__col:nth-child(5n) .intro-counter__col-inner {
  color: rgba(0, 0, 0, 0.08);
  font-size: 8px;
  letter-spacing: 0.05em;
}

/* ──────────────────────────────────────────────
   Premier plan : compteur
   ────────────────────────────────────────────── */

.intro-counter__front {
  position: relative;
  z-index: 10;
  text-align: center;
  pointer-events: none;
  opacity: 0;
}

.intro-counter__number-wrap {
  display: flex;
  align-items: baseline;
  justify-content: center;
}

.intro-counter__number {
  font-family: var(--font-titre, 'DM Serif Display', serif);
  font-size: clamp(5rem, 15vw, 14rem);
  color: #222;
  line-height: 1;
  letter-spacing: -0.02em;
  text-shadow:
    0 4px 60px rgba(255, 255, 255, 0.95),
    0 0 120px rgba(255, 255, 255, 0.9),
    0 0 60px rgba(255, 255, 255, 0.8);
}

.intro-counter__label {
  font-family: var(--font-corps, 'DM Sans', sans-serif);
  font-size: clamp(1rem, 2vw, 1.6rem);
  color: rgba(0, 0, 0, 0.7);
  margin-top: 0.3em;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0;
  text-shadow:
    0 2px 40px rgba(255, 255, 255, 0.95),
    0 0 80px rgba(255, 255, 255, 0.8);
}

.intro-counter__logo {
  display: block;
  margin: 1.5em auto 0;
  width: clamp(120px, 15vw, 220px);
  opacity: 0;
  filter:
    drop-shadow(0 4px 40px rgba(255, 255, 255, 0.95))
    drop-shadow(0 0 80px rgba(255, 255, 255, 0.8));
}

.intro-counter__10ans {
  display: block;
  margin: 1em auto 0;
  width: clamp(60px, 7vw, 110px);
  opacity: 0;
}

/* ──────────────────────────────────────────────
   Transition sortie
   ────────────────────────────────────────────── */

.intro-counter--exiting {
  pointer-events: none;
}
