/* Header and footer drawn by shell.js. */
.shell-header { display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 22px var(--gutter); position: relative; z-index: 5; }
.shell-logo img { height: 21px; width: auto; }
.shell-tag { font: 600 11px/1 var(--head); letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.shell-nav { display: flex; align-items: center; gap: 28px; }
.shell-nav a:not(.btn) { color: var(--ink); text-decoration: none; font: 500 14.5px/1 var(--head);
  position: relative; padding: 6px 0; }
.shell-nav a:not(.btn)::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 1px;
  background: var(--teal); transition: right .25s var(--ease); }
.shell-nav a:not(.btn):hover::after { right: 0; }
.shell-nav .btn { padding: 11px 16px; font-size: 14px; }

.shell-footer { border-top: 1px solid var(--line); padding: 22px var(--gutter); font-size: 13px; color: var(--muted); }
.shell-footer-inner { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; max-width: 1200px; margin: 0 auto; }
.shell-footer nav { display: flex; gap: 18px; }
.shell-footer a { color: var(--muted); text-decoration: none; }
.shell-footer a:hover { color: var(--teal); }

@media (max-width: 760px) {
  .shell-nav a:not(.btn):not(.shell-keep) { display: none; }
  .shell-nav { gap: 16px; }
}