/* Strature GPS phase 1, the country hubs /gps/<iso3>/ and /gps/eu/ (sitebuild/hubs/country.py, WP3; WS-238 (1): the
   "Your exposure" hub). On top of pages-hub.css; site tokens only (site.css :root). Phone first (W-115): one column at
   375 px, nothing wider than the screen, tap targets at least 44 px; the top block kept tight so the first card's
   headline sits on the first 375x667 screen. Copied into www/ only with site.config.json phase1.hubs on. */

/* C1/C2 the top block */
.hc-top{padding:14px 0 6px}
.hc-kind{display:block;margin-bottom:4px}
.hc-top h1{font-size:30px;line-height:1.12}
.hc-top .hb-take{margin-top:6px;font-size:17px;line-height:1.4}
.hc-top .xp-tag{display:inline-block;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--graphite);border:1px solid var(--hair);padding:0 6px;vertical-align:2px}
.hc-top .hc-draft{color:#8A5A10;border-color:#8A5A10}
.hc-top .hb-status{gap:6px;margin-top:8px}
.hc-top .hb-chip{min-height:30px;padding:3px 8px;font-size:12.5px}
.hc-acts{display:flex;flex-wrap:wrap;align-items:center;gap:0 16px;margin-top:4px}
.hc-acts .hb-acts{margin-top:0}
.hc-acts .my-follow{margin:0}
@media (max-width:767px){.hc-acts .my-fnote{display:none}}
.hc-top .hb-layers{margin-top:4px}
/* the folded "Using this page" line takes the breadcrumb row's right end on a phone (howto.js) */
.hb[data-hub-kind="country"] .ht:not(.ht-up){margin-top:6px}

/* the short layer's cards */
.hc .hb-short .hb-blk{padding:18px 0}
.hc .hb-short .hb-blk + .hb-blk{border-top:1px solid var(--hair)}
.hc .hb-short h2{font-size:21px}
/* #companies: the Exposure demo line (findgps.companies_html) is styled for the navy hero; here it sits on paper */
.hc #companies .gps-cos{color:var(--ink)}
.hc #companies .gps-cos .lbl,.hc #companies .gps-cos .gps-cos-n{color:var(--graphite)}
.hc #companies .gps-cos a{color:var(--navy);text-decoration:underline}

/* C3 the band card */
#band .wrap{border:1px solid var(--navy);background:var(--knockout);padding-top:14px;padding-bottom:12px}
.hc-lead{font-family:var(--sans);font-size:15px;margin:0 0 6px}
.hc-bands{display:grid;gap:0;margin:0 0 8px;padding:0;list-style:none}
.hc-bands li{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;
  border-top:1px solid var(--hair);font-family:var(--sans);font-size:15px}
.hc-bands a{display:inline-block;padding:10px 0}
.hc-band{flex:0 0 auto;font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  padding:2px 7px;border:1px solid var(--graphite);color:var(--graphite);white-space:nowrap}
.hc-b-high{color:#B2401F;border-color:#B2401F}
.hc-b-medium{color:#8A5A10;border-color:#8A5A10}
.hc-b-low{color:var(--graphite)}
.hc-b-none{font-weight:600;text-transform:none;letter-spacing:0}

/* C4 risks that reach the country, each with its forecast rows */
.hc-risks{display:grid;gap:12px;margin:0 0 8px;padding:0;list-style:none}
.hc-risk{border:1px solid var(--hair);background:var(--knockout);padding:10px 12px}
.hc-rh{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.hc-rn{font-family:var(--sans);font-size:16px;font-weight:600}
.hc-fbox{margin-top:6px}
.hc-fbox .fl-list{margin:0;padding:0;list-style:none}
.hc-fbox .fcr{padding:6px 0;border-top:1px solid var(--hair);overflow-wrap:anywhere}
.hc-fbox .fcr p{margin:0}
.hc-rgo{margin-top:6px}
.hc-rgo a{display:inline-block;padding:8px 0}

/* C6 who runs short first: the country's Stock Clock still */
.hc-clock{margin:6px 0}
.hc-who{font-family:var(--sans);font-size:15px;font-weight:600;margin:0}
.hc-day{font-family:var(--sans);margin:2px 0 0}
.hc-day .hs-day{font-size:26px}
.hc-dayk{font-family:var(--sans);margin:4px 0 0}
.hs-k{font-size:13px;color:var(--graphite)}
.hs-day{font-size:17px;font-weight:700;color:var(--ink)}
.hs-lane{display:block;width:100%;max-width:420px;height:14px;margin:6px 0 4px}
.hs-track{fill:var(--hair)}
.hs-clo{fill:var(--graphite);opacity:.55}
.hs-short{fill:#B2401F}
.hs-late{fill:#8A5A10;opacity:.75}
.hs-tick{fill:var(--ink)}
.hs-b{font-family:var(--sans);font-size:12.5px;color:var(--graphite);margin:0}
.hs-sell{display:inline-block;margin-top:6px;padding:2px 8px;border:1px solid var(--navy);font-family:var(--sans);
  font-size:12px;font-weight:600;color:var(--navy)}
.hs-src{font-weight:400}
.hs-in{display:block;margin-top:6px;font-family:var(--sans);font-size:12px;color:var(--graphite)}
.hc-norow{font-family:var(--sans);font-size:14px}
/* the EU (27) switch: a checkbox that shows the bloc's own row; no script (WS-232 (3)) */
.hc-clock .hs-eusw{position:absolute;opacity:0;width:1px;height:1px}
.hc-clock .hs-eul{display:inline-flex;align-items:center;gap:8px;min-height:44px;font:600 14px/1.2 var(--sans);
  color:var(--navy);cursor:pointer}
.hc-clock .hs-eul::before{content:"";width:18px;height:18px;border:1.5px solid var(--navy);background:var(--knockout)}
.hc-clock .hs-eusw:checked + .hs-eul::before{background:var(--navy);box-shadow:inset 0 0 0 3px var(--knockout)}
.hc-clock .hs-eusw:focus-visible + .hs-eul{outline:2px solid var(--navy);outline-offset:2px}
.hc-eu{display:none;border-left:3px solid var(--hair);padding-left:10px}
.hs-eusw:checked ~ .hc-eu{display:block}
.hc-eun{font-family:var(--sans);font-size:14px;font-weight:600;margin:0}
.hc-gdet{margin-top:6px}
.hc-gdet summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font:600 14px/1.3 var(--sans);
  color:var(--navy)}
.hc-glist{display:grid;gap:0;margin:0 0 6px;padding:0;list-style:none}
.hc-glist li{display:flex;flex-wrap:wrap;gap:2px 10px;padding:6px 0;border-top:1px solid var(--hair);
  font-family:var(--sans);font-size:14px}
.hc-gd{font-weight:600}
.hc-gb{flex-basis:100%;font-size:12.5px;color:var(--graphite)}
.hc-first,.hs-cred,.hc-case{margin-top:6px}

/* C11 goods and chokepoints */
.hc-goods{display:grid;gap:0;margin:0 0 6px;padding:0;list-style:none}
.hc-goods li{padding:8px 0;border-top:1px solid var(--hair);font-family:var(--sans);font-size:15px}
.hc-g{font-weight:600}
.hc-gs{color:var(--graphite)}

/* C7 what to watch; questions firms often review */
.hc-watch,.hc-review{display:grid;gap:0;margin:0 0 6px;padding:0;list-style:none;max-width:var(--measure)}
.hc-watch li,.hc-review li{padding:8px 0;border-top:1px solid var(--hair)}
.hc-when{display:block;font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--graphite)}
.hc-wt{display:inline-block;font-family:var(--sans);font-size:11.5px;color:var(--graphite)}

/* the analyst layer: the page as it was, the profile in one fold */
.hc-analyst{padding:20px 0 0;background:var(--tint)}
.hc-analyst > .wrap{padding-bottom:6px}
.hc-pf{border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);background:var(--paper)}
.hc-pf > .hb-fs{display:block;min-height:56px;padding:6px 0}
.hc-pf > .hb-fs::after,.hc-pf[open] > .hb-fs::after{content:none}
.hc-fsw{display:flex;flex-direction:column;justify-content:center;min-height:44px;position:relative;padding-right:28px}
.hc-fsw::after{content:"\25B8";position:absolute;right:var(--g);top:50%;transform:translateY(-50%);font-family:var(--sans);
  font-size:14px;color:var(--graphite)}
.hc-pf[open] .hc-fsw::after{content:"\25BE"}
.hc-fsn{color:var(--graphite)}
.hc-pfb{max-width:none;padding:0}
.hc-srcw{padding-top:8px;padding-bottom:16px}

@media (min-width:768px){
  .hc-top{padding:24px 0 10px}
  .hc-top h1{font-size:40px}
  .hc-risks{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media print{
  .hc-acts,.hc-clock .hs-eul{display:none!important}
  .hc-eu{display:block}
}

/* the phase 1 Countries index (sitebuild/hubs/countries_index.py): regions, then their sub-regions (WS-252) */
.gn-p1 .gn-sub{margin:4px 0 14px}
.gn-p1 .gn-sub h3{font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:.02em;color:var(--graphite);
  margin:10px 0 4px}
.gn-p1 .gn-agg{border-top:1px solid var(--hair)}
/* its top block on a phone, kept tight as the hubs' tops are (.hc-top above; the "Using this page" strip folds into
   the breadcrumb row, countries_index.howto_strip), so the first region's heading sits on the first 375x667 screen
   (W-115) */
@media (max-width:767px){
  .hc-ix{padding:16px 0 14px}
  .hc-ix .opener{gap:8px;margin-bottom:14px}
  .hc-ix h1{font-size:30px;line-height:1.12}
  .hc-ix .standfirst{font-size:17px;line-height:1.4}
  .hc-ix + .sec{padding-top:18px}
}

/* Tier 2 EXHIBIT T-1, the country card (sitebuild/hubs/tier2_card.py; WS-698 (5), WS-702, WS-757; signature WS-720):
   four energy figures, then the value-chain positions, in one plate. Phone first: one column at 375 px, every line
   wraps (long source and licence lines included), nothing wider than the screen; two columns of figures from 600 px */
.hc-t2{--amber:#8A5A10;margin-top:10px;max-width:100%;min-width:0}   /* the low-confidence ink (pages-profile.css .xp) */
.hc-t2 .p-title{max-width:none}
.hc-t2-figs{display:grid;grid-template-columns:minmax(0,1fr);gap:0;margin:12px 0 4px;padding:0}
.hc-t2-f{min-width:0;border-top:1px solid var(--hair);padding:8px 0}
.hc-t2-f dt{font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--graphite);line-height:1.35}
.hc-t2-f dd{margin:2px 0 0;font-family:var(--sans);line-height:1.4;overflow-wrap:anywhere}
.hc-t2-v{display:block;font-size:20px;font-weight:600;color:var(--ink)}
.hc-t2-nof{display:block;font-size:15px;color:var(--graphite);font-style:italic}
.hc-t2-m{display:block;font-size:12px;color:var(--graphite)}
.hc-t2-n{display:block;font-size:12.5px;color:var(--ink);margin-top:2px}
.hc-t2-low{display:inline;font-size:12px;font-weight:600;color:var(--amber)}
.hc-t2-eu{font-family:var(--sans);font-size:13px;color:var(--graphite);margin:0 0 4px;overflow-wrap:anywhere}
.hc-t2-h{font-family:var(--sans);font-size:15px;font-weight:600;margin:12px 0 4px}
.hc-t2-vc{list-style:none;margin:0 0 6px;padding:0}
.hc-t2-vc li{min-width:0;border-top:1px solid var(--hair);padding:6px 0;font-family:var(--sans);font-size:14px;line-height:1.4;
  overflow-wrap:anywhere}
.hc-t2-vc .num{font-weight:600}
.hc-t2-tag{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--graphite);
  border:1px solid var(--hair);padding:0 5px}
.hc-t2-vcn{font-family:var(--sans);font-size:14px;color:var(--graphite);margin:10px 0 4px}
.hc-t2 .p-foot > span{overflow-wrap:anywhere;min-width:0}
.hc-t2-goods{font-family:var(--sans);font-size:14px;margin:10px 0 0}
@media (min-width:600px){
  .hc-t2-figs{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px}
}
.hc-t2-tap{margin:10px 0 2px}   /* WS-764 (2): the phone tap that opens the T-1 figures (hub-t2.js) */
.hc-t2-btn{font:600 14px/1.2 var(--sans);padding:10px 14px;min-height:44px;border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.hc-t2-btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
@media print{.hc-t2-tap{display:none}.hc-t2-more[hidden]{display:block!important;content-visibility:visible!important}}
#hb-gf2{display:grid;gap:32px;min-width:0}   /* S-3 and S-4 keep the .sv grid's gap inside their part (supply.css) */
.hb-gtap{margin:10px 0 2px}   /* WS-766: the phone tap that opens the goods section's figures (hub-country-fold.js) */
.hb-gbtn{font:600 14px/1.2 var(--sans);padding:10px 14px;min-height:44px;border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.hb-gbtn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
@media print{.hb-gtap{display:none}.hb-gfold[hidden]{display:block!important;content-visibility:visible!important}}
.hb-atap{margin:12px 0 2px}   /* WS-767: the phone tap that opens the analyst layer (hub-country-fold.js) */
@media print{.hb-atap{display:none}.hb-afold[hidden]{display:block!important;content-visibility:visible!important}}