/* Shared sprite geometry and the light icon surfaces. */
.zicon {
  display: inline-block;
  width: 24px;
  height: 24px;
  flex: none;
  stroke: currentColor;
  vertical-align: middle;
}

.service-icon,
.service-icon:is(.blue, .green, .purple, .gold, .red),
.feature-list-icon,
.industry-icon,
.award-icon,
.cta-card-icon,
.contact-info-icon,
.value-icon,
.scroll-top-btn,
.scroll-top-btn:hover,
.whatsapp-btn,
.whatsapp-btn:hover {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  flex: none;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: var(--mist-0);
  color: var(--ink);
  box-shadow: none;
  transform: none;
  transition: none;
}

.award-icon { margin-inline: auto; }
.value-icon { margin-bottom: 1rem; }
.footer-social { width: 48px; height: 48px; }

/* Compact inline glyphs keep badges, tool names and region links on one line. */
:is(.badge, .cs-industry, .tool-chip, .footer-col a) .zicon {
  margin-inline-end: .4rem;
}

.tool-chip > span { display: inline-flex; }
.tool-chip > span .zicon { margin-inline-end: 0; }

:is(.service-card, .feature-list-item, .industry-card, .award-card,
    .cta-sidebar-card, .cta-inline-card, .contact-info-item, .value-card,
    .tool-chip, .cs-card):is(:hover, :focus-within) .zicon,
.whatsapp-btn:is(:hover, :focus-visible) .zicon,
.scroll-top-btn:is(:hover, :focus-visible) .zicon,
.footer-social:is(:hover, :focus-visible) .zicon,
.footer-col a:is(:hover, :focus-visible) .zicon {
  color: var(--amber-ink);
}

.whatsapp-btn:focus-visible,
.scroll-top-btn:focus-visible {
  outline: 2px solid var(--amber);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: no-preference) {
  .zicon { transition: color var(--dur) var(--ease); }
}

@media (prefers-reduced-motion: reduce) {
  .zicon { transition: none; }
}