/* ==========================================================================
   PARTENAIRES (02/11/2026) : feuille SÉPARÉE de site.css, chargée seulement par
   page-partenaires.php (functions.php), comme presse.css et bon-cadeau.css.
   Composants du site réutilisés : .section, .conteneur, .titre-page,
   .reponse-directe, .entete-section__*, .contenu, .bouton, .champ, .alerte,
   .faq__*. Ici, seulement ce que la page ajoute : l'en-tête avec le flyer, le
   sommaire par structure, les lignes du kit et des structures, les trois
   colonnes de limites, le formulaire.
   ========================================================================== */

:root {
  --partenaires-flyer: 340px;          /* le flyer, à côté du titre */
  --partenaires-flyer-mobile: 260px;
  --partenaires-coin: 4px;             /* un coin de feuille de papier */
  --partenaires-inclinaison: 1.5deg;
  --partenaires-terme: 280px;          /* colonne des intitulés de ligne */
  --partenaires-ancre: 96px;           /* place de l'en-tête collant, au-dessus d'une ancre */
  --partenaires-cible: 44px;           /* cible tactile du sommaire */
  --partenaires-retrait: 22px;
  --partenaires-puce: 7px;
  --partenaires-puce-haut: 0.62em;
  --partenaires-tiret: 10px;
  --partenaires-filet: 2px;
  --partenaires-fleche: 44px;          /* place de la flèche du menu déroulant */
}

/* --- L'en-tête : le titre, et le flyer, posé là comme une feuille -------------- */

.partenaires-tete {
  display: grid;
  gap: var(--gap-m);
  margin-top: var(--gap-s);
}

.partenaires-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-s);
  margin-top: var(--gap-m);
}

.partenaires-format {
  font-weight: 400;
}

.partenaires-flyer {
  justify-self: center;
  width: 100%;
  max-width: var(--partenaires-flyer-mobile);
}

.partenaires-flyer img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--partenaires-coin);
  box-shadow: var(--ombre-carte), 0 0 0 1px var(--voile-nuit-06);
  transform: rotate(var(--partenaires-inclinaison));
}

@media (min-width: 960px) {
  .partenaires-tete {
    grid-template-columns: minmax(0, 1fr) var(--partenaires-flyer);
    align-items: center;
    gap: var(--gap-l);
  }

  .partenaires-flyer {
    max-width: none;
  }
}

/* --- Le sommaire par structure ------------------------------------------------ */

.partenaires-index {
  margin-top: var(--gap-l);
  padding-top: var(--gap-m);
  border-top: 1px solid var(--voile-nuit-09);
}

.partenaires-index__titre {
  font-size: var(--taille-corps-m);
  font-weight: 500;
  color: var(--nuit);
}

.partenaires-index ul {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-xs);
  margin-top: var(--gap-s);
  list-style: none;
}

.partenaires-index a {
  display: inline-flex;
  align-items: center;
  min-height: var(--partenaires-cible);
  padding: var(--gap-xs) var(--gap-s);
  background: var(--blanc);
  border: 1px solid var(--voile-nuit-18);
  border-radius: var(--rayon-pilule);
  font-size: var(--taille-corps);
  line-height: 1.3;
  color: var(--nuit);
  text-decoration: none;
}

.partenaires-index a:hover {
  border-color: var(--nuit);
}

/* --- Les lignes : le kit, puis les structures ---------------------------------- */

.partenaires-lignes {
  margin-top: var(--gap-m);
}

.partenaires-ligne {
  display: grid;
  gap: var(--gap-s);
  padding: var(--gap-m) 0;
  border-top: 1px solid var(--voile-nuit-09);
  scroll-margin-top: var(--partenaires-ancre);
}

.partenaires-ligne__titre {
  font-family: var(--police-display);
  font-size: var(--taille-h3);
  font-weight: 500;
  line-height: 1.25;
  text-wrap: balance;
  color: var(--nuit);
}

.partenaires-ligne__corps {
  min-width: 0;
  max-width: var(--largeur-lecture);
  font-size: var(--taille-corps-m);
  line-height: 1.6;
  color: var(--texte-doux);
}

.partenaires-ligne__corps > p + *,
.partenaires-ligne__corps > ul + * {
  margin-top: var(--gap-s);
}

.partenaires-ligne__corps dt {
  font-weight: 600;
  color: var(--nuit);
}

.partenaires-ligne__corps dd + dt {
  margin-top: var(--gap-s);
}

.partenaires-ligne__corps dd a {
  white-space: nowrap;
}

.partenaires-fichiers {
  display: grid;
  gap: var(--gap-xs);
  margin-top: var(--gap-s);
  list-style: none;
}

.partenaires-a-copier {
  -webkit-user-select: all;
  user-select: all;
}

@media (min-width: 860px) {
  .partenaires-ligne {
    grid-template-columns: var(--partenaires-terme) minmax(0, 1fr);
    gap: var(--gap-l);
  }
}

/* --- Avant de recommander : trois colonnes ------------------------------------- */

.partenaires-colonnes {
  display: grid;
  gap: var(--gap-m);
  margin-top: var(--gap-m);
}

.partenaires-colonne {
  padding: var(--gap-m);
  background: var(--blanc);
  border: 1px solid var(--voile-nuit-06);
  border-radius: var(--rayon);
}

.partenaires-colonne__titre {
  margin-bottom: var(--gap-s);
  font-family: var(--police-display);
  font-size: var(--taille-h5);
  font-weight: 500;
  line-height: 1.3;
  color: var(--nuit);
}

.partenaires-liste {
  display: grid;
  gap: var(--gap-s);
  list-style: none;
}

.partenaires-liste li {
  position: relative;
  padding-left: var(--partenaires-retrait);
  line-height: 1.5;
  color: var(--texte-doux);
}

/* La puce : un point de l'accent, décoratif (règle du ton porteur). */
.partenaires-liste li::before {
  content: '';
  position: absolute;
  top: var(--partenaires-puce-haut);
  left: 0;
  width: var(--partenaires-puce);
  height: var(--partenaires-puce);
  background: var(--sauge);
  border-radius: 50%;
}

/* Les limites : un tiret, pas une puce d'avantage. */
.partenaires-liste--limites li::before {
  top: 0.75em;
  width: var(--partenaires-tiret);
  height: var(--partenaires-filet);
  background: var(--corail);
  border-radius: 0;
}

@media (min-width: 960px) {
  .partenaires-colonnes {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--gap-s);
  }
}

/* --- Le formulaire ------------------------------------------------------------- */

.partenaires-formulaire {
  margin-top: var(--gap-m);
  padding: var(--gap-m);
  background: var(--blanc);
  border: 1px solid var(--voile-nuit-06);
  border-radius: var(--rayon);
}

.partenaires-formulaire .champ select {
  width: 100%;
  margin-top: 6px;
  padding: 12px var(--partenaires-fleche) 12px var(--gap-s);
  background: var(--blanc);
  border: 1px solid var(--voile-nuit-18);
  border-radius: var(--rayon-s);
  font-family: var(--police-corps);
  font-size: var(--taille-corps);
  color: var(--texte);
}

.partenaires-rgpd {
  margin-top: var(--gap-m);
  font-size: var(--taille-petit);
  line-height: 1.55;
  color: var(--texte-clair);
}

.partenaires-envoi {
  margin-top: var(--gap-m);
}

@media (max-width: 560px) {
  .partenaires-formulaire,
  .partenaires-colonne {
    padding: var(--gap-m) var(--gap-s);
  }
}