/* ─────────────────────────────────────────────
   15-rs.css — Bandeau réseaux sociaux

   Boutons neutres (fond blanc, ombre carte) pour rester
   dans la charte au repos ; couleur de marque au survol
   pour une identification instantanée du réseau.
───────────────────────────────────────────────── */

.section-rs {
  padding: var(--space-xl) 0;
  background: var(--bg);
}

.rs-inner {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-md);
}

.rs-overline {
  margin-bottom: 0;
  align-self: start;
}

.rs-buttons {
  display: flex;
  gap: var(--space-md);
}

.rs-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--bg);
  color: var(--accent-2);
  box-shadow: var(--shadow-card);
  transition: background var(--transition-base), color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);
}

.rs-button svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

.rs-button:hover,
.rs-button:focus-visible {
  box-shadow: var(--shadow-card-hover);
  transform: translateY(-2px);
  color: var(--white);
}

.rs-button--facebook:hover,
.rs-button--facebook:focus-visible {
  background: #1877F2;
}

.rs-button--instagram:hover,
.rs-button--instagram:focus-visible {
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}