/* digotech/pj-facts — the case study's facts table as a card: the first header cell is the title, rows are label · value */
.pj-facts{padding:var(--gap-card-s);border:1px solid var(--rule);border-radius:var(--r-card);background:var(--paper-2)} /* same card as the call to action below it (pj.css .pj-cta) */
.pj-facts figure{margin:0}
.pj-facts :is(table,thead,tbody){display:block;border:0}
.pj-facts table{font-size:var(--t-s)}
.pj-facts tr{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);column-gap:var(--s-3)}
.pj-facts thead tr{display:block}
.pj-facts :is(th,td){display:block;padding:0;border:0;text-align:left}
.pj-facts th{padding-bottom:var(--s-3);font:600 var(--t-xs)/1.3 var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--ink-2)}
.pj-facts th + th{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap} /* ds-ok: visually-hidden pattern, the column header stays for screen readers */
.pj-facts tbody tr{padding-block:var(--s-3);border-top:1px solid var(--rule)}
.pj-facts tbody tr:last-child{padding-bottom:0}
.pj-facts td{overflow-wrap:anywhere}
.pj-facts td:first-child{color:var(--ink-3);font-size:var(--t-xs);line-height:1.5}
.pj-facts td + td{color:var(--ink);font-weight:600;line-height:1.45}