/* ProviderQMS shared chrome — ONE nav, ONE footer on every page (27 Aug 2026, positioning wave 1).
   Self-contained: it must look identical on the v2 inline template and on the premium.css pages, so every
   value is set here explicitly and scoped to .pq-* with enough specificity to beat both templates'
   element selectors (footer{}, .nav a{}, footer a{}). Public Sans, emerald #12B886 on evergreen #0C2B24. */
.pq-hdr,.pq-foot{font-family:"Public Sans",system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
.pq-wrap{max-width:1100px;margin:0 auto;padding:0 22px;box-sizing:border-box}
.pq-hdr{background:#fff;border-bottom:1px solid #D6E2DC}
.pq-nav{display:flex;align-items:center;gap:16px;min-height:64px;position:relative}
.pq-brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:#0C2B24;line-height:1.15}
.pq-brand svg{width:30px;height:30px;color:#12B886;flex:none}
.pq-brand b{display:block;font-size:17px;font-weight:800;letter-spacing:-.01em;color:#0C2B24}
.pq-brand small{display:block;font-size:12.5px;color:#4F625A;letter-spacing:.02em;line-height:1.2;white-space:nowrap;text-transform:none;font-weight:500}
.pq-links{margin-left:auto;display:flex;gap:4px;align-items:center;font-size:15px;font-weight:600}
.pq-nav .pq-links a{color:#0C2B24;text-decoration:none;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center;padding:0 10px;border-radius:8px;font-size:15px;font-weight:600;background:none;border:0;box-shadow:none}
.pq-nav .pq-links a:hover{color:#08674B;background:#E8F0EC;transform:none}
.pq-nav .pq-links a.pq-signin{margin-left:6px}
.pq-nav .pq-links a.pq-cta{margin-left:6px;min-height:44px;padding:0 16px;border:1px solid #D6E2DC;border-radius:10px;color:#0C2B24;background:#fff;font-weight:700}
.pq-nav .pq-links a.pq-cta:hover{border-color:#0C2B24;background:#fff;color:#0C2B24}
.pq-menu{display:none;margin-left:auto;min-height:44px;padding:0 14px;border:1px solid #D6E2DC;border-radius:10px;background:#fff;color:#0C2B24;font:600 15px/1 "Public Sans",system-ui,sans-serif;cursor:pointer}
@media (max-width:820px){
  .pq-menu{display:inline-flex;align-items:center}
  .pq-links{display:none;position:absolute;left:0;right:0;top:100%;z-index:70;flex-direction:column;align-items:stretch;gap:0;background:#fff;border:1px solid #D6E2DC;border-top:0;border-radius:0 0 14px 14px;padding:8px;box-shadow:0 14px 30px rgba(12,43,36,.12)}
  .pq-nav.open .pq-links{display:flex}
  .pq-nav .pq-links a{min-height:48px;padding:0 12px;border-radius:8px}
  .pq-nav .pq-links a.pq-signin,.pq-nav .pq-links a.pq-cta{margin:6px 0 0}
  .pq-nav .pq-links a.pq-cta{justify-content:center}
}
@media (max-width:420px){.pq-brand small{display:none}}

/* ---------- footer ---------- */
footer.pq-foot{display:block;margin-top:0;padding:56px 0 48px;border-top:0;background:#0C2B24;color:#C9DAD2;font-size:15px;line-height:1.55;grid-template-columns:none}
footer.pq-foot .pq-wrap{padding:0 22px}
.pq-foot-top{display:grid;grid-template-columns:1.1fr 2fr;gap:32px 48px;align-items:start}
.pq-foot .pq-brand{color:#fff}
.pq-foot .pq-brand b{color:#fff}
.pq-foot .pq-brand small{color:#7BEFC6;letter-spacing:.02em;text-transform:none;margin:0}
.pq-foot .pq-brand svg{color:#12B886}
.pq-foot .pq-brand svg path[stroke]{stroke:#0C2B24}
.pq-foot p.pq-motto{margin:18px 0 0;font-size:22px;line-height:1.2;font-weight:700;color:#fff;letter-spacing:-.01em;max-width:none}
.pq-foot p.pq-cat{margin:8px 0 0;color:#C9DAD2;font-size:15px;max-width:38ch}
.pq-foot-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 24px}
.pq-foot-cols div{display:flex;flex-direction:column;align-items:flex-start;gap:0;font-size:15px}
.pq-foot-cols small{display:block;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#7BEFC6;margin:0 0 6px}
footer.pq-foot .pq-foot-cols a{display:inline-block;color:#E8F0EC;text-decoration:none;padding:9px 2px;font-size:15px;line-height:1.3;min-height:0}
footer.pq-foot .pq-foot-cols a:hover{color:#7BEFC6;text-decoration:underline}
footer.pq-foot p.pq-foot-legal{margin:32px 0 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);color:#C9DAD2;font-size:14px;max-width:none}
footer.pq-foot p.pq-foot-disc{margin:10px 0 0;color:#9FB8AD;font-size:13.5px;max-width:96ch;line-height:1.55}
@media (max-width:900px){.pq-foot-top{grid-template-columns:1fr}.pq-foot-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.pq-foot-cols{grid-template-columns:1fr 1fr;gap:12px 16px}footer.pq-foot{padding:44px 0 96px}}

/* ---------- category line used as an eyebrow on the premium.css pages ---------- */
.pq-category{font:700 13px/1.2 "Public Sans",system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#08674B;margin:0 0 10px}
.kit-hero .pq-category{margin-bottom:12px}

/* premium.css styles `footer > div` as a flex row with a negative margin and sizes its <p>s; the chrome's own
   wrapper and paragraphs must not inherit that (found at 390px on /kits and /sil-kit: 24px horizontal scroll). */
footer.pq-foot > .pq-wrap{display:block;width:auto;max-width:1100px;margin:0 auto;padding:0 22px;flex:none;box-sizing:border-box}
footer.pq-foot .pq-wrap > *{width:auto;flex:none;display:block}
footer.pq-foot .pq-foot-top{display:grid}
footer.pq-foot p{width:auto;flex:none}

/* ---------- mobile menu: lock the page behind the open panel (W1-01, 28 Aug 2026) ----------
   The shared chrome <script> only ever toggles `.open` on .pq-nav — it never marks <body> — so the
   lock is driven off that one class with :has(). Every rule below sits inside the same 820px query
   the panel itself uses, so the >=821px nav is not reached by any of it.
   iOS applies a hidden overflow to the viewport from the DOCUMENT element, not from body alone, so
   both carry it; without the html arm the page behind still pans under the open panel.
   height:100% is load-bearing, not decoration: overflow:hidden alone stops only USER scrolling (a
   hidden box stays programmatically scrollable per spec, and measured here still moved 600px), so
   the height collapses the document to the viewport and takes the scroll range itself to zero.
   Measured safe: the header is static, so Menu is only reachable at scrollY 0 -- the collapse was
   measured at a 0px jump, and by y=20 the button is already out of view. */
@media (max-width:820px){
  html:has(.pq-nav.open),body:has(.pq-nav.open){overflow:hidden;height:100%;overscroll-behavior:none}
  /* body must also become a containing block. Found on /sil-kit and /sc-kit (premium.css): their
     absolutely-positioned decoration resolves against the VIEWPORT while body is static, so it
     escapes body's clip entirely -- html kept a 3152px scroll range and the page still scrolled.
     Body's margin is 0 on those templates, so relative moves nothing (verified pixel-identical). */
  body:has(.pq-nav.open){position:relative}
  /* Keep every link reachable on a short viewport: the panel scrolls inside itself and contains the
     gesture instead of chaining it back to the page we just locked. dvh where supported, vh before. */
  .pq-nav.open .pq-links{max-height:calc(100vh - 76px);max-height:calc(100dvh - 76px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
}