/* The row of links between the Services hub and its four service pages.
   Light by default; add .svc-subnav--dark on a dark page. */
.svc-subnav {
  --sn-fg: #161513;
  --sn-muted: rgba(22, 21, 19, .58);
  --sn-line: rgba(22, 21, 19, .16);
  --sn-on: #d9333f;
  display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none;
  padding: 14px 3.2vw;
  font-family: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
  font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
}
.svc-subnav::-webkit-scrollbar { display: none; }
.svc-subnav a {
  flex: none; padding: 9px 14px; border: 1px solid var(--sn-line); border-radius: 999px;
  color: var(--sn-muted); text-decoration: none;
  transition: color .2s, border-color .2s, background-color .2s;
}
.svc-subnav a:hover { color: var(--sn-fg); border-color: var(--sn-fg); }
.svc-subnav a[aria-current="page"] { background: var(--sn-on); border-color: var(--sn-on); color: #fff; }
.svc-subnav--dark { --sn-fg: #f4f1ea; --sn-muted: rgba(244, 241, 234, .62); --sn-line: rgba(244, 241, 234, .18); }
