/* Social icons managed in Admin > Social links (backend/social-links.php). */
.reach-social {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 18px;
  row-gap: 14px;
  width: max-content;
  max-width: calc(100vw - 48px);
  pointer-events: auto;
}
.reach-social-slot {
  position: relative;
  flex: 0 0 auto;
}
.reach-social-link {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 50%;
  transition: transform .2s ease, filter .2s ease;
}
.reach-social-link:hover,
.reach-social-link:focus-visible {
  transform: translateY(-2px);
  filter: brightness(1.08);
}
.reach-social-icon,
.reach-social-photo {
  display: block;
  width: 100%;
  height: 100%;
}
.reach-social-photo {
  object-fit: cover;
  border-radius: 50%;
  background: #fcfff8;
}

/* Exported footers: spacing matches the original three icons at each page width. */
@media (min-width: 960px) and (max-width: 1199px) { .reach-social-footer { column-gap: 14px; } }
@media (min-width: 768px) and (max-width: 959px) { .reach-social-footer { column-gap: 12px; } }
@media (min-width: 480px) and (max-width: 767px) { .reach-social-footer { column-gap: 22px; } }
@media (max-width: 479px) { .reach-social-footer { column-gap: 15px; } }

/* Home page: the fixed green side tab holds a column of light icons and grows upward with them. */
.reach-social-light {
  flex-direction: column;
  flex-wrap: nowrap;
  row-gap: 15px;
  width: auto;
  margin-bottom: 20px;
}
@media (min-width: 960px) and (max-width: 1199px) { .reach-social-light { row-gap: 12px; margin-bottom: 16px; } }
@media (min-width: 768px) and (max-width: 959px) { .reach-social-light { row-gap: 9px; margin-bottom: 13px; } }
@media (min-width: 480px) and (max-width: 767px) { .reach-social-light { row-gap: 11px; margin-bottom: 15px; } }
@media (max-width: 479px) { .reach-social-light { row-gap: 7px; margin-bottom: 10px; } }

/* News, article and Gallery footer (css/news-modern.css sizes these badges). */
.footer-social a:nth-child(n) { margin-left: 0; }
.footer-social .reach-social-photo { border-radius: 50%; }
