/* ============================================================
   FedM8 AI — shared theme (single source of truth)
   Canonical look = Proposal Assist / Bid Coach.
   Load this AFTER the page's inline <style> so shared rules win.
   The top bar is injected by assets/site-nav.js into #site-top.
   ============================================================ */

:root{
  --navy:#0b1f3a; --navy-2:#122a4d; --navy-3:#1a3a68;
  --gold:#c9a227; --gold-light:#e3c565;
  --surface:#fffffe; --page:#eef3f8;
  /* --muted was #848d9c (3.00:1 on --page #eef3f8). #4f5a6b clears WCAG AA 4.5:1 for body text. */
  --ink:#15181d; --ink-2:#4b5361; --muted:#4f5a6b;
  --line:#d9e0ea; --hairline:rgba(11,31,58,.09);
}

/* Always reserve the scrollbar gutter. Every .wrap on the site is a centered
   max-width block, so when a short page has no scrollbar and the next one does,
   the viewport narrows by the scrollbar width and every centered row — the top
   bar included — jumps sideways by half of it. Reserving the gutter on both
   short and tall pages pins the bar in place across navigation and across
   in-page height changes (tier tabs, wall copy, filters). */
html{scrollbar-gutter:stable}

body{font-family:"DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
h1,h2{font-family:"Source Serif 4",Georgia,"Times New Roman",serif;letter-spacing:-.02em}

/* ---------- the one top bar ---------- */
.site-top{background:var(--navy);color:#fff;position:relative;z-index:60;border-bottom:0}
.site-top .wrap{max-width:1080px;margin:0 auto;padding:11px 20px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.site-top .brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:750;font-size:17px;letter-spacing:-.01em;font-family:"DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.site-top .brand img{width:28px;height:28px;border-radius:6px;background:#fff;padding:2px;flex:0 0 auto;display:block}
.site-top .brand span{color:var(--gold-light)}
.site-top nav{margin-left:auto;display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.site-top nav a{color:#c9d4e2;font-size:13.5px;font-weight:600;padding:7px 11px;border-radius:8px;text-decoration:none;background:none;border:none}
.site-top nav a:hover{background:rgba(255,255,255,.09);color:#fff;text-decoration:none}
.site-top nav a.on{background:rgba(255,255,255,.14);color:#fff}
.site-top nav a.login{color:#c9d4e2}
.site-top nav a.cta{background:var(--gold);color:var(--navy);font-weight:750;margin-left:6px}
.site-top nav a.cta:hover{background:var(--gold-light);color:var(--navy)}
.site-top .tier{font-size:11px;font-weight:750;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.1);padding:5px 10px;border-radius:999px;color:#e8eef6}
.site-top .back{color:#c9d4e2;font-size:13.5px;text-decoration:none;white-space:nowrap}
.site-top .back:hover{color:#fff}

/* ---- uniformity hardening -------------------------------------------------
   Pages still carry legacy `header{}` / `header .wrap{}` / `nav{}` rules that
   used to style their own bars. These higher-specificity rules pin every
   visual property of the shared bar so the injected #site-top renders
   IDENTICALLY on every page regardless of page-local CSS. */
header.site-top{padding:0;margin:0;background:var(--navy);border:0;border-bottom:0;box-shadow:none;position:relative;min-height:53px}
header.site-top .wrap{max-width:1080px;margin:0 auto;padding:11px 20px;display:flex;align-items:center;justify-content:flex-start;gap:14px;flex-wrap:wrap;width:auto}
header.site-top .brand{margin:0}
header.site-top nav{margin-left:auto;margin-right:0;display:flex;align-items:center;justify-content:flex-end;gap:4px;flex-wrap:wrap;overflow:visible;background:none;border:0;padding:0}
header.site-top nav a{margin:0;background:none;border:0;transition:background-color .18s ease,color .18s ease}
header.site-top nav a.on{background:rgba(255,255,255,.14)}
header.site-top nav a.cta{background:var(--gold);margin-left:6px}
header.site-top nav a.cta:hover{background:var(--gold-light)}
@media (max-width:700px){
  header.site-top{min-height:47px}
  header.site-top .wrap{padding:10px 14px;gap:8px}
}
@media (max-width:720px){
  .site-top .wrap{padding:10px 14px;gap:8px}
  .site-top nav a{font-size:12.5px;padding:6px 8px}
}