/* On-page tab bar for module sub-pages. */
.subnav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-1);
  margin-bottom: var(--sp-6);
  border-bottom: 1px solid var(--c-border);
}
.subnav__tab {
  padding: var(--sp-3);
  margin-bottom: -1px; /* sit the active underline on the container border */
  color: var(--c-ink-soft);
  font-weight: var(--fw-medium);
  border-bottom: 2px solid transparent;
  border-radius: var(--r-sm) var(--r-sm) 0 0;
  transition: color var(--dur) var(--ease), background var(--dur) var(--ease);
}
.subnav__tab:hover { color: var(--c-ink); background: var(--c-surface-2); text-decoration: none; }
.subnav__tab[aria-current="page"] {
  color: var(--c-accent-ink);
  border-bottom-color: var(--c-accent-ink);
  font-weight: var(--fw-semibold);
}

.subnav { align-items: stretch; }
.subnav__sep { align-self: center; width: 1px; height: var(--sp-5); margin: 0 var(--sp-2); background: var(--c-border-strong); }