.sports {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
    gap: calc(4* var(--space));
    grid-auto-flow: dense;
    align-items: center;
}

.sport-show {
    display: grid;
    grid-template-columns: repeat(2, 1fr) minmax(245px, 1fr);
    gap: calc(0* var(--space));
    grid-auto-flow: dense;

}



.sport-hero {
    grid-column: 1 / -1;
    max-width: 550px;
}

.no-data-sport {
    grid-column: 1/ -1;
}

.sport-show-hero {
    grid-column: 1 / -1;
}

@media (min-width:840px) {
    .sport-hero {
        grid-column: 1/3;
    }

    .sport-show-hero {
        grid-column: 1 / 3;
        width: auto;
    }

    .no-data-sport {
        grid-column: 3/ span 2;
    }

}

iframe {
    width: 100%;
    aspect-ratio: 16/9;
}

.sport-hero h1 {
    font-size: 52px;
    font-weight: 700;
    line-height: 1.2;
}

.sport-hero strong {
    color: var(--red);
}

@media (min-width: 600px) {

    .sport-hero,
    .hero-text,
    .wave-header__body {
        font-size: 22px;
    }
}

.sport-hero>*+* {
    margin-top: calc(4* var(--space));
}

.container-intro {
    padding-top: var(--padding);
}

.sport-hero .format {
    display: flex;
    flex-direction: row;
}

.card-handball {
    font-family: Inter, sans-serif;
    font-size: 16px;
    background: var(--card-bg, var(--background-light));
    border: 1px solid var(--border);
    box-shadow: 0 2px 4px var(--shadow);
    border-radius: 3px;
    transition: .3s;
}

.card-handball__header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.card-handball__body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  gap: 12px;
  flex-wrap: nowrap; /* 🔒 Empêche le passage en colonne sur mobile */
}

.team-handball {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  flex: 1 1 120px;
  align-self: flex-start;
  min-width: 90px;
  max-width: 160px;
}

.team-handball-logo {
  width: 40px;
  height: 28px;
  object-fit: contain;
  margin-bottom: 6px;
  border-radius: 2px;
  border: 1px solid #ccc;
  background: #f0f0f0;
}

.team-handball-name {
  font-size: 14px;
  font-weight: 600;
  color: #222;
  word-break: break-word;
  line-height: 1.2;
}

.score-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 80px;
}

.score-handball {
  display: flex;
  flex-direction: row; /* 👈 FORCÉ pour rester en ligne */
  align-items: center;
  justify-content: center;
  font-size: 24px;
  font-weight: 700;
  gap: 6px;
}

.date-handball {
  text-align: center;
  font-size: 18px;
  font-weight: 500;
  gap: 6px;
}

.status {
  margin-top: 6px;
  font-size: 16px;
  font-weight: 500;
  color: #888;
  display: flex;
  align-items: center;
  gap: 6px;
}

.dot-handball {
  width: 8px;
  height: 8px;
  background-color: #f44336;
  border-radius: 50%;
}