/* Shared engineering iconography. Decorative: never a replacement for a label. */
.service-pictogram {
  display: block;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  margin: 0 0 16px;
  color: var(--accent, #247961);
  overflow: visible;
  pointer-events: none;
}
.partner-audience .service-pictogram { width: 52px; height: 52px; margin-bottom: 12px; }
.contract-items .service-pictogram { color: inherit; }
.service-pictogram-motion { transform-box: view-box; transform-origin: 32px 32px; }
@media (prefers-reduced-motion: no-preference) {
  .service-pictogram.is-playing .service-pictogram-motion {
    animation: service-icon-signal 1.1s ease-out both;
  }
  .service-pictogram--fan.is-playing .service-pictogram-motion {
    animation-name: service-icon-fan;
  }
  .service-pictogram--analytics.is-playing .service-pictogram-motion,
  .service-pictogram--delivery.is-playing .service-pictogram-motion {
    animation-name: service-icon-scan;
  }
  .service-pictogram--journal.is-playing .service-pictogram-motion,
  .service-pictogram--shield.is-playing .service-pictogram-motion,
  .service-pictogram--testing.is-playing .service-pictogram-motion {
    stroke-dasharray: 100;
    animation-name: service-icon-check;
  }
}
@keyframes service-icon-signal { 0% { opacity: .35; transform: translateY(-2px); } 55% { opacity: 1; transform: translateY(2px); } 100% { opacity: 1; transform: none; } }
@keyframes service-icon-fan { from { transform: rotate(-110deg); opacity: .5; } to { transform: rotate(0); opacity: 1; } }
@keyframes service-icon-scan { 0% { transform: translateY(-5px); opacity: .4; } 60% { transform: translateY(3px); opacity: 1; } 100% { transform: none; } }
@keyframes service-icon-check { from { stroke-dashoffset: 100; opacity: .3; } to { stroke-dashoffset: 0; opacity: 1; } }
@media (max-width: 600px) {
  .service-pictogram { width: 40px; height: 40px; margin-bottom: 12px; }
  .partner-audience .service-pictogram { width: 44px; height: 44px; }
}
@media print { .service-pictogram { color: currentColor; } }