/*
 * Boutons de partage.
 *
 * Discrets sous le contenu : ils accompagnent la lecture, ils ne la
 * précèdent pas. Chaque réseau garde sa couleur au survol, ce qui le rend
 * reconnaissable sans avoir à lire l'infobulle.
 */

.pt-bloc {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  margin: 30px 0 10px;
  padding-top: 20px;
  border-top: 1px solid #e4e7ec;
}

.pt-titre {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #667085;
}

.pt-titre i { color: #c8a04a; }

.pt-boutons { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

.pt-bouton {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid #e4e7ec;
  background: #fff;
  color: #475467;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  cursor: pointer;
  text-decoration: none;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}

.pt-bouton:hover { transform: translateY(-2px); color: #fff; border-color: transparent; }

/* Couleurs officielles : le réseau se reconnaît sans lire l'infobulle. */
.pt-facebook:hover { background: #1877f2; }
.pt-x:hover        { background: #000; }
.pt-linkedin:hover { background: #0a66c2; }
.pt-whatsapp:hover { background: #25d366; }
.pt-email:hover    { background: #1f5793; }
.pt-lien:hover     { background: #c8a04a; color: #14243a; }

.pt-bouton:focus-visible { outline: 2px solid #1f5793; outline-offset: 2px; }

.pt-confirme {
  font-size: .8rem;
  font-weight: 600;
  color: #05603a;
  background: #e6f7ee;
  border-radius: 20px;
  padding: 4px 11px;
}

@media (prefers-reduced-motion: reduce) {
  .pt-bouton { transition: none; }
  .pt-bouton:hover { transform: none; }
}
