/* TITRES */
.page-title {
  font-family: 'League Spartan', sans-serif;
  font-size: 3rem;
  text-align: center;
  margin-top: 40px;
}

/* MOBILE CARDS */
.calendar-mobile {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* cacher timeline sur mobile */
.timeline {
  display: none;
}

/* SÉPARATEUR */
.phase-separator {
  margin: 40px auto;
  width: 60%;
  height: 1px;
  background: rgba(255,255,255,0.2);
}

/* ANIMATION MOBILE */
.event-card {
  background: rgba(255,255,255,0.05);
  padding: 24px;
  border-radius: 20px;
  text-align: center;
  backdrop-filter: blur(8px);

  animation: fadeUp 0.6s ease forwards;
  opacity: 0;
}

.event-card:nth-child(2) { animation-delay: 0.1s; }
.event-card:nth-child(3) { animation-delay: 0.2s; }
.event-card:nth-child(6) { animation-delay: 0.3s; }

@keyframes fadeUp {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.event-match {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}

.team img {
  width: 70px;
}

.vs {
  font-weight: 900;
}

.finale.big {
  border: 2px solid #a97142;
}

/* ===== DESKTOP ===== */
@media (min-width: 900px) {

  .calendar-mobile {
    display: none;
  }

  .timeline {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    margin-top: 120px;
    position: relative;
    padding: 0 40px;
    min-height: 60vh; 
	gap : 40px;
  }

  /* ligne */
  .timeline::before {
    content: "";
    position: absolute;
    top: 160px;
    left: 50%;
  	transform: translateX(-50%);
  	width: 90%;
    height: 2px;
    background: rgba(255,255,255,0.2);
	animation: pulseLine 3s ease-in-out infinite;

  }

  .timeline-item {
    width: 25%;
    text-align: center;
    position: relative;
	min-width: 220px; 
  }

  /* CARD */
  .card {
    background: rgba(255,255,255,0.05);
    padding: 30px 40px;
    border-radius: 20px;
    backdrop-filter: blur(6px);
    margin-bottom: 40px;
    min-height: 100px;

    display: flex;
    justify-content: center;
    align-items: center;
  }

  /* MATCH */
  .match {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .match img {
    width: 80px;
  }

  /* POINT */
  .timeline-item::before {
    content: "";
    position: absolute;
    top: 156px;
    left: 50%;
    transform: translateX(-50%);
    width: 12px;
    height: 12px;
    background: #a97142;
    border-radius: 50%;
    animation: pulseDot 2s ease-in-out infinite;

  }

  /* DATE */
  .date {
    margin-top: 30px;
    font-size: 0.9rem;
    opacity: 0.7;
  }

  /* FINALES */
  .final-card {
    font-weight: 700;
    font-size: 1.1rem;
	min-height: 140px; 
 	 padding: 40px 50px;
  }

  .timeline-item.big .card {
  border: 2px solid #a97142;
    animation: glowFinal 2.5s ease-in-out infinite;

}

  .timeline-item.big::before {
    width: 16px;
    height: 16px;
    box-shadow: 0 0 10px #a97142;
  }
  .team-desktop {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.team-desktop span {
  font-size: 0.9rem;
  opacity: 0.8;
  color: #f5ead2;
}


  @keyframes pulseDot {
    0%, 100% {
      transform: translateX(-50%) scale(1);
    }
    50% {
      transform: translateX(-50%) scale(1.3);
    }
  }


  @keyframes pulseLine {
  0%, 100% {
    transform: translateX(-50%) scaleX(1);
  }
  50% {
    transform: translateX(-50%) scaleX(1.02);
  }
  @keyframes glowFinal {
    0%, 100% {
      box-shadow: 0 0 0 rgba(169,113,66,0);
    }
    50% {
      box-shadow: 0 0 20px rgba(169,113,66,0.4);
    }
  }

}
}