/* Le compte à rebours des Worlds, dans la DA des cartes de match de Trayton
   (projet trayton-assets) : panneau de pierre, cadre et bandeau bleu Worlds,
   Campora Black et Eurostile Extended en gris clair.

   Le fond vient de worlds-bg.png de trayton-assets (Worlds 2025) : « VS »
   effacé, « 5 » du logo redessiné en « 6 » avec Humane Bold (la police du
   logo d'origine), panneau et bandeau raccourcis. Positions mesurées sur ce
   PNG (1920 x 534) : panneau sombre y 83-330, bandeau bleu y 330-410. */

@font-face {
  font-family: 'EurostileExt';
  src: url('fonts/EurostileExtended-Black.woff2') format('woff2');
  font-display: block;
}
@font-face {
  font-family: 'CamporaBlack';
  src: url('fonts/Campora-Black.woff2') format('woff2');
  font-display: block;
}

body {
  margin: 0;
  overflow: hidden;
  color: #d5d5d5;
  font-family: 'EurostileExt', Arial, sans-serif;
}

.worlds {
  position: relative;
  width: 1920px;
  height: 534px;
  background: url('img/worlds-bg.png') center / cover no-repeat;
}

/* ---- Panneau sombre : le chrono, à la place du « VS » ------------------- */

.worlds__clock {
  position: absolute;
  top: 83px;
  height: 247px;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 70px;
  color: #fff;
}

.worlds__part { display: flex; align-items: baseline; gap: 14px; }

.worlds__num {
  font-family: 'CamporaBlack', 'EurostileExt', Arial, sans-serif;
  font-size: 170px;
  line-height: 1;
  letter-spacing: 8px;
  font-variant-numeric: tabular-nums;
}

.worlds__unit { font-size: 60px; color: #d5d5d5; }

.worlds__live {
  display: none;
  font-family: 'CamporaBlack', 'EurostileExt', Arial, sans-serif;
  font-size: 150px;
  letter-spacing: 12px;
}

.worlds[data-phase='live'] .worlds__part { display: none; }
.worlds[data-phase='live'] .worlds__live { display: block; }

/* ---- Bandeau bleu : la date, à l'heure de Paris -------------------------- */

.worlds__date {
  position: absolute;
  top: 330px;
  height: 80px;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 40px;
  letter-spacing: 6px;
  color: #fff;
}
