/* =====================================================================
   DIGITAL FLOW — homepage header and footer links to the service pages.
   Loaded after flow-ambient.css. The header links sit in .nav__center,
   which flow-ambient.css already hides below 820px; the footer links
   carry the same destinations at every width.
   ===================================================================== */

.nav__links { display: flex; align-items: center; gap: 2px; }

.nav__links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 12px;
  font-family: var(--df-font-mono, monospace);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--df-text-muted, rgba(244, 240, 231, 0.76));
  border-radius: 6px;
}

.nav__links a:hover { color: var(--df-text-headline, #F2EEE6); background: rgba(244, 240, 231, 0.06); }

.nav__links a:focus-visible,
.foot__link:focus-visible {
  outline: 2px solid var(--df-signal-green, #B6FF2E);
  outline-offset: 3px;
}

.foot__actions { flex-wrap: wrap; row-gap: 4px; }

/* The native mobile menu keeps every destination available at narrow widths. */
.nav__links a { white-space: nowrap; }
.nav a.nav-case { color: var(--df-signal-green); gap: 7px; }
.nav a.nav-case::before { content: ""; width: 5px; height: 5px; flex: 0 0 5px; border-radius: 50%; background: currentColor; }
.nav__menu { display: none; flex-basis: 100%; border-top: 1px solid var(--df-border); }
.nav__menu summary { cursor: pointer; padding: 12px 0; font: 600 12px var(--df-font-mono); text-transform: uppercase; }
.nav__menu nav { display: grid; padding-bottom: 12px; }
.nav__menu nav a { display: flex; align-items: center; min-height: 44px; border-top: 1px solid var(--df-border); text-decoration: none; color: var(--df-text-primary); }
.nav__menu a:focus-visible { outline: 2px solid var(--df-signal-green); outline-offset: 2px; }
@media (max-width: 1180px) { .nav { height: auto; min-height: 64px; flex-wrap: wrap; row-gap: 0; } .nav > .brand, .nav__actions { min-height: 64px; } .nav__center { display: none; } .nav__menu { display: block; } }
