/* ════════════════════════════════════════════════════════════════════════════
   stressed.in — ui.css · v1 (14-Sep-2026)
   THE HOMEPAGE'S DESIGN LANGUAGE, MADE SHAREABLE.

   ── WHY THIS FILE EXISTS ──────────────────────────────────────────────────
   Hemant, 14-Sep: "theme.css isn't working, not able to provide that homepage
   like feel ... that design, gradients, layout etc. so i guess theme.css is
   not serving any purpose."

   Half right, and the half that is right matters more than the half that is
   not, so both are written down here.

   theme.css IS doing a job: it holds 92 design tokens and 562 selectors, and
   every page draws its colour, type and chrome from it. Delete it and the site
   loses its identity.

   What it CANNOT do is make a page look like the homepage — because the
   homepage does not use it. index.php has loaded no theme.css since v98; its
   entire look lives in its own 31KB stylesheet. Every device that makes that
   page feel designed — the two-radial hero, the 104-degree role washes, the
   three-stop feature diagonals, the 72px band rhythm, the ruled index rows —
   exists in exactly one file that no other page can reach. theme.css carries
   the PALETTE. It was never given the LANGUAGE.

   So the fix is not to keep hand-porting three devices per page. It is this
   file: the homepage's vocabulary, lifted out once, prefixed `u-` so it can
   never collide with theme.css's own `.band` / `.card` / `.hero`, and loaded
   by any page that wants the homepage feel.

   ── HOW TO USE IT ─────────────────────────────────────────────────────────
   One line, immediately after the header include:

       <link rel="stylesheet" href="/ui.css?v=1">

   Opt-in per page, deliberately. When enough pages are on it and nothing has
   broken, the line moves into includes/header.php and becomes site-wide. Until
   then a page that has not been looked at cannot be changed by accident.

   ── THE FIVE COLOURS ──────────────────────────────────────────────────────
   Tokens come from theme.css v16. A surface wears the colour of who it is FOR;
   a figure keeps the colour of what it MEASURES.

       --val  purple      intelligence, benchmarks, interpretation
       --len  green       money — claims, recovery, the committee
       --rp   slate blue  people and process, time
       --pro  bronze      documents, orders, the registry
       --inv  terracotta  the market — buyers, deals, selling surfaces
   ════════════════════════════════════════════════════════════════════════ */

/* ── layout spine ──────────────────────────────────────────────────────── */
.u-wrap{max-width:var(--maxw,1280px);margin:0 auto;padding:0 24px}
.u-band{padding:72px 0}
.u-band.tight{padding:52px 0}
.u-band.tint {background:#fff;border-top:1px solid var(--line)}
.u-band.warm {background:#FAFBF8}
.u-band.blush{background:linear-gradient(180deg,#F1F7F3 0%,#FBFDFB 100%)}
.u-band.intel{background:linear-gradient(180deg,#F4F1FA 0%,#FAF9FD 52%,#fff 100%);border-top:1px solid #E4DDF0}
.u-band.cool {background:linear-gradient(180deg,#FBF7F1 0%,#FFFDFA 100%);border-top:1px solid #EEE1D2}
.u-band + .u-band.tint{border-top:1px solid var(--line)}

/* ── the hero. TWO radials over a diagonal — the second one warm. That warm
      corner against a cool ground is the whole trick; a single green wash is
      what makes a page read as monotonous. ─────────────────────────────── */
.u-hero{
  background:
    radial-gradient(ellipse at 88% 10%,#E7F0ED 0,transparent 54%),
    radial-gradient(ellipse at 4% 98%,#FBEAE2 0,transparent 46%),
    linear-gradient(140deg,#FBFCFA,#F2F7F3);
  border-bottom:1px solid var(--line);padding:52px 0 44px;position:relative;
}
.u-hero.tight{padding:38px 0 32px}
/* role variants — the top-right radial takes the section's colour, the warm
   corner stays put on all of them */
.u-hero.h-val {background:radial-gradient(ellipse at 88% 10%,#EDE6F7 0,transparent 54%),radial-gradient(ellipse at 4% 98%,#FBEAE2 0,transparent 46%),linear-gradient(140deg,#FCFBFE,#F4F1FA)}
.u-hero.h-rp  {background:radial-gradient(ellipse at 88% 10%,#DFE9F8 0,transparent 54%),radial-gradient(ellipse at 4% 98%,#FBEAE2 0,transparent 46%),linear-gradient(140deg,#FBFCFE,#EEF3FA)}
.u-hero.h-pro {background:radial-gradient(ellipse at 88% 10%,#F6EAD0 0,transparent 54%),radial-gradient(ellipse at 4% 98%,#E7EFEA 0,transparent 46%),linear-gradient(140deg,#FEFDFA,#F8F4EA)}
.u-hero.h-inv {background:radial-gradient(ellipse at 88% 10%,#F7E3D6 0,transparent 54%),radial-gradient(ellipse at 4% 98%,#E7EFEA 0,transparent 46%),linear-gradient(140deg,#FEFCFA,#F9F1EB)}

.u-eyebrow{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.13em;
  text-transform:uppercase;color:var(--brand-dk);display:block;margin-bottom:14px}
.u-hero h1,.u-h1{font-family:var(--disp);font-size:clamp(30px,3.4vw,46px);line-height:1.09;
  font-weight:800;letter-spacing:-.035em;color:var(--ink);max-width:16em;margin:0}
.u-hero h1 em,.u-h1 em{font-style:normal;color:var(--acc)}
.u-lead{font-size:16.5px;line-height:1.65;color:var(--ink2);max-width:44em;margin:16px 0 0}
.u-hero-top{display:flex;align-items:flex-start;justify-content:space-between;gap:30px;flex-wrap:wrap}
.u-hero-aside{font-size:13px;font-weight:600;white-space:nowrap;padding-top:6px}

/* ── the counts strip: big display figure, mono caption. Lifted from the
      homepage's .platfig — the figure carries the weight, the label does
      not compete with it. ────────────────────────────────────────────── */
.u-figs{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:22px 40px;
  border-top:1px solid var(--line);margin-top:30px;padding-top:22px}
.u-figs b{display:block;font-family:var(--disp);font-size:clamp(26px,2.6vw,34px);font-weight:800;
  letter-spacing:-.035em;line-height:1;color:var(--acc);font-variant-numeric:tabular-nums}
.u-figs small{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--mut);margin-top:9px;line-height:1.55;max-width:13em}
.u-figs .f-val b{color:var(--val)} .u-figs .f-rp b{color:var(--rp)}
.u-figs .f-pro b{color:var(--pro)} .u-figs .f-inv b{color:var(--inv)}
.u-asof{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;color:var(--mut);margin-top:16px}

/* ── buttons ───────────────────────────────────────────────────────────── */
.u-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.u-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--acc);color:#fff;border:1px solid var(--acc);border-radius:999px;
  padding:11px 24px;font-size:14px;font-weight:600;text-decoration:none;
  transition:background .15s,border-color .15s,color .15s}
.u-btn:hover{background:var(--acc-deep);border-color:var(--acc-deep);color:#fff}
.u-btn.ghost{background:#fff;color:var(--ink);border-color:var(--line2)}
.u-btn.ghost:hover{background:#fff;border-color:var(--acc);color:var(--brand-dk)}
.u-btn.inv{background:var(--inv);border-color:var(--inv)}
.u-btn.inv:hover{background:#87411F;border-color:#87411F}

/* ── the two-column page with a sticky index ───────────────────────────── */
.u-cols{display:grid;grid-template-columns:212px minmax(0,1fr);gap:44px;align-items:start}
.u-side{position:sticky;top:96px;align-self:start}
.u-side-lab{font-family:var(--mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--mut);margin-bottom:12px}
.u-side a{display:block;font-size:13.5px;padding:9px 12px;border-left:2px solid var(--line);
  color:var(--ink2);text-decoration:none;line-height:1.4}
.u-side a:hover{border-left-color:var(--acc);background:var(--acc-soft);color:var(--brand-dk)}
.u-side a.on{border-left-color:var(--acc);color:var(--brand-dk);font-weight:600}
.u-side small{display:block;font-size:12px;color:var(--mut);margin:20px 12px 0;line-height:1.6}

/* ── a section, with its own colour ────────────────────────────────────── */
.u-sec{margin-bottom:56px;scroll-margin-top:104px;--sec-c:var(--acc);--sec-cs:var(--acc-soft)}
.u-sec:last-child{margin-bottom:0}
.u-sec.c-val{--sec-c:var(--val);--sec-cs:var(--val-soft)}
.u-sec.c-len{--sec-c:var(--len);--sec-cs:var(--len-soft)}
.u-sec.c-rp {--sec-c:var(--rp); --sec-cs:var(--rp-soft)}
.u-sec.c-pro{--sec-c:var(--pro);--sec-cs:var(--pro-soft)}
.u-sec.c-inv{--sec-c:var(--inv);--sec-cs:var(--inv-soft)}
.u-sec-head{display:flex;gap:15px;align-items:flex-start;margin-bottom:20px}
.u-num{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:10px;
  background:var(--sec-cs);color:var(--sec-c);border:1px solid var(--sec-c);
  font-family:var(--mono);font-size:12px;font-weight:600}
.u-sec-head h2{font-family:var(--disp);font-size:clamp(22px,2.3vw,29px);line-height:1.16;
  font-weight:800;letter-spacing:-.03em;color:var(--ink);margin:0}
.u-sec-head p{font-size:15px;line-height:1.6;color:var(--mut);margin:8px 0 0;max-width:46em}
.u-sec > p{font-size:15.5px;line-height:1.75;color:var(--ink2);max-width:48em;margin:0 0 18px}

/* ── the ruled index row. The homepage's .offrow: a numbered marker, a
      title with a sub-line, and a right-hand caption, separated by rules
      rather than boxed in cards. Frameless, and it scales to any length. */
.u-rows{margin:0;padding:0;list-style:none}
.u-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:20px;align-items:flex-start;
  padding:20px 0;border-top:1px solid var(--line)}
.u-row:first-child{border-top:1px solid var(--line2)}
.u-row:last-child{border-bottom:1px solid var(--line)}
.u-row .u-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;
  background:var(--rc-s,var(--sec-cs));color:var(--rc,var(--sec-c));font-family:var(--mono);
  font-size:13px;font-weight:600;transition:background .15s,color .15s}
.u-row:hover .u-mark{background:var(--rc,var(--sec-c));color:#fff}
.u-row b{display:block;font-size:16.5px;font-weight:600;line-height:1.35;color:var(--ink)}
.u-row p{font-size:14px;line-height:1.65;color:var(--mut);margin:6px 0 0;max-width:52em}
.u-row .u-cap{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;
  color:var(--mut);text-align:right;line-height:1.7;white-space:nowrap}
.u-row.a{--rc:var(--len);--rc-s:var(--len-soft)}
.u-row.b{--rc:var(--rp); --rc-s:var(--rp-soft)}
.u-row.c{--rc:var(--pro);--rc-s:var(--pro-soft)}
.u-row.d{--rc:var(--mut);--rc-s:var(--paper2)}

/* ── cards on a role wash — the homepage's .vband.flip, at card scale ──── */
.u-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.u-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.u-card{border:1px solid var(--line);border-radius:14px;padding:20px 22px;
  background:linear-gradient(104deg,var(--cc-s,var(--sec-cs)) 0%,#fff 62%)}
.u-card h3{font-family:var(--disp);font-size:17px;font-weight:700;letter-spacing:-.02em;
  line-height:1.3;color:var(--ink);margin:0}
.u-card p{font-size:14px;line-height:1.7;color:var(--mut);margin:8px 0 0}
.u-card .u-tag{font-family:var(--mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--cc,var(--sec-c));display:block;margin-bottom:8px}
.u-card.k-val{--cc:var(--val);--cc-s:var(--val-soft)}
.u-card.k-len{--cc:var(--len);--cc-s:var(--len-soft)}
.u-card.k-rp {--cc:var(--rp); --cc-s:var(--rp-soft)}
.u-card.k-pro{--cc:var(--pro);--cc-s:var(--pro-soft)}
.u-card.k-inv{--cc:var(--inv);--cc-s:var(--inv-soft)}
.u-card.flat{background:#fff}
.u-card p a{color:var(--cc,var(--sec-c));font-weight:600;text-decoration:underline;
  text-decoration-color:color-mix(in srgb,var(--cc,var(--sec-c)) 35%,transparent);text-underline-offset:3px}
.u-card p a:hover{text-decoration-color:currentColor}
.u-sec-head p a,.u-flow p a,.u-disc-body a,.u-note a{color:var(--sec-c);font-weight:600}

/* ── the feature card: a three-stop diagonal. The homepage uses it for the
      Research Desk and the paid door; here it is any surface that sells. ─ */
.u-feat{border-radius:20px;padding:32px 34px;
  background:linear-gradient(150deg,#F7E7DA 0%,#FCF3EB 58%,#FFFDFB 100%);border:1px solid #EBD8C7}
.u-feat.green{background:linear-gradient(150deg,#E3F0E8 0%,#F1F8F3 58%,#FBFDFB 100%);border-color:#CDE2D5}
.u-feat h2{font-family:var(--disp);font-size:clamp(23px,2.4vw,30px);font-weight:800;
  letter-spacing:-.03em;line-height:1.14;color:var(--ink);margin:0}
.u-feat p{font-size:15px;line-height:1.65;color:#6C5A4E;margin:10px 0 0;max-width:38em}
.u-feat.green p{color:var(--ink2)}
.u-closer{display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap}
.u-closer .u-btns{margin:0;flex-shrink:0}

/* ── the dark card, with the homepage's gradient edge ──────────────────── */
.u-dark{position:relative;overflow:hidden;border-radius:16px;padding:28px 26px;
  background:linear-gradient(150deg,#153C33 0%,#1D4A3E 58%,#24503C 100%);color:#E7F0EC}
.u-dark::before{content:'';position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(135deg,var(--brand),var(--pro))}
.u-dark h3{font-family:var(--disp);font-size:19px;font-weight:700;color:#fff;margin:0 0 8px;letter-spacing:-.02em}
.u-dark p{font-size:13.5px;line-height:1.65;color:rgba(231,240,236,.74);margin:0}

/* ── the three-colour rule, straight off the homepage ──────────────────── */
.u-rule3{position:relative;height:3px;border-radius:2px;
  background:linear-gradient(90deg,var(--len) 0 33%,var(--ink) 33% 66%,var(--pro) 66%)}
.u-rule5{position:relative;height:3px;border-radius:2px;
  background:linear-gradient(90deg,var(--len) 0 20%,var(--rp) 20% 40%,var(--val) 40% 60%,var(--pro) 60% 80%,var(--inv) 80%)}

/* ── progressive disclosure: summary first, detail on demand ───────────── */
.u-disc{background:#fff;border:1px solid var(--line);border-radius:12px;margin-top:12px;overflow:hidden}
.u-disc > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:16px;
  padding:16px 20px;font-weight:600;font-size:14.5px;color:var(--ink)}
.u-disc > summary::-webkit-details-marker{display:none}
.u-disc > summary::after{content:'+';margin-left:auto;color:var(--sec-c);font-size:23px;font-weight:400;line-height:1}
.u-disc[open] > summary::after{content:'\2212'}
.u-disc[open] > summary{border-bottom:1px solid var(--line);background:var(--sec-cs)}
.u-disc-body{padding:18px 21px;font-size:14.5px;line-height:1.8;color:var(--ink2)}
.u-disc-body p + p{margin-top:13px}
.u-disc-body ul,.u-disc-body ol{padding-left:21px;margin:11px 0}
.u-disc-body li{padding:5px 0}
.u-disc-body b,.u-disc-body strong{color:var(--ink)}

/* ── a worked example, boxed and labelled as an illustration ───────────── */
.u-example{background:var(--sec-cs);border:1px solid var(--line);border-radius:12px;padding:20px 22px;margin:14px 0}
.u-example .u-eyebrow{margin-bottom:10px;color:var(--sec-c)}
.u-eq{font-family:var(--mono);font-size:17px;line-height:1.6;font-weight:600;color:var(--sec-c);
  font-variant-numeric:tabular-nums;margin:8px 0 0}

/* ── the numbered flow ─────────────────────────────────────────────────── */
.u-flow{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;counter-reset:uflow}
.u-flow li{counter-increment:uflow;border:1px solid var(--line);border-radius:12px;
  background:linear-gradient(104deg,var(--sec-cs) 0%,#fff 62%);padding:18px 19px}
.u-flow li::before{content:'0' counter(uflow);display:block;font-family:var(--mono);font-size:11px;
  font-weight:600;letter-spacing:.08em;color:var(--sec-c);margin-bottom:8px}
.u-flow h4{font-family:var(--disp);font-size:16px;font-weight:700;letter-spacing:-.02em;color:var(--ink);margin:0}
.u-flow p{font-size:13.5px;line-height:1.65;color:var(--mut);margin:7px 0 0}

/* ── a table that behaves in a narrow column ───────────────────────────── */
.u-tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:#fff}
.u-table{width:100%;border-collapse:collapse;font-size:13.5px;line-height:1.6;min-width:520px}
.u-table th{background:var(--sec-cs);text-align:left;font-family:var(--mono);font-size:10px;
  font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--sec-c);
  padding:12px 16px;border-bottom:1px solid var(--line)}
.u-table td{padding:14px 16px;border-bottom:1px solid var(--line2);vertical-align:top;color:var(--mut)}
.u-table tr:last-child td{border-bottom:0}
.u-table td:first-child{color:var(--ink);font-weight:600;width:26%}
.u-table td small{display:block;font-weight:400;color:var(--mut);margin-top:5px}

/* ── a quiet note ──────────────────────────────────────────────────────── */
.u-note{border-left:3px solid var(--sec-c);background:var(--sec-cs);border-radius:0 10px 10px 0;
  padding:15px 18px;font-size:14px;line-height:1.7;color:var(--ink2);margin-top:16px}
.u-note b{color:var(--ink)}
.u-small{font-size:12.5px;color:var(--mut);line-height:1.65}

/* ── search + filter, for a long reference list ────────────────────────── */
.u-search{display:flex;gap:10px;align-items:flex-end;max-width:820px;flex-wrap:wrap}
.u-search > div{flex:1;min-width:220px}
.u-search label{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--mut);margin-bottom:7px}
.u-search input{width:100%;border:1px solid var(--line2);background:#fff;padding:13px 16px;
  border-radius:10px;font-size:16px;font-family:inherit;color:var(--ink);
  box-shadow:0 1px 2px rgba(21,51,46,.05)}
.u-search input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px var(--acc-soft)}
.u-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
.u-chip{border:1px solid var(--line2);border-radius:999px;color:var(--ink2);background:#fff;
  font-family:inherit;font-size:12.5px;padding:8px 14px;font-weight:600;cursor:pointer;
  transition:background .15s,border-color .15s,color .15s}
.u-chip:hover{border-color:var(--acc);color:var(--brand-dk)}
.u-chip[aria-pressed="true"]{background:var(--acc);border-color:var(--acc);color:#fff}
.u-resbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:22px 0 12px}
.u-count{font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:var(--mut)}
.u-textbtn{border:0;background:transparent;font-family:inherit;font-size:12.5px;color:var(--acc);
  padding:5px;font-weight:600;cursor:pointer}
.u-textbtn:hover{text-decoration:underline}
.u-textbtn:disabled{opacity:.4;cursor:default;text-decoration:none}
.u-empty{padding:30px;border:1px dashed var(--line2);background:#fff;border-radius:12px;text-align:center}

/* ── a definition row, disclosable ─────────────────────────────────────── */
.u-term{border:1px solid var(--line);border-left:3px solid var(--tc,var(--acc));border-radius:10px;
  background:#fff;margin-bottom:9px;overflow:hidden}
.u-term > summary{display:grid;grid-template-columns:minmax(170px,238px) minmax(0,1fr) 22px;
  align-items:center;gap:24px;padding:16px 20px;list-style:none;cursor:pointer}
.u-term > summary::-webkit-details-marker{display:none}
.u-term > summary:hover{background:var(--paper)}
.u-term-n b{display:block;font-size:15px;line-height:1.4;color:var(--ink);font-weight:600}
.u-term-n small{display:block;font-family:var(--mono);font-size:10.5px;line-height:1.5;
  color:var(--mut);margin-top:4px;letter-spacing:.02em}
.u-term-b{font-size:14px;line-height:1.65;color:var(--ink2)}
.u-plus{font-size:22px;color:var(--tc,var(--acc));font-weight:400;text-align:right;line-height:1}
.u-term[open] .u-plus{font-size:0}
.u-term[open] .u-plus::after{content:'\2212';font-size:22px}
.u-term[open] > summary{border-bottom:1px solid var(--line);background:var(--tcs,var(--acc-soft))}
.u-term-d{padding:18px 24px 20px 282px;color:var(--ink2);font-size:14px;line-height:1.8}
.u-term-d p{max-width:56em;margin:0}
.u-term-d p + p{margin-top:11px}
.u-term.t-len{--tc:var(--len);--tcs:var(--len-soft)}
.u-term.t-rp {--tc:var(--rp); --tcs:var(--rp-soft)}
.u-term.t-val{--tc:var(--val);--tcs:var(--val-soft)}
.u-term.t-pro{--tc:var(--pro);--tcs:var(--pro-soft)}
.u-term.t-inv{--tc:var(--inv);--tcs:var(--inv-soft)}

/* ── responsive ────────────────────────────────────────────────────────── */
@media(max-width:1040px){
  .u-cols{grid-template-columns:180px minmax(0,1fr);gap:28px}
  .u-grid.two{grid-template-columns:1fr}
  .u-term > summary{grid-template-columns:200px minmax(0,1fr) 20px;gap:18px}
  .u-term-d{padding-left:242px}
}
@media(max-width:760px){
  .u-wrap{padding:0 16px}
  .u-band{padding:48px 0}
  .u-band.tight{padding:36px 0}
  .u-hero{padding:34px 0 30px}
  .u-hero.tight{padding:28px 0 24px}
  .u-cols{display:block}
  .u-side{position:static;border-bottom:1px solid var(--line);margin-bottom:28px;padding-bottom:16px}
  .u-side nav{display:flex;gap:7px;flex-wrap:wrap}
  .u-side a{border:1px solid var(--line);background:#fff;border-radius:8px;padding:7px 11px;font-size:12.5px}
  .u-side small{display:none}
  .u-sec{margin-bottom:42px}
  .u-num{width:32px;height:32px}
  .u-sec-head{gap:12px}
  .u-row{grid-template-columns:34px minmax(0,1fr);gap:14px;padding:17px 0}
  .u-row .u-mark{width:34px;height:34px;font-size:12px}
  .u-row .u-cap{grid-column:2;text-align:left;white-space:normal;margin-top:8px}
  .u-feat{padding:24px 20px;border-radius:16px}
  .u-closer{align-items:flex-start;flex-direction:column;gap:16px}
  .u-figs{gap:18px 24px}
  .u-term > summary{grid-template-columns:minmax(0,1fr) 20px;gap:7px 12px;padding:15px 16px}
  .u-term-n{grid-column:1;grid-row:1}
  .u-term-b{grid-column:1;grid-row:2;font-size:13.5px}
  .u-plus{grid-column:2;grid-row:1 / 3}
  .u-term-d{padding:16px 18px}
  .u-disc > summary{padding:14px 16px;font-size:14px}
  .u-disc-body{padding:16px 17px}
}
@media(prefers-reduced-motion:reduce){.u-wrap *,.u-hero *{transition:none!important;animation:none!important}}

/* ── print ─────────────────────────────────────────────────────────────── */
@media print{
  .u-side,.u-btns,.u-dark,[data-u-enhance]{display:none!important}
  .u-hero{background:#fff!important;border-bottom:1px solid #999}
  .u-cols{display:block}
  .u-disc[open] > summary,.u-term[open] > summary{background:#fff}
  .u-sec,.u-card,.u-term,.u-disc{break-inside:avoid}
  .u-band{padding:18px 0}
}


/* ════════════════════════════════════════════════════════════════════════════
   ══ deal-flow component sheet (appended 14-Sep-2026) ══════════════════════

   The eight deal-flow pages are generated by thirty shared helpers in _ui.php,
   which emit `df-*` class names. Their styling used to be an 11.5KB <style>
   block copied verbatim into all eight files — 92KB of CSS, 11.5KB of it
   unique, using none of the site's tokens and forcing Inter.

   That sheet is below, with its palette and type re-pointed onto ours and the
   homepage's devices added at the end. The class names were deliberately NOT
   renamed: keeping them means not one line of the reviewed markup had to be
   touched, so there is nothing to transcribe wrong.
   ════════════════════════════════════════════════════════════════════════ */
.df{--df-ink:var(--ink);--df-text:var(--ink2);--df-muted:var(--mut);--df-line:var(--line);--df-green:var(--acc);--df-soft:var(--paper);--df-blue:var(--rp);--df-amber:var(--pro);color:var(--ink2);background:transparent;font-family:var(--sans);font-size:15.5px;line-height:1.65;padding-bottom:0}
.df *{box-sizing:border-box}.df a{color:var(--df-green);text-decoration:none}.df a:hover{text-decoration:underline}.df a:focus-visible,.df button:focus-visible,.df input:focus-visible,.df select:focus-visible,.df textarea:focus-visible,.df summary:focus-visible{outline:3px solid var(--acc);outline-offset:4px}.df [hidden]{display:none!important}.df-wrap{max-width:1240px;margin:auto;padding:0 24px}.df h1,.df h2,.df h3,.df p{margin:0}.df h1,.df h2,.df h3{color:var(--ink);font-family:var(--disp);font-weight:800;letter-spacing:-.03em}.df h1{font-size:clamp(30px,3.5vw,46px);line-height:1.12;letter-spacing:-1.5px;font-weight:750;max-width:22ch}.df h2{font-size:24px;line-height:1.25;letter-spacing:-.6px}.df h3{font-size:17px;line-height:1.4;letter-spacing:-.2px}.df p+p{margin-top:10px}.df-nav{display:flex;gap:4px;overflow:auto;padding:14px 0;border-bottom:1px solid var(--df-line);scrollbar-width:thin}.df-nav a{flex-shrink:0;font-size:12px;font-weight:650;padding:9px 11px;border-radius:7px;color:var(--df-muted);white-space:nowrap}.df-nav a[aria-current]{background:#dfede5;color:var(--acc-deep)}.df-nav span{font-size:11px;margin-right:6px;opacity:.7}.df-hero{display:grid;grid-template-columns:minmax(0,1fr) 300px;align-items:center;gap:48px;padding:38px 0 28px}.df-kicker{font-size:11px;letter-spacing:1.7px;text-transform:uppercase;font-weight:750;color:var(--df-green);margin-bottom:10px!important}.df-lead{max-width:66ch;font-size:16px;margin-top:16px!important;line-height:1.7}.df-orient{background:linear-gradient(130deg,#eaf3ed,#f4f7ed);border:1px solid #ccded3;border-radius:14px;padding:22px;border-top:3px solid #719a83}.df-orient h2{font-size:20px;margin:8px 0}.df-orient p{font-size:13px;line-height:1.7}.df-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin-top:20px}.df-actions>a:not(.df-btn){font-size:13px;font-weight:650}.df-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:42px;padding:10px 17px;border:1px solid var(--df-green);border-radius:8px;background:var(--df-green);color:white!important;font-family:inherit;font-size:13px;font-weight:650;line-height:1.4;cursor:pointer;text-decoration:none!important;white-space:nowrap;transition:background .15s,box-shadow .15s}.df-btn:hover{background:var(--acc-deep);box-shadow:0 3px 10px #183b3616}.df-secondary{color:var(--df-green)!important;background:white;border-color:#b8d0c3}.df-secondary:hover{background:#eaf3ed}.df-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));border:1px solid var(--df-line);border-radius:12px;background:white;overflow:hidden;margin:0 0 18px}.df-stat{display:flex;flex-direction:column;gap:4px;padding:16px 20px;border-right:1px solid var(--df-line);color:var(--df-text)!important}.df-stat:last-child{border:0}.df-stat>span{font-size:12px;font-weight:650}.df-stat strong{font-size:28px;line-height:1.2;color:var(--df-ink);letter-spacing:-.8px;font-variant-numeric:tabular-nums}.df-stat small{font-size:11px;color:var(--df-muted)}.df-stat[href]:hover{background:var(--df-soft);text-decoration:none}.df-source{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 20px;font-size:12px;color:var(--df-muted);padding-bottom:22px}.df-jumps{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 20px}.df-jumps a,.df-chip{display:inline-flex;align-items:center;border:1px solid var(--df-line);background:white;border-radius:6px;font-size:12px;padding:5px 10px;color:var(--df-text)}.df-chip{font-size:11px;padding:3px 8px}.df-chip.green{background:#e9f4ee;border-color:#cee3d5;color:var(--acc-deep)}.df-chip.blue{background:#edf3fc;border-color:#d4e1f7;color:var(--rp)}.df-chip.amber{background:#fff5e8;border-color:#e9d5b9;color:#865012}.df-filter{display:flex;flex-wrap:wrap;gap:12px;background:var(--df-soft);padding:18px;border:1px solid var(--df-line);border-radius:12px;margin:14px 0 20px;align-items:end}.df-field{display:flex;flex:1 1 155px;flex-direction:column;gap:5px;font-size:12px;font-weight:650;color:var(--df-ink);min-width:0}.df-search{flex:2 1 240px}.df-field input,.df-field select,.df-field textarea{width:100%;min-height:42px;background:white;border:1px solid #bccfc4;border-radius:6px;padding:9px 11px;font-family:inherit;font-size:14px;line-height:1.5;color:var(--df-ink)}.df-field textarea{resize:vertical}.df-filter-actions{display:flex;align-items:center;gap:14px;font-size:12px}.df-section-head{display:flex;justify-content:space-between;gap:20px;align-items:end;margin:28px 0 14px}.df-section-head .df-kicker{margin-bottom:5px!important}.df-muted,.df-section-head>p{font-size:12px;color:var(--df-muted)}.df-register{display:grid;gap:9px}.df-record{background:white;border:1px solid #ceddd4;border-radius:10px;overflow:hidden;box-shadow:0 2px 4px #163a3010;border-left:3px solid #89ab95}.df-record:nth-child(even){border-left-color:#87a6cb}.df-record:hover{border-color:#9ebaac}.df-record-main{display:grid;grid-template-columns:minmax(240px,2.5fr) repeat(2,minmax(125px,1fr)) auto;gap:20px;align-items:center;padding:17px 18px}.df-company{min-width:0}.df-company h3{font-size:16px;font-weight:750}.df-company h3 a{color:var(--df-ink)}.df-company p{font-size:12px;color:var(--df-muted);margin-top:5px;overflow-wrap:anywhere}.df-cell{display:flex;flex-direction:column;gap:4px;min-width:0}.df-label{font-size:11px;color:var(--df-muted);font-weight:550}.df-cell strong{font-size:14px;color:var(--df-ink);font-weight:650;font-variant-numeric:tabular-nums}.df-cell small{font-size:11px;color:var(--df-muted)}.df-record-cta .df-btn{min-height:36px;padding:7px 12px;font-size:12px}.df-record-more{border-top:1px solid #e7eee9}.df-record-more summary{list-style:none;font-size:11px;color:var(--df-green);padding:7px 18px;background:#f8fbf9;cursor:pointer}.df summary::-webkit-details-marker{display:none}.df-record-more summary:after,.df-expand>summary:after{content:'+';float:right;font-size:17px;line-height:1.1;font-weight:500}.df details[open]>summary:after{content:'−'}.df-detail-body{padding:18px;background:#fafcfb}.df-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 24px;margin:0}.df-facts dt{font-size:11px;color:var(--df-muted)}.df-facts dd{font-size:13px;color:var(--df-ink);margin:4px 0 0;overflow-wrap:anywhere;white-space:pre-line}.df-detail-body .df-actions{margin-top:14px}.df-note{font-size:12px;line-height:1.65;color:var(--df-muted);margin-top:14px!important}.df-access{background:#e8f2ec;border:1px solid #c2d7c8;padding:22px;display:flex;justify-content:space-between;align-items:center;gap:24px;border-radius:10px;margin:20px 0}.df-access p{font-size:13px;margin-top:5px}.df-pagination{display:flex;justify-content:center;align-items:center;gap:20px;margin:24px 0;font-size:13px}.df-empty{border:1px dashed #b4cbbd;border-radius:10px;padding:38px;text-align:center;background:white}.df-empty p{font-size:14px;margin:10px 0 18px}.df-expand{border:1px solid var(--df-line);border-radius:10px;background:white;margin-top:16px;overflow:hidden}.df-expand>summary{list-style:none;padding:19px 22px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px}.df-expand summary b{display:block;font-size:16px;color:var(--df-ink)}.df-expand summary small{display:block;font-size:12px;color:var(--df-muted);margin-top:3px}.df-expand[open]>summary{border-bottom:1px solid var(--df-line);background:#f5f9f6}.df-expand-body{padding:22px}.df-reading{display:grid;grid-template-columns:1fr 1fr;gap:22px 32px}.df-reading h3{font-size:15px;margin-bottom:7px}.df-reading p{font-size:13px;line-height:1.75}.df-reading>p:last-child{grid-column:1/-1}.df-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.df-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.df-table-wrap{overflow:auto;border:1px solid var(--df-line);border-radius:8px;background:white}.df table{border-collapse:collapse;width:100%;font-size:12px;margin:0}.df caption{text-align:left;padding:13px 15px;font-size:14px;font-weight:700;color:var(--df-ink);background:#f5f9f6}.df th,.df td{padding:10px 14px;border-bottom:1px solid #e2eae5;text-align:right;vertical-align:top;font-variant-numeric:tabular-nums}.df th:first-child,.df td:first-child{text-align:left}.df thead th{font-weight:650;font-size:11px;color:var(--df-muted);background:#f8faf8;white-space:nowrap}.df tbody th{font-weight:550;color:var(--df-ink)}.df tbody tr:nth-child(even){background:#f8fbf9}.df tr:last-child>*{border-bottom:0}.df-panel{border:1px solid var(--df-line);border-radius:12px;padding:24px;background:white}.df-panel p{font-size:14px;margin-top:9px}.df-panel .df-actions{margin-top:15px}.df-dot{padding:0 5px;color:#82968c}.df-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.df-alert{padding:13px 17px;border-radius:8px;background:#fff6e9;border:1px solid #e6d5b7;color:#724c1d;font-size:13px;margin:16px 0}.df #desk,.df [id]{scroll-margin-top:110px}
@media(max-width:1000px){.df-hero{gap:26px;grid-template-columns:1fr 265px}.df-record-main{grid-template-columns:minmax(220px,2fr) 1fr 1fr;gap:14px}.df-record-cta{grid-column:1/-1}.df-record-cta .df-btn{min-height:36px}.df-grid{grid-template-columns:1fr}.df-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.df-stat{border-bottom:1px solid var(--df-line)}}
@media(max-width:680px){.df-wrap{padding:0 16px}.df-nav{margin:0 -16px;padding:10px 16px}.df-hero{display:block;padding:26px 0 22px}.df h1{letter-spacing:-1px;font-size:32px}.df-lead{font-size:15px}.df-orient{margin-top:22px;padding:17px}.df-orient h2{font-size:18px}.df-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.df-stat{padding:14px}.df-stat strong{font-size:24px}.df-source{font-size:11px}.df-section-head{display:block}.df-section-head>p{margin-top:8px}.df-record-main{grid-template-columns:1fr 1fr;padding:15px;gap:14px}.df-company{grid-column:1/-1}.df-record-cta{grid-column:1/-1}.df-record-cta .df-btn{width:100%;min-height:40px}.df-facts{grid-template-columns:1fr 1fr;gap:16px}.df-detail-body{padding:16px}.df-reading,.df-grid.two{grid-template-columns:1fr}.df-expand-body{padding:16px}.df-access{display:block;padding:18px}.df-access .df-btn{margin-top:15px}.df-filter{padding:14px}.df-field{flex-basis:140px}.df-search{flex-basis:100%}.df-filter-actions{width:100%}.df-filter-actions .df-btn{flex:1}.df-actions{gap:12px}.df-panel{padding:20px}.df h2{font-size:22px}}
.df-advanced{flex-basis:100%;border-top:1px solid var(--line);padding-top:10px}.df-advanced>summary{list-style:none;cursor:pointer;color:var(--acc);font-size:12px;font-weight:600}.df-advanced>summary:after{content:'+';float:right;font-size:17px}.df-advanced>div{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}.df .df-cell strong,.df .df-company h3{overflow-wrap:anywhere}.df .df-btn{font-family:inherit}.df .df-table-wrap:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.df *{transition:none!important;scroll-behavior:auto!important}}@media print{.df-nav,.df-filter,.df-actions,.df-record-cta,.df-access,.df-pagination{display:none!important}.df{background:white}.df-hero{display:block}.df-record{break-inside:avoid}.df-record-main{grid-template-columns:2fr 1fr 1fr}.df-expand>summary{background:white}}


.df .df-clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.df .df-auction-row{align-items:center}.df-personas{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}.df-personas button{padding:10px 15px;border:1px solid #bfd2c7;background:white;border-radius:7px;color:var(--ink2);font-family:inherit;font-size:13px;font-weight:600;line-height:1.5;cursor:pointer}.df-personas button[aria-pressed=true]{background:var(--acc);color:white;border-color:var(--acc)}.df-route+.df-route{margin-top:20px}.df-journey{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.df-journey .df-panel{border-top:3px solid #82a998;display:flex;flex-direction:column}.df-journey .df-panel:nth-child(2){border-top-color:#839fc6}.df-journey .df-panel:nth-child(3){border-top-color:#c5a477}.df-step{font-size:13px;background:#edf5ef;border:1px solid #cbded0;border-radius:8px;padding:5px 9px;align-self:start;color:var(--acc);margin-bottom:14px}.df-task{display:grid;gap:5px;background:#f5f8f5;border-radius:8px;padding:13px;margin:17px 0;font-size:13px;flex:1}.df-task b{font-size:11px;color:var(--acc)}.df-mini{margin-top:15px;font-size:12px}.df-mini summary{cursor:pointer;color:var(--acc)}.df-mini p{font-size:12px!important}.df-journey .df-btn{align-self:start}@media(max-width:850px){.df-journey{grid-template-columns:1fr}.df-journey .df-panel{padding:20px}.df-personas button{flex:1}}.df .df-revival-hero{grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:40px}.df-profile-map{border:1px solid #bfd4c7;border-radius:14px;overflow:hidden;background:white;box-shadow:0 10px 30px #234b3910}.df-profile-map>.df-kicker{padding:16px 20px;margin:0!important;border-bottom:1px solid var(--line)}.df-verified,.df-stated{padding:19px 22px}.df-verified{background:#edf6ef}.df-verified h2{font-size:21px;margin-top:12px}.df-profile-map p{font-size:13px;line-height:1.7;margin-top:8px}.df-profile-map small{font-size:11px;display:block;margin-top:8px}.df-stated{border-top:1px solid var(--line);background:#fffaf1}.df-stated h3{margin-top:12px}.df-profile-foot{padding:12px 20px;margin:0!important;font-size:11px!important;color:var(--mut)}.df-revival-steps{display:grid;grid-template-columns:repeat(3,1fr);margin:0 0 30px;border:1px solid var(--line);border-radius:12px;background:white}.df-revival-steps>div{padding:19px 22px;border-right:1px solid var(--line)}.df-revival-steps>div:last-child{border:0}.df-revival-steps span{font-size:11px;color:var(--acc);display:block;margin-bottom:8px}.df-revival-steps p{font-size:13px;margin-top:6px}.df-intake-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(240px,1fr);gap:24px;align-items:start}.df-intake-side{display:grid;gap:16px}.df-intake-side ul{padding-left:18px;font-size:13px;margin:13px 0 0}.df-intake-side li+li{margin-top:10px}.df-intake-side blockquote{font-size:12px;margin:14px 0 0;background:#fff6e9;padding:12px;border-left:3px solid #d0aa6d}.df-intake-form fieldset{border:0;padding:0;margin:27px 0}.df-intake-form legend{font-size:15px;font-weight:700;color:var(--ink);border-bottom:1px solid var(--line);padding:0 0 10px;width:100%;margin-bottom:16px}.df-intake-form legend span{font-size:11px;margin-right:8px;color:var(--acc)}.df-intake-form legend small{font-size:11px;font-weight:400;color:var(--mut);margin-left:5px}.df-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.df-form-full{grid-column:1/-1}.df-intake-form small{font-size:11px;font-weight:400;color:var(--mut)}.df-check{display:flex;align-items:start;gap:10px;font-size:12px;line-height:1.7}.df-check input{flex:none;margin:5px 0 0;width:16px;height:16px;accent-color:var(--acc)}.df-intake-form>.df-btn{margin-top:20px}.df-terms-inline{padding:14px;background:#fff8ed;border:1px solid #e6d8bf;border-radius:8px;font-size:12px;margin:20px 0}.df-terms-inline p{font-size:12px;margin-top:5px}.df-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.df-success{background:#eef6f0;padding:20px;border-radius:10px}.df-success p{margin-top:12px}@media(max-width:850px){.df .df-revival-hero{grid-template-columns:1fr}.df-intake-layout{grid-template-columns:1fr}.df-revival-steps{grid-template-columns:1fr}.df-revival-steps>div{border:0;border-bottom:1px solid var(--line)}}@media(max-width:500px){.df-form-grid{grid-template-columns:1fr}.df-intake-form>.df-btn{width:100%}}

/* ════════════════════════════════════════════════════════════════════════════
   df · THE HOMEPAGE IDENTITY, ON TOP OF THE COMPONENT SHEET

   Everything above is the supplied component sheet with its palette and type
   re-pointed. Everything below is what that sheet did not have: the homepage's
   devices. It carried ONE gradient in 11.5KB, which is why the pages it styled
   would not have looked like index.php whatever colours they were given.
   ════════════════════════════════════════════════════════════════════════ */

/* the page column lines up with the nav, like every other page on ui.css */
.df .df-wrap{max-width:var(--maxw,1280px);padding:0 24px}

/* the hero: two radials over a diagonal, the second one warm. Role variants
   so the eight deal-flow pages are tellable apart at a glance. */
.df .df-hero{
  background:
    radial-gradient(ellipse at 88% 10%,#E7F0ED 0,transparent 54%),
    radial-gradient(ellipse at 4% 98%,#FBEAE2 0,transparent 46%),
    linear-gradient(140deg,#FBFCFA,#F2F7F3);
  border-bottom:1px solid var(--line);
  margin-bottom:0;padding-top:44px;padding-bottom:38px;
}
.df.df-live  .df-hero{background:radial-gradient(ellipse at 88% 10%,#DCE8F7 0,transparent 54%),radial-gradient(ellipse at 4% 98%,#FBEAE2 0,transparent 46%),linear-gradient(140deg,#FBFCFE,#EEF4F9)}
.df.df-deal  .df-hero{background:radial-gradient(ellipse at 88% 10%,#F7E3D6 0,transparent 54%),radial-gradient(ellipse at 4% 98%,#E7EFEA 0,transparent 46%),linear-gradient(140deg,#FEFCFA,#F9F1EB)}
.df.df-doc   .df-hero{background:radial-gradient(ellipse at 88% 10%,#F6EAD0 0,transparent 54%),radial-gradient(ellipse at 4% 98%,#E7EFEA 0,transparent 46%),linear-gradient(140deg,#FEFDFA,#F8F4EA)}
.df.df-intel .df-hero{background:radial-gradient(ellipse at 88% 10%,#EDE6F7 0,transparent 54%),radial-gradient(ellipse at 4% 98%,#FBEAE2 0,transparent 46%),linear-gradient(140deg,#FCFBFE,#F4F1FA)}

/* the page's own accent, so records, chips and marks follow the hero */
.df        {--dfc:var(--acc); --dfcs:var(--acc-soft)}
.df.df-live {--dfc:var(--rp);  --dfcs:var(--rp-soft)}
.df.df-deal {--dfc:var(--inv); --dfcs:var(--inv-soft)}
.df.df-doc  {--dfc:var(--pro); --dfcs:var(--pro-soft)}
.df.df-intel{--dfc:var(--val); --dfcs:var(--val-soft)}

.df .df-kicker{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--dfc)}
.df .df-hero h1{font-family:var(--disp);font-weight:800;letter-spacing:-.035em;line-height:1.09}
.df .df-lead{font-size:16.5px;line-height:1.65;color:var(--ink2)}

/* a record sits on its colour's wash rather than on flat white — the
   .vband.flip device from the homepage, at row scale */
.df .df-record{background:linear-gradient(104deg,var(--dfcs) 0%,#fff 62%)}
.df .df-record:hover{border-color:var(--dfc)}
.df .df-panel{background:linear-gradient(104deg,var(--dfcs) 0%,#fff 62%)}

/* buttons take the site's pill shape */
.df .df-btn{border-radius:999px;padding:10px 20px;font-family:var(--sans);font-weight:600;
  background:var(--dfc);border:1px solid var(--dfc);color:#fff}
.df .df-btn:hover{filter:brightness(.9);text-decoration:none;color:#fff}
.df .df-btn.df-secondary{background:#fff;color:var(--ink);border-color:var(--line2)}
.df .df-btn.df-secondary:hover{filter:none;border-color:var(--dfc);color:var(--brand-dk)}

/* figures in the real monospace, so columns of money and dates line up */
.df .df-stat strong,.df .df-stats strong,.df .df-cell strong,.df .df-label{font-variant-numeric:tabular-nums}
.df .df-label{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.df .df-chip{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em}

/* the disclosure summary picks up the page colour */
.df .df-expand[open]>summary{background:var(--dfcs)}
.df .df-expand>summary:hover{color:var(--brand-dk)}

/* the closing/selling surface gets the homepage's three-stop diagonal */
.df .df-note.df-source,.df .df-access{
  background:linear-gradient(150deg,#F7E7DA 0%,#FCF3EB 58%,#FFFDFB 100%);border-color:#EBD8C7}

/* the section head carries the same three-colour rule as the ledge */
.df .df-section-head{position:relative;padding-top:16px}
.df .df-section-head::before{content:'';position:absolute;left:0;top:0;width:96px;height:3px;
  border-radius:2px;background:linear-gradient(90deg,var(--len) 0 33%,var(--ink) 33% 66%,var(--pro) 66%)}

@media(max-width:760px){
  .df .df-wrap{padding:0 16px}
  .df .df-hero{padding-top:30px;padding-bottom:26px}
}
@media print{
  .df .df-nav,.df .df-filter,.df .df-pagination,.df .df-actions{display:none!important}
  .df .df-hero{background:#fff!important}
  .df .df-expand[open]>summary{background:#fff}
}

/* ── df · OPEN SECTION BLOCKS ───────────────────────────────────────────────
   14-Sep, on Hemant's steer: "you folded nearly everything, makes pages feel
   sparse... folding was only for long scrolls in one header/topic/section, not
   every section."

   The supplied pages wrapped every below-register section in a closed
   <details>, so the bottom half of a page rendered as three or four grey bars
   with a + and no content. A section is not a long scroll. Sections now use
   .df-block — the same card, the same heading, permanently open, no summary
   chrome. Folding is kept for exactly three things: the advanced filter drawer,
   the per-record source-detail list (20 rows × 20 fields IS a long scroll), and
   the page's reading note.
   ──────────────────────────────────────────────────────────────────────── */
.df .df-block{border:1px solid var(--df-line);border-radius:10px;background:#fff;
  margin-top:16px;overflow:hidden}
.df .df-block>.df-block-head{padding:19px 22px;border-bottom:1px solid var(--df-line);
  background:var(--dfcs)}
.df .df-block>.df-block-head b{display:block;font-family:var(--disp);font-weight:800;
  letter-spacing:-.02em;font-size:17px;color:var(--ink)}
.df .df-block>.df-block-head small{display:block;font-size:12px;color:var(--mut);margin-top:3px}
@media print{.df .df-block{break-inside:avoid}}

/* ── df · THE RECORD STRIP ──────────────────────────────────────────────────
   A second, denser line on each register row. The row's grid is fixed at
   name + two cells + CTA, so promoted facts go BELOW it rather than fighting
   for a column: label in small caps, value in tabular figures, wrapping
   freely. Only fields that hold a value render, so a thin record stays honest
   instead of printing a line of "Not recorded".
   ──────────────────────────────────────────────────────────────────────── */
.df .df-strip{display:flex;flex-wrap:wrap;gap:6px 22px;padding:11px 18px;
  border-top:1px dashed var(--line);background:linear-gradient(104deg,var(--dfcs) 0%,#fff 70%)}
.df .df-strip span{font-size:12.5px;color:var(--ink2);font-variant-numeric:tabular-nums;
  display:inline-flex;gap:7px;align-items:baseline;min-width:0}
.df .df-strip em{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--mut);font-style:normal;white-space:nowrap}
@media(max-width:760px){.df .df-strip{gap:5px 14px;padding:10px 15px}
  .df .df-strip span{font-size:12px}}

/* ── df · THE CASE LIST ─────────────────────────────────────────────────────
   14-Sep, Hemant: "save this style of showing 6-7 showcase companies".

   Lifted verbatim from the .vd-case-row list on /voluntary, which is the one
   register on the site that reads cleanly. Why it works, and the rule it
   carries: FOUR COLUMNS, EVERY ONE POPULATED ON EVERY ROW. Name, place in
   full, a STATE WORD over its date, one action. No field that is ever "Not
   recorded", no two-letter code, no label naming a column the reader can
   already see. The numbers 01..08 say "a curated shortlist", not "page 1 of
   3,000".

   Use it wherever a page shows a short, hand-picked or top-N set. It is the
   opposite trade to .df-record: that one carries every field we hold, this one
   carries only the four we always hold.
   ──────────────────────────────────────────────────────────────────────── */
.df .df-caselist{list-style:none;padding:0;margin:0;border:1px solid var(--line);
  border-radius:12px;background:#fff;overflow:hidden}
.df .df-caselist>li{margin:0;padding:0;border-bottom:1px solid var(--line)}
.df .df-caselist>li:last-child{border-bottom:0}
.df .df-caselist>li:nth-child(even){background:var(--dfcs)}
.df .df-caserow{display:grid;grid-template-columns:28px minmax(0,1fr) 135px 132px 100px;
  gap:16px;align-items:center;padding:14px 18px;min-height:73px;color:var(--ink);
  border-left:3px solid transparent;text-decoration:none}
.df .df-caserow:hover{background:var(--dfcs);border-left-color:var(--dfc);text-decoration:none}
.df .df-caserow:focus-visible{outline:3px solid #315AC6;outline-offset:-3px}
.df .df-caseno{font:500 11px/1 var(--mono);color:var(--mut);display:grid;place-items:center;
  width:27px;height:27px;border:1px solid var(--line);background:var(--paper);border-radius:7px}
.df h3.df-casename{font:650 17px/1.35 var(--disp);letter-spacing:-.02em;margin:0;overflow-wrap:anywhere}
.df .df-caseplace{font-size:12px;line-height:1.5;color:var(--mut);overflow-wrap:anywhere}
.df .df-casestate{display:block;font-size:11px;line-height:1.5;color:var(--mut)}
.df .df-casestate>span{display:block;font-size:10px}
.df .df-casestate>b{display:block;font-size:12px;font-weight:550;color:var(--ink2)}
.df .df-caseact{display:flex;align-items:center;justify-content:flex-end;gap:7px;
  font-size:12px;font-weight:600;color:var(--acc-deep);white-space:nowrap}
/* the arrow had no size rule of its own, so on phones — where the action
   cell becomes a full-width 1fr column — the SVG grew to fill it. */
.df .df-icon{width:16px;height:16px;flex:0 0 auto}
.df .df-caseact>.df-icon{width:16px;height:16px}
@media(max-width:760px){
  .df .df-caserow{grid-template-columns:28px minmax(0,1fr);gap:4px 14px;padding:13px 15px;min-height:0}
  .df h3.df-casename{grid-column:2}
  .df .df-caseplace,.df .df-casestate,.df .df-caseact{grid-column:2}
  .df .df-caseact{justify-content:flex-start;margin-top:4px}
  .df .df-casestate>span,.df .df-casestate>b{display:inline}
  .df .df-casestate>b{margin-left:6px}
}
.df .df-casemain{min-width:0}
.df .df-casesub{display:block;font-size:12px;line-height:1.5;color:var(--mut);margin-top:2px;
  overflow-wrap:anywhere}
.df .df-caselist .df-record-more{border-top:1px solid var(--line)}
.df .df-caselist .df-record-more summary{padding-left:62px}
@media(max-width:760px){.df .df-caselist .df-record-more summary{padding-left:15px}}

/* ── df · THE INTELLIGENCE LINE ─────────────────────────────────────────────
   Sits between the hero and the headline figures. It is the one place on a
   deal-flow page that says, in the platform's own voice, why this stage is
   worth a reader's time — around figures the page has already computed.
   ──────────────────────────────────────────────────────────────────────── */
.df .df-intel{margin:18px 0 0;padding:17px 20px;border:1px solid var(--line);
  border-left:3px solid var(--dfc);border-radius:10px;
  background:linear-gradient(150deg,#F7E7DA 0%,#FCF3EB 58%,#FFFDFB 100%)}
.df .df-intel .df-kicker{margin:0 0 7px}
.df .df-intel p{margin:0;font-size:14.5px;line-height:1.62;color:var(--ink2);max-width:82ch}
.df .df-intel p + p{margin-top:8px}
.df .df-intel b{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
@media(max-width:760px){.df .df-intel{padding:14px 15px}.df .df-intel p{font-size:14px}}