/* Shared header and footer for the pages outside the home page.
   Same look as the home page's header and footer. Own tokens, so each
   page's older stylesheet cannot change them. Navy by default; light when
   the page sets data-theme="light" (sub-pages) or "vellum" (home). */
:root{
  --ax-bg:#0e2540; --ax-bg-2:#14304e; --ax-bg-3:#1b3c60;
  --ax-ink:#e6efff; --ax-ink-2:#9cb3d4;
  --ax-line:rgba(232,242,255,.16); --ax-line-2:rgba(232,242,255,.30);
  --ax-accent:#ffd166; --ax-accent-ink:#ffd166; --ax-on-accent:#0e2540;
  --ax-ff-d:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ax-ff-b:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --ax-maxw:1240px; --ax-gutter:clamp(20px,4vw,40px);
}
:root[data-theme="light"],:root[data-theme="vellum"]{
  --ax-bg:#ffffff; --ax-bg-2:#f3f6fa; --ax-bg-3:#e9eef5;
  --ax-ink:#0e2540; --ax-ink-2:#3f566f;
  --ax-line:rgba(14,37,64,.14); --ax-line-2:rgba(14,37,64,.26);
  --ax-accent:#98690a; --ax-accent-ink:#855a07; --ax-on-accent:#ffffff;
}
.ax-nav,.ax-foot{font-family:var(--ax-ff-d);-webkit-font-smoothing:antialiased;box-sizing:border-box}
/* Plex Mono only for the footer's small caps, as on the home page */
.ax-f-h,.ax-f-sub,.ax-f-bot{font-family:var(--ax-ff-b)}
.ax-nav *,.ax-foot *{box-sizing:border-box}
/* :root:root outranks the older pages' ":root[data-theme] a" rules */
:root:root .ax-nav a,:root:root .ax-foot a{color:inherit;text-decoration:none;border:0;box-shadow:none;background-image:none}
:root:root .ax-nav .ax-pill{color:var(--ax-on-accent);background:var(--ax-accent)}
:root:root .ax-nav .ax-brand{color:var(--ax-ink)}
:root:root .ax-links a:hover,:root:root .ax-f-col a:hover,:root:root .ax-f-legal a:hover{color:var(--ax-ink)}
.ax-nav :focus-visible,.ax-foot :focus-visible{outline:2px solid var(--ax-accent);outline-offset:3px}
.ax-nav{
  position:sticky;top:env(safe-area-inset-top,0px);z-index:50;
  background:var(--ax-bg);
  background:color-mix(in srgb,var(--ax-bg) 84%,transparent);
  -webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
  border-bottom:1px solid var(--ax-line);color:var(--ax-ink);
}
.ax-nav-inner{max-width:var(--ax-maxw);margin:0 auto;padding:14px var(--ax-gutter);display:flex;align-items:center;gap:clamp(10px,2.4vw,32px)}
.ax-brand{font-family:var(--ax-ff-d);font-weight:700;font-size:22px;line-height:1;letter-spacing:-.01em;text-transform:uppercase;color:var(--ax-ink)}
.ax-links{display:flex;gap:28px;margin-left:auto;font-size:15px;color:var(--ax-ink-2)}
.ax-links a{padding:8px 0}
.ax-links a:hover{color:var(--ax-ink)}
.ax-icon{width:42px;height:42px;border-radius:50%;flex:none;display:grid;place-items:center;border:0;padding:0;cursor:pointer;color:var(--ax-ink-2);background:var(--ax-bg-2)}
.ax-icon:hover{background:var(--ax-bg-3);color:var(--ax-ink)}
.ax-pill{display:inline-flex;align-items:center;justify-content:center;flex:none;padding:12px 20px;border-radius:999px;max-width:100%;background:var(--ax-accent);color:var(--ax-on-accent) !important;font-size:14px;font-weight:500;line-height:1.2;text-align:center}
@media (max-width:880px){.ax-links{display:none}.ax-icon{margin-left:auto}}
@media (max-width:380px){.ax-brand{font-size:19px}.ax-pill{padding:12px 16px;font-size:13px}}
.ax-foot{padding:clamp(40px,6vw,64px) 0 32px;background:var(--ax-bg-2);border-top:1px solid var(--ax-line-2);color:var(--ax-ink-2);line-height:1.55}
.ax-foot p{margin:0}
.ax-f-in{max-width:var(--ax-maxw);margin:0 auto;padding:0 var(--ax-gutter);display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,44px)}
.ax-f-brand{display:inline-flex;align-items:center;gap:12px;color:var(--ax-ink)}
.ax-f-glyph{width:22px;height:22px;color:var(--ax-accent-ink);fill:none;stroke:currentColor;stroke-width:11;stroke-linecap:round;stroke-linejoin:round}
.ax-f-mark{font-family:var(--ax-ff-d);font-weight:700;font-size:18px;letter-spacing:-.01em;text-transform:uppercase}
.ax-f-sub{font-size:12px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--ax-ink-2)}
.ax-f-tag{margin-top:14px !important;max-width:340px;font-size:13.5px;line-height:1.55}
.ax-f-ease{margin-top:10px !important;font-size:13px;color:var(--ax-ink-2)}
.ax-f-verse{margin-top:16px !important;max-width:340px;font-size:13px;line-height:1.5;color:var(--ax-accent-ink)}
.ax-f-h{margin-bottom:14px !important;font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ax-accent-ink)}
.ax-f-col a{display:block;margin-bottom:10px;font-size:13px;overflow-wrap:anywhere}
.ax-f-col a:hover{color:var(--ax-ink)}
.ax-f-bot{max-width:var(--ax-maxw);margin:44px auto 0;padding:24px var(--ax-gutter) 0;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--ax-line);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ax-ink-2)}
.ax-f-legal{display:flex;flex-wrap:wrap;gap:6px 18px}
.ax-f-legal a:hover{color:var(--ax-ink)}
@media (max-width:760px){.ax-f-in{grid-template-columns:minmax(0,1fr)}}