:root {
  --paper: #f5f8f9;
  --ink: #10191d;
  --green: #10262e;
  --line: #d7e1e4;
  --muted: #58666c;
  --aqua: #36a9b8;
}

body { background: var(--paper); }

.button {
  background: var(--green);
  border: 1px solid var(--green);
  box-shadow: 0 8px 18px rgba(16, 38, 46, .12);
}

.dark { background: #0f2026; }

.architecture-slider,
.contact { background: #e9f1f3; }

.architecture-bar { color: var(--ink); }

.hero-portrait,
.service-image,
.bim-image,
.welcome-image {
  box-shadow: 0 18px 45px rgba(16, 38, 46, .10);
}

.hero-portrait video,
.service-image img,
.bim-image img,
.welcome-image img,
.architecture-slide img {
  filter: saturate(1.08) contrast(1.03);
}

@media (hover: hover) {
  .button:hover,
  .map-load:hover {
    background: #087d8c;
    border-color: #087d8c;
    box-shadow: 0 12px 26px rgba(8, 125, 140, .20);
  }

  nav a:not(.nav-cta):hover,
  .nav-cta:hover,
  summary:hover { color: #087d8c; }
}