.service-body {
  --page-accent: #c8b59e;
  --page-accent-2: #9fc6d9;
  --page-pale: #263642;
  color: #fff;
  background: #111820;
}

.service-body--web {
  --page-accent: #b8c7d0;
  --page-accent-2: #758d9e;
  --page-pale: #283844;
}

.service-body--ai {
  --page-accent: #a8d0e4;
  --page-accent-2: #6e8fa4;
  --page-pale: #21323e;
}

.service-body--data {
  --page-accent: #dbc5a9;
  --page-accent-2: #9d8469;
  --page-pale: #39342f;
}

.service-body .site-header { color: #fff; }
.service-body .desktop-nav a { color: rgba(255,255,255,.68); }
.service-body .desktop-nav a:hover { color: var(--page-accent); }
.service-body .nav-cta { color: #111820; border-color: transparent; background: #f5f7f7; }
.service-body .nav-cta:hover { color: #fff; background: #4d6272; }
.service-body .site-header.is-scrolled { background: rgba(17,24,32,.88); }
.service-body .menu-toggle { color: #fff; border-color: rgba(255,255,255,.2); }

.service-hero {
  background:
    radial-gradient(circle at 82% 18%, color-mix(in srgb, var(--page-accent-2) 24%, transparent), transparent 28rem),
    radial-gradient(circle at 8% 72%, color-mix(in srgb, var(--page-accent) 14%, transparent), transparent 24rem),
    linear-gradient(145deg, #111820, var(--page-pale));
}
.service-hero:before {
  opacity: .32;
  background-image: linear-gradient(rgba(255,255,255,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.09) 1px, transparent 1px);
}
.service-breadcrumb { color: rgba(255,255,255,.54); }
.service-hero__lead { color: rgba(255,255,255,.68); }
.service-secondary { color: #fff; border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.06); }
.service-secondary:hover { background: rgba(255,255,255,.12); }
.service-primary { color: #111820; }
.service-console { border-color: rgba(255,255,255,.17); background: rgba(17,24,32,.56); box-shadow: 0 34px 100px rgba(0,0,0,.25); }
.service-console__head { border-color: rgba(255,255,255,.13); color: rgba(255,255,255,.5); }
.service-console__core { color: #111820; }
.service-console__signals div { border-color: rgba(255,255,255,.11); background: rgba(255,255,255,.055); }
.service-console__signals span { color: rgba(255,255,255,.63); }
.service-console__signals b { color: var(--page-accent); }
.service-pill-row span { color: rgba(255,255,255,.66); border-color: rgba(255,255,255,.13); background: rgba(255,255,255,.05); }

.service-offer { color: #fff; background: linear-gradient(180deg, #111820, #17232d); }
.service-section-head > p { color: rgba(255,255,255,.61); }
.service-offer-card { border-color: rgba(255,255,255,.11); background: linear-gradient(145deg, rgba(38,54,66,.9), rgba(25,35,44,.95)); box-shadow: 0 18px 50px rgba(0,0,0,.12); }
.service-offer-card p { color: rgba(255,255,255,.6); }

.service-process { background: linear-gradient(135deg, #263642, #4d6272 55%, #806f5e); }
.service-process h2 em { color: #e3d4c1; }

.service-related { color: #fff; }
.service-related__top p { color: rgba(255,255,255,.56); }
.service-related-card { border-color: rgba(255,255,255,.12); background: linear-gradient(145deg, #1d2731, var(--page-pale)); }
.service-related-card:hover { color: #111820; background: linear-gradient(145deg, var(--page-accent), var(--page-accent-2)); }

.service-cta__panel { background: radial-gradient(circle at 88% 15%, rgba(191,217,230,.3), transparent 18rem), linear-gradient(135deg, #263642, #6d5d50); }
.service-cta h2 em { color: #e3d4c1; }
.service-page-footer { background: linear-gradient(135deg, #111820, #263642); }

@media (max-width: 760px) {
  .service-body .mobile-nav { background: rgba(17,24,32,.98); }
}
