/* Frintelis — briefs section. No build step, no dependencies. */
:root{
  --tl-navy:#071B24; --tl-teal:#0B8F83; --tl-lteal:#85CFC8; --tl-grey:#60747A;
  --tl-orange:#F2730A; --tl-amber:#C9A227; --tl-body:#1F2D33;
  --tl-bg:#F4F8F8; --tl-mint:#EAF7F5; --tl-rule:#D7E3E2; --tl-page:#FFFFFF;
  --tl-max:760px;
  box-sizing:border-box;
}
*,*::before,*::after{box-sizing:inherit}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--tl-page); color:var(--tl-body);
  font:400 17px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
.wrap{max-width:var(--tl-max); margin:0 auto; padding:0 20px}

/* header / footer ------------------------------------------------ */
.bar{background:var(--tl-navy); color:#fff}
.bar .wrap{display:flex; justify-content:space-between; align-items:center;
  gap:16px; padding-top:14px; padding-bottom:14px; flex-wrap:wrap}
.bar a{color:#fff; text-decoration:none}
.brand{font-weight:700; letter-spacing:.04em; font-size:19px}
.bar nav a{color:var(--tl-lteal); font-size:14px; letter-spacing:.08em;
  text-transform:uppercase; font-weight:600; margin-left:18px}
.bar nav a:hover{color:#fff}
footer{border-top:1px solid var(--tl-rule); margin-top:56px; padding:28px 0 56px;
  color:var(--tl-grey); font-size:14px}
footer a{color:var(--tl-teal)}

/* type ----------------------------------------------------------- */
h1{font-size:2.05rem; line-height:1.2; color:var(--tl-navy); margin:.3em 0 .35em; letter-spacing:-.01em}
h2{font-size:1.32rem; line-height:1.3; color:var(--tl-navy); margin:2.4em 0 .7em;
  padding-bottom:.35em; border-bottom:2px solid var(--tl-teal)}
h3{font-size:1.05rem; color:var(--tl-teal); margin:1.8em 0 .5em}
p{margin:0 0 1.05em}
a{color:var(--tl-teal)}
.eyebrow{text-transform:uppercase; letter-spacing:.16em; font-size:12.5px;
  font-weight:700; color:var(--tl-teal); margin:34px 0 0}
.standfirst{font-size:1.1rem; color:var(--tl-grey); line-height:1.6; margin-bottom:1.6em}
.meta{font-size:13.5px; color:var(--tl-grey); margin:0 0 2em}
strong{color:var(--tl-navy)}

/* key figures ---------------------------------------------------- */
.kpis{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:2px; background:var(--tl-rule); border:1px solid var(--tl-rule); margin:0 0 2em}
.kpi{background:var(--tl-bg); padding:14px 16px; border-left:4px solid var(--tl-teal)}
.kpi.warn{border-left-color:var(--tl-orange)}
.kpi b{display:block; font-size:1.4rem; color:var(--tl-navy); line-height:1.25}
.kpi span{display:block; font-size:11.5px; text-transform:uppercase;
  letter-spacing:.1em; color:var(--tl-grey); font-weight:600; margin-top:3px}

/* tables --------------------------------------------------------- */
.tablewrap{overflow-x:auto; margin:0 0 .6em; -webkit-overflow-scrolling:touch}
table{border-collapse:collapse; width:100%; font-size:15px; min-width:460px}
caption{text-align:left; font-size:13.5px; color:var(--tl-grey);
  font-style:italic; padding:8px 0; caption-side:bottom}
th{background:var(--tl-navy); color:#fff; font-size:11.5px; letter-spacing:.09em;
  text-transform:uppercase; text-align:left; padding:9px 11px; font-weight:700}
td{padding:9px 11px; border-bottom:1px solid var(--tl-rule); vertical-align:top}
tbody tr:nth-child(odd) td{background:var(--tl-bg)}
td.num,th.num{text-align:right; white-space:nowrap}
.bench{color:var(--tl-teal); font-weight:700}
.over{color:var(--tl-orange); font-weight:700}
.mid{color:var(--tl-amber); font-weight:700}
tfoot td{font-weight:700; background:var(--tl-mint)!important; border-top:2px solid var(--tl-teal)}

/* figures -------------------------------------------------------- */
figure{margin:1.6em 0; padding:0}
figure img{max-width:100%; height:auto; display:block; border:1px solid var(--tl-rule)}
figcaption{font-size:13.5px; color:var(--tl-grey); font-style:italic; margin-top:.55em}
.duo{display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:start}
@media(max-width:620px){ .duo{grid-template-columns:1fr} h1{font-size:1.68rem} }

/* callouts ------------------------------------------------------- */
.note{background:var(--tl-mint); border-left:5px solid var(--tl-teal);
  padding:16px 20px; margin:1.8em 0}
.note.grey{background:var(--tl-bg); border-left-color:var(--tl-grey)}
.note p:last-child{margin-bottom:0}
.note b.hd{display:block; color:var(--tl-navy); margin-bottom:.4em}

/* CTA ------------------------------------------------------------ */
.cta{background:var(--tl-navy); color:#D8E6E5; padding:28px 26px; margin:3em 0 0}
.cta h2{color:#fff; border-bottom-color:var(--tl-teal); margin-top:0}
.cta h3{color:var(--tl-lteal)}
.cta a{color:var(--tl-lteal)}
.cta ul{padding-left:20px}
.cta li{margin-bottom:.5em}
.btn{display:inline-block; background:var(--tl-teal); color:#fff!important;
  text-decoration:none; font-weight:700; padding:12px 22px; margin-top:8px;
  letter-spacing:.03em}
.btn:hover{background:#0a7d73}
.btn.ghost{background:transparent; border:2px solid var(--tl-lteal); color:var(--tl-lteal)!important}

/* brief index ---------------------------------------------------- */
.card{display:block; border:1px solid var(--tl-rule); border-left:5px solid var(--tl-teal);
  padding:20px 22px; margin:0 0 18px; text-decoration:none; color:inherit; background:var(--tl-page)}
.card:hover{background:var(--tl-bg)}
.card h3{margin:.1em 0 .35em; color:var(--tl-navy); font-size:1.15rem}
.card p{margin:0 0 .5em; font-size:15.5px; color:var(--tl-body)}
.card .tags{font-size:12px; text-transform:uppercase; letter-spacing:.09em;
  color:var(--tl-grey); font-weight:600}
ul.tight li{margin-bottom:.45em}