/* ==========================================================================
   Block: Anchor tab nav
   --------------------------------------------------------------------------
   A full-width row, each tab taking an equal share (flex: 1) with a thin
   rule between adjacent tabs — not the underline-per-item treatment this
   had before. Active-state tracking (which tab is "current") is handled by
   initAnchorTabs() in assets/js/main.js, an IntersectionObserver-driven
   progressive enhancement; the href/scroll itself needs no JS at all — see
   scroll-behavior/scroll-padding-top on html in base.css, and
   prefers-reduced-motion turning that off again in tokens.css.
   ========================================================================== */

.awx-at__list {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: var(--awx-rule) solid var(--surface-rule);
  border-bottom: var(--awx-rule) solid var(--surface-rule);
}

.awx-at__item {
  flex: 1 1 0;
  min-width: 10rem;
  border-left: var(--awx-rule) solid var(--surface-rule);
}

.awx-at__item:last-child {
  border-right: var(--awx-rule) solid var(--surface-rule);
}

.awx-at__link {
  display: block;
  padding: var(--awx-space-sm) var(--awx-space-md);
  color: var(--surface-muted);
  font-family: var(--awx-font-display);
  font-size: var(--awx-step-0);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  transition: color var(--awx-transition), background-color var(--awx-transition);
}

.awx-at__link:hover {
  color: var(--surface-heading);
}

.awx-at__link[aria-current="true"] {
  color: var(--surface-heading);
  background: var(--surface-rule);
}