/* Five shared links; the original stylesheet remains byte-for-byte intact. */
.primary-nav a { white-space: nowrap; }
.blog-page .primary-nav a.active::after { width: 100%; }
.site-header a:focus-visible, .site-header button:focus-visible { outline: 3px solid currentColor; outline-offset: 5px; }

@media (max-width: 600px) {
  .site-header .nav-wrap { height: 88px; padding-inline: 20px; }
  .site-header .brand { flex-basis: 86px; width: 86px; height: 68px; margin-top: 20px; }
  .menu-toggle { display: grid; align-content: start; gap: 5px; width: 40px; height: 40px; margin-top: 30px; padding: 8px; border: 0; color: inherit; background: transparent; cursor: pointer; }
  .menu-toggle span { width: 24px; height: 2px; background: currentColor; transition: transform 180ms ease, opacity 180ms ease; }
  .menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .primary-nav { position: fixed; inset: 0; z-index: -1; display: grid; align-content: center; justify-items: center; gap: 12px; visibility: hidden; opacity: 0; color: var(--white); background: rgba(26, 58, 143, .98); transition: opacity 180ms ease; overflow-y: auto; padding-block: 88px 24px; }
  .primary-nav.open { visibility: visible; opacity: 1; }
  .primary-nav a { padding: 12px; font-size: 24px; }
  .primary-nav a::after { display: none; }
  .blog-page .primary-nav a.active { text-decoration: underline; text-underline-offset: 8px; text-decoration-thickness: 2px; }
}
@media (max-width: 600px) and (max-height: 500px) {
  .primary-nav { align-content: start; gap: 0; }
  .primary-nav a { padding-block: 6px; font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .site-header *, .site-header *::after { transition: none !important; }
}
