/* HISAAB shared header: the same two rows on the portal (/), the Pakistan pages (/national.html) and Site Assessment (/v2/location.html).
   Row 1 (sage band): brand and the three sections: Your assets, Pakistan risk, Methods & data.
   Row 2 (white): the pages of the current section, underlined when open; status on the right.
   The portal inlines this file (research/asset_design/build_design.py), so it also works as a saved page. No blue. */
:root{--hxh:98px}
.hx{--hx-band:#E5EEE6;--hx-ink:#24483C;--hx-sel:#38664D;--hx-line:#CFDDD2;--hx-ink2:#4A5A50;
  position:sticky;top:0;z-index:20;flex:none;background:#FFFFFF;border-bottom:1px solid var(--hx-line);color:var(--hx-ink);
  font-family:Calibri,Carlito,"Segoe UI",Candara,"Helvetica Neue",Arial,sans-serif;font-size:15px;line-height:1.3}
.hx a{color:inherit;text-decoration:none}
.hx nav{margin:0;flex-wrap:nowrap}
.hx-1{display:flex;align-items:center;gap:20px;height:54px;padding:0 18px;background:var(--hx-band);border-bottom:1px solid var(--hx-line)}
.hx-brand{display:flex;align-items:center;gap:12px;min-width:0;flex:none}
.hx-brand img{height:36px;width:auto;border-radius:6px;background:#FFFFFF;padding:2px 6px}
.hx-word b{display:flex;align-items:center;gap:8px;font-size:20px;font-weight:800;letter-spacing:2.4px;color:var(--hx-ink)}
.hx-word small{display:block;font-size:12.5px;color:var(--hx-ink2);letter-spacing:0;white-space:nowrap}
.hx .flag{width:27px;height:18px;border-radius:2px;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.hx-sec{display:flex;gap:6px;margin-left:8px}
.hx .hx-sec a{display:inline-flex;align-items:center;height:34px;padding:0 15px;border-radius:999px;font-weight:700;color:var(--hx-ink);white-space:nowrap}
.hx .hx-sec a:hover{background:rgba(36,72,60,.09)}
.hx .hx-sec a[aria-current="page"]{background:var(--hx-sel);color:#FFFFFF}
.hx-tools{margin-left:auto;display:flex;align-items:center;gap:10px;flex:none}
.hx-tools select{padding:7px 10px;border:1px solid rgba(36,72,60,.25);border-radius:8px;background:#FFFFFF;font:inherit;color:var(--hx-ink);min-height:34px}
.hx-tools label{display:flex;align-items:center;gap:8px;font-weight:600}
.hx-2{display:flex;align-items:center;gap:16px;height:42px;padding:0 18px 0 8px}
.hx-sub{display:flex;align-items:stretch;gap:2px;height:100%;overflow-x:auto;scrollbar-width:none;min-width:0;flex:0 1 auto}
.hx-sub::-webkit-scrollbar{display:none}
.hx .hx-sub a,.hx .hx-sub button{display:inline-flex;align-items:center;gap:6px;height:100%;padding:0 14px;margin:0;border:0;border-bottom:3px solid transparent;border-radius:0;
  background:none;font:inherit;font-weight:600;color:var(--hx-ink2);white-space:nowrap;cursor:pointer}
.hx .hx-sub a:hover,.hx .hx-sub button:hover{color:var(--hx-ink);background:#F1F8F3}
.hx .hx-sub a[aria-current="page"],.hx .hx-sub button[aria-current="page"]{color:var(--hx-ink);background:none;border-bottom-color:var(--hx-sel);font-weight:700}
.hx .hx-sub .ext::after{content:"\2197";font-size:13px;opacity:.55}
.hx-status{margin-left:auto;flex:1 1 0;justify-content:flex-end;display:flex;gap:14px;align-items:center;min-width:0;overflow:hidden;white-space:nowrap;color:var(--hx-ink2);font-size:13.5px}
.hx-status>*{overflow:hidden;text-overflow:ellipsis}
@media (max-width:1250px){.hx-word small{display:none}}
@media (max-width:1180px){.hx-status>*+*{display:none}}
@media (max-width:860px){
  :root{--hxh:0px}
  .hx{position:relative}
  .hx-1{height:auto;flex-wrap:wrap;gap:8px 12px;padding:8px 12px}
  .hx-brand img{height:32px}.hx-word b{font-size:19px;letter-spacing:1.6px}
  .hx-sec{order:3;flex-basis:100%;margin:0;overflow-x:auto;scrollbar-width:none}
  .hx .hx-sec a{height:36px;padding:0 13px}
  .hx-2{padding:0 4px;height:44px}
  .hx-status{display:none}
}
@media print{.hx{display:none!important}}