:root {
  color-scheme: light;
  --ink: #202124;
  --mute: #4f5864;
  --blue: #0b57d0;
  --blue2: #d3e3fd;
  --yellow: #0b57d0;
  --red: #a43832;
  --white: #fff;
  --steel: #eef3fa;
  --bg: #f7f9fc;
  --line: #dce3ed;
  --accent: #0b57d0;
}
body { background: #fff; color: var(--ink); }
.sc-header, .sc-footer { background: #fff; color: var(--ink); border-color: var(--line); }
.sc-header { box-shadow: 0 1px 4px #20212410; }
.sc-logo { background: #fff; padding-inline: 4px; }
.sc-header .sc-enquire { background: var(--blue); color: white; }
.sc-menu-panel { background: #fff; border-color: var(--line); box-shadow: 0 16px 36px #25344a24; }
.sc-menu-group { background: var(--bg); border-color: var(--line); }
.sc-menu-group strong, .sc-menu summary span, .sc-menu-panel .sc-all,
.sc-footer strong, .sc-nav a:hover, .sc-menu summary:hover, .sc-footer a:hover { color: var(--blue); }
.sc-footer { background: var(--bg); border-top: 1px solid var(--line); }
.sc-footer p { color: var(--mute); }
.sc-legal { border-color: var(--line); }

#main .hero {
  background: radial-gradient(ellipse at 84% 42%, #dfeaff, transparent 53%), linear-gradient(145deg, #fff 18%, #f2f7ff);
  color: var(--ink);
}
#main .hero .lead, #main .hero figcaption { color: var(--mute); }
#main .hero .line.r, #main .hero .eyebrow { color: var(--blue); }
#main .hero .btn, #main .hero .btn.alt, .whatsapp,
#main .button:not(.whatsapp) { background: var(--blue); border: 1px solid var(--blue); color: #fff; }
#main .hero .pause { background: #fff; border-color: #b4c3d7; color: #35465e; }
.cluster { filter: drop-shadow(0 14px 24px #23487524); }
.scene .photo { box-shadow: 0 15px 36px #24487826; }
.crumb { background: #f7faff; color: var(--mute); }
.service-jump { background: #edf4ff; color: #164688; border-block: 1px solid #dae7fa; }
.service-jump a { background: #fff; border-color: #c4d6f1; }
.service-jump a:hover { background: #deebff; }

#main .services, #main .seo, #main .play, #main .industries {
  background: var(--bg);
  color: var(--ink);
}
#main .play .lead, #main .note { color: var(--mute); }
#main .bigmq { background: #eaf2ff; color: #164688; border-color: #dce7fb; }
#main .bigmq .row { -webkit-text-stroke-color: #3566ac; }
.home-service-grid article, .service-card, .directory a {
  background: #f7faff;
  border: 1px solid var(--line);
  border-radius: 16px;
}
.service-close, #main > .cta { background: #eaf2ff; color: var(--ink); }
.sc-header :focus-visible, .sc-footer :focus-visible, #main :focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 3px;
}