:root{
  --bg:#0d1421; --bg2:#131c2e; --card:#18233a; --card2:#1e2b46;
  --line:#2a3a5c; --accent:#3da9fc; --accent2:#5fd3a6; --warn:#ffd34d;
  --danger:#ff6b6b; --text:#dfe7f3; --muted:#93a3bd; --head:#7cc0ff;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:linear-gradient(160deg,#0a1019,#0d1421 40%,#101a2c);
  color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;
}
a{color:var(--accent);}

/* language */
.uk-text{display:none;}
.en-text{display:inline;}
html.uk .en-text{display:none;}
html.uk .uk-text{display:inline;}

/* top bar */
.bar{
  position:sticky;top:0;z-index:50;
  background:rgba(13,20,33,.92);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:14px;
  padding:10px 16px;
}
.bar a.back{color:var(--muted);text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap;}
.bar a.back:hover{color:var(--accent);}
.bar .spacer{flex:1;}
.langswitch{display:inline-flex;border:1px solid var(--line);border-radius:30px;overflow:hidden;background:rgba(13,20,33,.6);}
.langswitch button{border:0;background:transparent;color:var(--muted);font:inherit;font-size:13px;font-weight:700;padding:6px 13px;cursor:pointer;transition:.15s;}
.langswitch button.active{background:var(--accent);color:#06101f;}
.langswitch button:not(.active):hover{color:var(--text);}

.wrap{max-width:900px;margin:0 auto;padding:24px 16px 70px;}

/* hero */
.ghero{text-align:center;padding:18px 0 8px;}
.ghero .badge{display:inline-block;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--accent2);border:1px solid var(--accent2);padding:3px 12px;border-radius:30px;margin-bottom:12px;}
.ghero h1{margin:0;font-size:clamp(24px,5vw,40px);font-weight:800;background:linear-gradient(90deg,#7cc0ff,#5fd3a6);-webkit-background-clip:text;background-clip:text;color:transparent;}
.ghero .lead{color:var(--muted);max-width:680px;margin:12px auto 0;font-size:15px;}

/* section blocks (mirrors infographic colored bands) */
.block{border:1px solid var(--line);border-radius:14px;margin:16px 0;overflow:hidden;background:linear-gradient(180deg,var(--card),var(--bg2));}
.block > h2{
  margin:0;font-size:16px;font-weight:700;color:#06101f;
  padding:11px 18px;display:flex;align-items:center;gap:10px;
  background:var(--accent);
}
.block.b-orange > h2{background:#f0883e;}
.block.b-green > h2{background:var(--accent2);}
.block.b-red > h2{background:var(--danger);color:#2a0a0a;}
.block.b-purple > h2{background:#a78bfa;color:#1a0a2e;}
.block.b-gray > h2{background:#8696b5;color:#0a1020;}
.block.b-yellow > h2{background:var(--warn);color:#2a2200;}
.block .inner{padding:14px 18px;}

/* two-column zebra rows like the infographics */
.rows{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:10px;overflow:hidden;}
.rows > div{padding:9px 13px;font-size:13.5px;border-bottom:1px solid var(--line);}
.rows > div:nth-child(4n+1),.rows > div:nth-child(4n+2){background:rgba(255,255,255,.025);}
.rows.one{grid-template-columns:1fr;}
.rows .full{grid-column:1 / -1;}
@media(max-width:560px){.rows{grid-template-columns:1fr;}}

ul{margin:6px 0;padding-left:20px;}
li{margin:4px 0;font-size:13.5px;}
strong{color:#fff;}
p{margin:8px 0;font-size:14px;}
.muted{color:var(--muted);}

/* tables */
.tablewrap{overflow-x:auto;border-radius:10px;border:1px solid var(--line);margin:10px 0;}
table{border-collapse:collapse;width:100%;font-size:13px;}
th,td{padding:8px 11px;text-align:left;border-bottom:1px solid var(--line);}
thead th{background:var(--card2);color:var(--accent2);font-size:11px;text-transform:uppercase;letter-spacing:.4px;}
tbody tr:nth-child(even){background:rgba(255,255,255,.02);}
td.r,th.r{text-align:right;font-variant-numeric:tabular-nums;}

.callout{border-left:4px solid var(--accent);background:rgba(61,169,252,.08);padding:11px 15px;border-radius:0 10px 10px 0;margin:12px 0;font-size:13.5px;}
.callout.warn{border-color:var(--warn);background:rgba(255,211,77,.1);}
.callout.danger{border-color:var(--danger);background:rgba(255,107,107,.1);}
.callout .tag{display:block;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:3px;color:var(--accent);}
.callout.warn .tag{color:var(--warn);}
.callout.danger .tag{color:var(--danger);}

footer{text-align:center;color:var(--muted);font-size:12px;padding:24px 16px;border-top:1px solid var(--line);margin-top:30px;}