/* Social links — individual circular black PNG icons (retina 256→42/48) */

.contact-social{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  margin:10px 0 4px;
  padding:0 0 14px;
  border-bottom:1px solid var(--line, #e8e1d6);
}
.contact-social:empty{display:none}

.contact-social__link{
  --social-size:44px;
  width:var(--social-size);
  height:var(--social-size);
  border-radius:50%;
  border:none !important;
  background:transparent !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  flex-shrink:0;
  padding:0;
  overflow:visible;
  color:transparent;
  box-shadow:none;
  transition:transform .18s ease, opacity .18s ease, filter .18s ease;
  outline:none;
}
.contact-social__link:hover{
  opacity:.88;
  transform:translateY(-2px) scale(1.06);
  filter:drop-shadow(0 3px 6px rgba(23,22,20,.18));
}
.contact-social__link:focus-visible{
  outline:2px solid var(--ink, #171614);
  outline-offset:3px;
}

.contact-social__img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  border-radius:50%;
  pointer-events:none;
  /* kill any leftover brand-tinted filters */
  filter:none !important;
}

/* Hide any legacy SVG if present */
.contact-social__svg{display:none !important}

/* Dark panels (service contact card) — invert monochrome icons */
.contact-social--on-dark .contact-social__link{
  filter:invert(1);
}
.contact-social--on-dark .contact-social__link:hover{
  filter:invert(1) brightness(.95) drop-shadow(0 3px 8px rgba(0,0,0,.35));
}
.contact-social--on-dark .contact-social__link:focus-visible{
  outline-color:#f0ebe3;
}
.contact-social--on-dark{
  border-bottom-color:#403d38;
}

/* Footer (dark site chrome) */
footer .social{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  margin-top:18px;
}
footer .social .contact-social__link{
  --social-size:40px;
  filter:invert(1);
}
footer .social .contact-social__link:hover{
  filter:invert(1) brightness(.94) drop-shadow(0 3px 8px rgba(0,0,0,.4));
}
footer .social .contact-social__link:focus-visible{
  outline-color:#f0ebe3;
}

/* Align with Appeler / Itinéraire action row when present */
.salon-actions + .contact-social,
.contact-actions + .contact-social,
.cta-row + .contact-social{
  margin-top:12px;
}