/* KICKOFF · écrans d'entrée : la scène TRIBUNE (bienvenue + connexion).
   Le canvas de scène vit derrière le contenu, pointer-events none :
   l'interaction pointeur s'écoute sur le conteneur de l'écran. */

/* ---------- canvas de scène : déborde le padding de #screen (18px 16px 48px)
   pour couvrir l'écran bord à bord ---------- */
.tribune-cv {
  position: absolute;
  top: -18px;
  left: -16px;
  width: calc(100% + 32px);
  height: calc(100% + 66px);
  z-index: 0;
  pointer-events: none;
}

/* ================================================================
   BIENVENUE · projecteurs, formation du 12, entrée orchestrée
   ================================================================ */
.welcome.wt { padding-top: 8.5vh; }

/* voile de lisibilité : assombrit le haut (wordmark) et le bas (pitch + CTAs)
   sans éteindre le coeur de la scène */
.welcome .wt-scrim {
  position: absolute;
  top: -18px;
  left: -16px;
  width: calc(100% + 32px);
  height: calc(100% + 66px);
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(13, 13, 13, .46), transparent 22%),
    linear-gradient(0deg, rgba(13, 13, 13, .66), rgba(13, 13, 13, .28) 22%, transparent 40%);
}

/* wordmark : chaque lettre s'allume pendant que les projecteurs balaient,
   le slash claque en dernier (keyframes igniteUp / slashHit de motion.css) */
.wt-wm .wl {
  display: inline-block;
  animation: igniteUp .55s cubic-bezier(.16, 1, .3, 1) both;
  animation-delay: calc(.40s + var(--i, 0) * .06s);
}
.wt-wm .wl-slash {
  display: inline-block;
  animation: slashHit .5s cubic-bezier(.34, 1.56, .64, 1) both;
  animation-delay: .92s;
}

/* mise en scène : le hero en haut, le 12 seul au centre,
   le pitch et les CTAs regroupés en bas */
.welcome.wt .w-points {
  margin-top: auto;
  margin-bottom: 2px;
}
.welcome.wt .w-ctas {
  margin-top: 0;
  padding-top: 22px;
}

/* pitch et CTAs : posés sur la scène, toujours lisibles */
.welcome .w-points li {
  text-shadow: 0 1px 10px rgba(13, 13, 13, .85), 0 0 22px rgba(13, 13, 13, .6);
}
.welcome .w-tag {
  text-shadow: 0 1px 8px rgba(13, 13, 13, .9);
  color: rgba(244, 244, 246, .72);
}

/* ================================================================
   AUTH · même univers, apaisé : le décor couvre tout l'écran
   ================================================================ */
.auth .auth-fx.wt-fx {
  inset: -18px -16px -48px -16px;
  height: auto;
}
.auth .auth-fx.wt-fx .tribune-cv {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ---------- accessibilité : tout est figé, rien ne bouge ---------- */
@media (prefers-reduced-motion: reduce) {
  .wt-wm .wl,
  .wt-wm .wl-slash {
    animation: none;
    opacity: 1;
    transform: none;
  }
}