.competition {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  padding: 0 2rem 4rem;
  max-width: 1250px;
  margin: 0 auto;
}

.competition h2,
.competition .Date {
  grid-column: 1 / -1;   /* prend toute la largeur → force la nouvelle ligne */
  text-align: center;
  color: var(--or);
}

.competition h2 {
  font-size: 3em;
}

.comp {
  background: #1a1a1a;
  border-radius: 8px;
  padding: 1rem;
  box-sizing: border-box;
}

.comp h3 {
  color: var(--or);
  margin-top: 0;
}

.comp p {
  color: var(--or-fantome);
  margin-bottom: 1rem;
}

.comp iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  display: block;
  border-radius: 4px;
}

.separateur {
  grid-column: 1 / -1;
  display: block;
  margin: 0 auto -40px;
}

@media (max-width: 768px) {

  .competition h2 {
    font-size: 2.25em;
  }

  .hero-banner {
    padding-bottom: 0em;
  }

  .title-ghost {
    overflow-wrap: break-word;
    font-size: clamp(38px, 12vw, 15px);
    letter-spacing: 0.08em;
  }

  .title-main {
      font-size: 8vw;
      letter-spacing: 0.05em;
      margin-top: -20px;
  }

  .competition {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  }
}