/*
 * site.css
 * Additions on top of the shared johnjheisler.css (header nav, links).
 * johnjheisler.css is shared with the blog and is left untouched.
 */

/* ── Links ── */
a.logo-mark { text-decoration: none; }

a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

footer a {
  color: inherit;
  text-decoration: none;
  transition: color var(--transition);
}

footer a:hover { color: var(--accent); }

/* ── Header nav ── */
.site-nav {
  display: flex;
  gap: 20px;
  margin-left: auto;   /* pushes the nav next to the theme toggle */
  margin-right: 24px;
}

.site-nav a {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--text-secondary);
  text-decoration: none;
  transition: color var(--transition);
}

.site-nav a:hover,
.site-nav a[aria-current="page"] {
  color: var(--accent);
}

/* Narrow screens: nav drops to its own row under the logo and toggle */
@media (max-width: 720px) {
  header {
    flex-wrap: wrap;
    row-gap: 16px;
  }

  .site-nav {
    order: 3;
    width: 100%;
    margin: 0;
    flex-wrap: wrap;
    gap: 8px 18px;
  }
}