/* Dark symbols on brand colours at eighty percent background opacity, shared by service components. */
.mm-site :is(.mm-feature-icon,.mm-related-icon,.mm-sub-item-icon,.service-mark,.mm-about-service-icon,.mm-channel-icon,.mm-compact-option-icon) {
  color:#101820!important;
  opacity:1;
  background:rgba(33,212,236,.8);
  border-color:transparent;
  box-shadow:none;
}
.mm-site :is(.detail-item,.mm-related-card,.mm-sub-deliverable-grid article,.service-tile,.mm-about-service,.mm-contact-channels a):nth-child(even) :is(.mm-feature-icon,.mm-related-icon,.mm-sub-item-icon,.service-mark,.mm-about-service-icon,.mm-channel-icon),
.mm-site .mm-compact-options>a:nth-of-type(even) .mm-compact-option-icon {
  color:#101820!important;background:rgba(255,218,0,.8);
}
.mm-site :is(.mm-feature-icon,.mm-related-icon) {
  width:50.4px;height:50.4px;flex-shrink:0;border-radius:12px;
}
.mm-site .mm-feature-icon svg {width:31.2px;height:31.2px}
.mm-site .mm-related-icon svg {width:30px;height:30px}
.mm-site .mm-service-features .detail-item {grid-template-columns:50.4px minmax(0,1fr)}
.mm-site .mm-related-card {grid-template-columns:50.4px minmax(0,1fr) 22px}
.mm-site .service-mark {width:82.64px;height:82.64px;padding:7px;box-sizing:border-box}
.mm-site :is(.mm-related-card):is(:hover,:focus-visible) :is(.mm-related-icon),
.mm-site .mm-compact-options>a:is(:hover,:focus-visible,[aria-current]) .mm-compact-option-icon {
  color:#101820!important;background:rgba(255,218,0,.8);border-color:transparent;box-shadow:none;
}
@media(max-width:1000px) and (min-width:801px) {
  .mm-site .mm-related-card {grid-template-columns:50.4px minmax(0,1fr)}
}
@media(max-width:800px) {
  .mm-site .mm-related-grid {grid-template-columns:minmax(0,1fr)}
  /* Text uses the complete mobile column; the symbol introduces it above. */
  .mm-site .mm-service-features .detail-item,
  .mm-site .detail-item:has(>.mm-feature-icon) {grid-template-columns:minmax(0,1fr);gap:18px}
  .mm-site .mm-related-card {grid-template-columns:minmax(0,1fr) 22px;gap:18px;padding:24px}
  .mm-site .mm-related-card>.mm-related-icon {grid-column:1;grid-row:1}
  .mm-site .mm-related-card>span:nth-child(2) {grid-column:1/-1;grid-row:2;min-width:0}
  .mm-site .mm-related-card>.mm-related-arrow {display:block;grid-column:2;grid-row:1;align-self:center;justify-self:end}
  .mm-site .steps>li {grid-template-columns:minmax(0,1fr);gap:14px}
  .mm-site .steps>li>span {padding-top:0}
  .mm-site .steps>li>div {min-width:0}
}

/* Navigation icons stay compact and use a quiet tint on the dark menu. */
.mm-site .site-header .mm-mega-service .mm-mega-icon {
  color:#21d4ec!important;background:rgba(33,212,236,.07);border-color:rgba(33,212,236,.25);box-shadow:none;
}
.mm-site .mobile-menu nav .mm-mobile-link {font-size:clamp(22px,5.5vw,28px);min-height:64px;padding:14px 0;gap:14px}
.mm-site .mobile-menu .mm-mobile-link:nth-child(n) .mm-mobile-nav-icon {
  width:36px;height:36px;flex:0 0 36px;border-radius:7px;border:1px solid rgba(33,212,236,.22);
  color:#21d4ec!important;background:rgba(33,212,236,.07);box-shadow:none;opacity:1;
}
.mm-site .mobile-menu .mm-mobile-nav-icon svg {width:22px;height:22px}
.mm-site .mobile-menu .mm-mobile-link.mm-mobile-mix-cta:nth-child(n) .mm-mobile-nav-icon {
  color:#101820!important;background:transparent;border-color:rgba(16,24,32,.2);
}
.mm-site .mobile-menu .mm-mobile-services {padding:4px 0 16px 14px}
.mm-site .mobile-menu nav .mm-mobile-services a {
  display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;justify-content:start;
  gap:12px;min-height:48px;padding:10px 0;font-size:16px;line-height:1.4;text-align:left;
}
.mm-site .mobile-menu nav .mm-mobile-services a>span:first-child {
  width:24px;margin:0;color:#21d4ec!important;justify-self:start;
}
.mm-site .mobile-menu nav .mm-mobile-services a>span:nth-child(2) {
  grid-column:2;min-width:0;margin:0;justify-self:start;text-align:left;color:#d7e3e7!important;
}
.mm-site .mobile-menu .mm-mobile-services svg {width:24px;height:24px}
.mm-site .mobile-menu nav .mm-mobile-services a:is(:hover,:focus-visible)>span:nth-child(2) {color:#ffda00!important}

/* The service-card artwork stands on its own without an icon badge. */
.mm-site .service-tile .service-mark {display:none}