/* Partners page */

.partners-hero,
.partners-section,
.partners-cta {
  max-width: var(--largeur-site, 1200px);
  margin: 0 auto 30px;
  padding: 0 20px;
}

.partners-hero {
  margin-top: 10px;
}

.hero-content,
.cta-box {
  padding: 46px 24px;
  /* Aplat opaque, arete vive, filet neutre : le degrade translucide, l'ombre
     diffuse et le cerne lime faisaient trois decorations pour un seul bloc. */
  border-radius: var(--radius-lg);
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  box-shadow: none;
  text-align: left;
}

.hero-title,
.section-title,
.cta-box h2 {
  margin: 0 0 10px;
  text-align: left;
}

.title-text {
  /* Le titre reste en couleur pleine de texte : le lime est porte par la barre
     de course sous le titre, pas par le titre lui-meme. */
  color: var(--text-primary);
}

.hero-subtitle,
.section-description,
.cta-box p {
  margin: 0;
  max-width: var(--container-text);
  color: var(--muted);
}

.section-description {
  text-align: left;
}

.partners-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 620px));
  justify-content: center;
  gap: 20px;
  margin-top: 22px;
}

.partners-grid.single-partner {
  grid-template-columns: minmax(0, 720px);
  justify-content: center;
}

.partner-card {
  display: flex;
  flex-direction: column;
  /* Le contenu part du bord gauche : centre, il decrochait la barre de course
     du debut du titre. */
  align-items: flex-start;
  justify-content: center;
  border-radius: var(--radius-sm);
  padding: 24px;
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  box-shadow: none;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
  text-align: left;
}

/* Le lime en bordure ne survit qu'au survol. */
.partner-card:hover {
  transform: translateY(-3px);
  border-color: var(--accent-line);
  box-shadow: none;
}

.partner-badge {
  display: inline-flex;
  padding: 6px 10px;
  border-radius: var(--radius-pill);
  background: var(--card-bg-hover);
  color: var(--accent-text);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.partner-card h3 {
  margin: 12px 0 6px;
  color: var(--text);
  text-align: left;
  width: 100%;
}

.partner-type {
  margin: 0 0 10px;
  color: var(--accent-text);
  font-weight: 700;
  text-align: left;
  width: 100%;
}

.partner-card p {
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.6;
  text-align: left;
}

/* Cible tactile : le lien mesurait la hauteur de son texte. */
.partner-card a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--tap-min);
  color: var(--text);
  opacity: 0.75;
  text-decoration: none;
  font-weight: 700;
}

.partner-handle {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap-min);
  padding: 8px 12px;
  border-radius: var(--radius-pill);
  /* Contour de controle neutre au repos, lime au survol et au focus. */
  border: 1px solid var(--border-control);
  background: var(--card-bg-hover);
  color: var(--text);
  font-weight: 700;
  transition: border-color .2s ease, color .2s ease;
}

.partner-card a:hover .partner-handle,
.partner-card a:focus-visible .partner-handle {
  border-color: var(--accent-line);
  color: var(--accent-text);
}

.partners-cta .cta-box {
  padding: 36px 24px;
}

/* Seule action de la page : bouton primaire, aplat lime sur encre. */
.cta-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
  min-height: 48px;
  padding: 12px 18px;
  border-radius: var(--radius-sm);
  text-decoration: none;
  font-weight: 700;
  font-size: var(--text-base);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: var(--accent);
  color: var(--accent-ink);
  border: 2px solid var(--accent-ink);
  transition: background .2s ease, transform .2s ease;
}

.cta-link:hover {
  background: var(--accent-hover);
  color: var(--accent-ink);
  transform: translateY(-2px);
}

@media (max-width: 900px) {
  .partners-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .partners-hero,
  .partners-section,
  .partners-cta {
    padding: 0 12px;
  }

  .hero-content,
  .partner-card,
  .cta-box {
    padding: 22px 16px;
  }

  .cta-link {
    width: 100%;
  }
}

/* ---- Bande tablette ----
   Ces grilles passaient a une colonne des 768px (900px pour certaines), soit
   en pleine tablette : les cartes prenaient toute la largeur et la page
   devenait une longue colonne. Deux colonnes sont retablies jusqu'a 600px,
   ou une colonne unique devient reellement justifiee.
   Regle ajoutee en fin de fichier : a specificite egale, elle l'emporte sur
   la media query d'origine par l'ordre de declaration. */
@media (min-width: 601px) and (max-width: 900px) {
  .partners-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}