/* Bespoke service symbols: consistent optical size, duotone surfaces and strokes. */
body.services-page .service-card .service-icon {
  width: 72px;
  height: 72px;
  margin-top: 28px;
  border: 1px solid color-mix(in srgb, var(--accent) 32%, #202630);
  border-radius: 20px;
  color: color-mix(in srgb, var(--accent) 76%, #fff);
  background: radial-gradient(circle at 15% 0%, color-mix(in srgb, var(--accent) 15%, transparent), transparent 75%), #10151d;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 8px 24px rgba(0,0,0,.12);
  transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}
body.services-page .service-card .service-icon svg {
  display: block;
  width: 44px;
  height: 44px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
body.services-page .service-card .service-icon .icon-surface {fill: currentColor;fill-opacity:.1;stroke:none}
body.services-page .service-card .service-icon .icon-detail {opacity:.5}
body.services-page .service-card .service-icon .icon-node {fill:currentColor;stroke:none}
body.services-page .service-card:hover .service-icon,
body.services-page .service-card:focus-visible .service-icon {
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--accent) 65%,#fff);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 10px 28px rgba(0,0,0,.16);
}
.service-message-check{display:inline-block;width:15px;height:15px;margin:0 2px;vertical-align:-2px;fill:none;stroke:#7bdfba;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media(prefers-reduced-motion:reduce){body.services-page .service-card .service-icon{transition:none}body.services-page .service-card:hover .service-icon,body.services-page .service-card:focus-visible .service-icon{transform:none}}
