/* ==========================================================================
   Bank directory — bank-directory.html
   Dark-navy theme. Palette, type, radius and easing come from
   css/elucidate-tokens.css; kicker/display/lead/buttons/mono-label from
   css/elucidate-atoms.css. Everything below is page-local (.bd-*).

   Chart colours (validated with the dataviz palette checker against the
   navy card surface — lightness band, chroma, CVD and contrast all pass):
     series 1  --eh-blue-glow   financial institutions / single-series marks
     series 2  --eh-ember       non-financial corporates
   ========================================================================== */

body.bd-page {
  background: var(--eh-navy);
  color: var(--eh-white);
  font-family: var(--eh-font-body);
  -webkit-font-smoothing: antialiased;

  --bd-series-1: var(--eh-blue-glow);
  --bd-series-2: var(--eh-ember);
  --bd-track: rgba(77,122,255,0.16);   /* lighter step of series 1 — meter track */
  --bd-surface: rgba(255,255,255,0.03);
}

/* ─── Layout primitives ───────────────────────────────────────── */
.bd-container {
  width: min(1200px, 100% - 48px);
  margin-inline: auto;
  position: relative;
  z-index: 1;
}
.bd-section {
  padding: clamp(64px, 7vw, 104px) 0;
  border-top: 1px solid var(--eh-rule);
}
.bd-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

/* ─── Hero ────────────────────────────────────────────────────── */
.bd-hero {
  position: relative;
  padding: clamp(120px, 12vw, 176px) 0 clamp(56px, 6vw, 88px);
  overflow: hidden;
}
.bd-glow {
  position: absolute;
  inset: -20% -10% auto auto;
  width: 70vw;
  height: 70vw;
  max-width: 900px;
  max-height: 900px;
  background: radial-gradient(circle at center, rgba(45,90,255,0.28) 0%, rgba(45,90,255,0) 65%);
  pointer-events: none;
}
.bd-hero .elu-display { max-width: 900px; }
.bd-hero .elu-lead { max-width: 640px; }

/* Search */
.bd-search {
  position: relative;
  max-width: 640px;
  margin-bottom: 48px;
}
.bd-search-label {
  display: block;
  color: var(--eh-white-dim);
  margin-bottom: 10px;
}
.bd-search-box {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 56px;
  padding: 0 18px;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--eh-rule-strong);
  border-radius: var(--eh-radius-md);
  transition: border-color .15s var(--eh-ease), background-color .15s var(--eh-ease);
}
.bd-search-box:focus-within {
  border-color: var(--eh-ember-bright);
  background: rgba(255,255,255,0.08);
}
.bd-search-box svg { width: 18px; height: 18px; color: var(--eh-white-dim); flex-shrink: 0; }
.bd-search-box input {
  flex: 1;
  min-width: 0;
  height: 100%;
  background: transparent;
  border: 0;
  outline: 0;
  color: var(--eh-white);
  font: 500 16px/1 var(--eh-font-body);
}
.bd-search-box input::placeholder { color: var(--eh-white-dim); }
.bd-search-results {
  position: absolute;
  z-index: 20;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: var(--eh-navy-soft);
  border: 1px solid var(--eh-rule-strong);
  border-radius: var(--eh-radius-md);
  box-shadow: 0 24px 48px -12px rgba(0,0,0,0.6);
  max-height: 420px;
  overflow-y: auto;
}
.bd-search-results li {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 16px;
  padding: 10px 12px;
  border-radius: var(--eh-radius-sm);
  cursor: pointer;
}
.bd-search-results li[aria-selected="true"],
.bd-search-results li:hover { background: rgba(255,255,255,0.06); }
.bd-search-results .bd-r-name { font-weight: 600; font-size: 14px; }
.bd-search-results .bd-r-meta { grid-column: 1 / -1; font: 12px/1.4 var(--eh-font-mono); color: var(--eh-white-dim); }
.bd-search-results .bd-r-bic { font: 700 13px/1.4 var(--eh-font-mono); color: var(--eh-blue-light); }
/* OFAC listing flag at the head of a result's meta line (dropdown + results page).
   Warning status → --eh-ember-bright (STYLE.md role map). */
.bd-ofac-flag { display: inline-flex; align-items: center; gap: 6px; color: var(--eh-ember-bright); font-weight: 700; }
.bd-ofac-flag .bk-dot { width: 6px; height: 6px; }
.bd-search-results .bd-r-empty { color: var(--eh-white-dim); cursor: default; }

/* KPI row — stat tiles */
.bd-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  background: var(--eh-rule);
  border: 1px solid var(--eh-rule);
  border-radius: var(--eh-radius-lg);
  overflow: hidden;
}
.bd-kpi {
  background: var(--eh-navy);
  padding: 24px 22px;
}
.bd-kpi-value {
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1;
  margin-bottom: 10px;
}
.bd-kpi-label { color: var(--eh-white-dim); }
.bd-kpi-note { margin-top: 6px; font-size: 13px; color: var(--eh-white-muted); }
.bd-source { margin-top: 18px; color: var(--eh-white-dim); }

/* ─── Section intro ───────────────────────────────────────────── */
.bd-section-intro {
  display: grid;
  grid-template-columns: 96px minmax(0, 720px);
  gap: 24px;
  margin-bottom: 40px;
}
.bd-num {
  font: 400 14px/1 var(--eh-font-mono);
  color: var(--eh-white-dim);
  padding-top: 6px;
}
.bd-section-intro .elu-kicker { margin-bottom: 16px; }
.bd-h2 {
  font-family: var(--eh-font-body);
  font-size: clamp(28px, 3.4vw, 44px);
  font-weight: 300;
  line-height: 1.08;
  letter-spacing: -0.02em;
  margin: 0 0 16px;
  color: var(--eh-white);
}
.bd-h2 em {
  font-family: var(--eh-font-serif);
  font-style: italic;
  font-weight: 500;
  color: var(--eh-ember-bright);
}
.bd-intro-text {
  font-size: 16px;
  line-height: 1.6;
  color: var(--eh-white-muted);
  margin: 0;
}
.bd-intro-text code {
  font-family: var(--eh-font-mono);
  font-size: 0.9em;
  padding: 1px 6px;
  border-radius: var(--eh-radius-sm);
  background: rgba(255,255,255,0.08);
  color: var(--eh-white);
}

/* ─── Chart cards ─────────────────────────────────────────────── */
.bd-card {
  margin: 0;
  text-align: left;
  padding: 28px;
  background: var(--bd-surface);
  border: 1px solid var(--eh-rule);
  border-radius: var(--eh-radius-lg);
  min-width: 0;
}
.bd-card-head { margin-bottom: 20px; text-align: left; }
.bd-card-title {
  font-size: 17px;
  font-weight: 600;
  margin: 0 0 4px;
  color: var(--eh-white);
}
.bd-card-sub { margin: 0; font-size: 13px; color: var(--eh-white-dim); }
.bd-chart { position: relative; min-height: 120px; transition: opacity .15s var(--eh-ease); }
.bd-chart.is-loading { opacity: 0.4; }

/* Legend */
.bd-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
  font-size: 13px;
  color: var(--eh-white-muted);
}
.bd-legend li { display: inline-flex; align-items: center; gap: 8px; }
.bd-swatch { width: 10px; height: 10px; border-radius: 2px; flex-shrink: 0; }

/* SVG column charts */
.bd-svg { display: block; width: 100%; height: auto; overflow: visible; }
.bd-svg .bd-grid-line { stroke: var(--eh-rule); stroke-width: 1; shape-rendering: crispEdges; }
.bd-svg .bd-axis-text {
  fill: var(--eh-white-dim);
  font: 11px var(--eh-font-mono);
  font-variant-numeric: tabular-nums;
}
.bd-svg .bd-direct-label { fill: var(--eh-white-muted); font: 600 12px var(--eh-font-body); }
.bd-svg .bd-hit { fill: transparent; cursor: default; outline: none; }
.bd-svg .bd-hit:hover,
.bd-svg .bd-hit:focus-visible { fill: rgba(255,255,255,0.05); }
.bd-svg .bd-crosshair { stroke: var(--eh-white-faint); stroke-width: 1; pointer-events: none; }

/* HTML horizontal bars */
.bd-bars { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.bd-bar-row {
  display: grid;
  grid-template-columns: minmax(96px, 34%) minmax(0, 1fr) 64px;
  align-items: center;
  gap: 12px;
  padding: 4px 6px;
  margin: 0 -6px;
  border-radius: var(--eh-radius-sm);
  font-size: 13px;
  outline: none;
  transition: background-color .15s var(--eh-ease);
}
.bd-bar-row:hover,
.bd-bar-row:focus-visible { background: rgba(255,255,255,0.05); }
.bd-bar-row.is-clickable { cursor: pointer; }
.bd-bar-label {
  display: block;
  color: var(--eh-white-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bd-bar-label small { font-family: var(--eh-font-mono); color: var(--eh-white-dim); margin-left: 6px; }
.bd-bar-track { display: block; height: 14px; border-radius: 0 4px 4px 0; }
.bd-bar-track.is-meter { background: var(--bd-track); border-radius: 4px; }
.bd-bar-fill {
  display: block;
  height: 100%;
  min-width: 2px;
  background: var(--bd-series-1);
  border-radius: 0 4px 4px 0;
  transform-origin: left center;
  animation: bd-grow .5s var(--eh-ease) both;
}
.bd-bar-track.is-meter .bd-bar-fill { border-radius: 4px; }
.bd-bar-value {
  text-align: right;
  font: 12px var(--eh-font-mono);
  color: var(--eh-white);
  font-variant-numeric: tabular-nums;
}
@keyframes bd-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* Table view — every chart's WCAG-clean twin */
.bd-table-view { margin-top: 18px; border-top: 1px solid var(--eh-rule); padding-top: 12px; }
.bd-table-view summary {
  cursor: pointer;
  font: 12px var(--eh-font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--eh-white-dim);
  transition: color .15s var(--eh-ease);
}
.bd-table-view summary:hover { color: var(--eh-white); }
.bd-table-view .bd-mini-table { margin-top: 12px; max-height: 280px; overflow: auto; }
.bd-mini-table table { width: 100%; border-collapse: collapse; font-size: 13px; }
.bd-mini-table th,
.bd-mini-table td {
  text-align: left;
  padding: 6px 8px;
  border-bottom: 1px solid var(--eh-rule);
  font-variant-numeric: tabular-nums;
}
.bd-mini-table th { font: 11px var(--eh-font-mono); color: var(--eh-white-dim); text-transform: uppercase; letter-spacing: 0.08em; }
/* Cells set their own colour: chart cards are <figure>s, and the legacy site CSS
   (elucidate.website.css `figure { color: #111827 }`) would make them near-black. */
.bd-mini-table td { color: var(--eh-white-muted); }
/* Row headers (<th scope="row">) read as the row's name, not as a column label. */
.bd-mini-table tbody th { font: 500 13px var(--eh-font-body); color: var(--eh-white); text-transform: none; letter-spacing: normal; }
/* Links in a table cell: undo the legacy link rule (Barlow, blue), as .bk-fact dd a. */
.bd-mini-table a {
  font: inherit;
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid var(--eh-white-faint);
  transition: border-color .15s var(--eh-ease);
}
.bd-mini-table a:hover,
.bd-mini-table a:focus-visible { color: inherit; text-decoration: none; border-color: var(--eh-ember-bright); }
.bd-mini-table td.is-num,
.bd-mini-table th.is-num { text-align: right; }

/* Tooltip */
.bd-tooltip {
  position: fixed;
  z-index: 50;
  pointer-events: none;
  min-width: 140px;
  padding: 10px 12px;
  background: var(--eh-navy-soft);
  border: 1px solid var(--eh-rule-strong);
  border-radius: var(--eh-radius-sm);
  box-shadow: 0 12px 32px -8px rgba(0,0,0,0.6);
  font-size: 13px;
  color: var(--eh-white-muted);
}
.bd-tooltip .bd-tt-title { font: 11px var(--eh-font-mono); color: var(--eh-white-dim); margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.08em; }
.bd-tooltip .bd-tt-row { display: flex; align-items: center; gap: 8px; }
.bd-tooltip .bd-tt-key { width: 12px; height: 2px; border-radius: 1px; flex-shrink: 0; }
.bd-tooltip .bd-tt-row strong { color: var(--eh-white); font-weight: 700; font-variant-numeric: tabular-nums; }

/* ─── Explorer ────────────────────────────────────────────────── */
.bd-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 16px;
  margin-bottom: 20px;
}
.bd-field { display: grid; gap: 8px; min-width: 180px; }
.bd-field.is-grow { flex: 1; min-width: 220px; }
.bd-field .elu-mono-label { color: var(--eh-white-dim); }
.bd-field select,
.bd-field input {
  height: 52px;
  padding: 0 14px;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--eh-rule-strong);
  border-radius: var(--eh-radius-md);
  color: var(--eh-white);
  font: 500 15px var(--eh-font-body);
  outline: none;
  transition: border-color .15s var(--eh-ease);
}
.bd-field select option { background: var(--eh-navy); color: var(--eh-white); }
.bd-field select:focus,
.bd-field input:focus { border-color: var(--eh-ember-bright); }
.bd-download { height: 52px; }

.bd-country-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.bd-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid var(--eh-rule);
  border-radius: var(--eh-radius-pill);
  font-size: 13px;
  color: var(--eh-white-muted);
}
.bd-chip strong { color: var(--eh-white); font-weight: 700; }

.bd-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--eh-rule);
  border-radius: var(--eh-radius-lg);
  background: var(--bd-surface);
}
.bd-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 980px; }
.bd-table th {
  position: sticky;
  top: 0;
  text-align: left;
  padding: 14px 16px;
  font: 11px var(--eh-font-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--eh-white-dim);
  background: var(--eh-navy);
  border-bottom: 1px solid var(--eh-rule-strong);
}
.bd-table td {
  padding: 12px 16px;
  border-bottom: 1px solid var(--eh-rule);
  vertical-align: top;
  color: var(--eh-white-muted);
  line-height: 1.45;
}
.bd-table tr:last-child td { border-bottom: 0; }
.bd-table tbody tr { transition: background-color .15s var(--eh-ease); }
.bd-table tbody tr:hover { background: rgba(255,255,255,0.03); }
.bd-table tbody tr.is-highlight { background: rgba(77,122,255,0.12); }
.bd-table .bd-bic { font: 700 12px var(--eh-font-mono); color: var(--eh-blue-light); white-space: nowrap; }
.bd-table .bd-name { color: var(--eh-white); font-weight: 600; min-width: 200px; }
.bd-table .bd-lei-name { display: block; font-weight: 400; font-size: 12px; color: var(--eh-white-dim); margin-top: 2px; }
.bd-table .bd-addr { min-width: 220px; font-size: 12px; }
.bd-table .bd-date { font: 12px var(--eh-font-mono); white-space: nowrap; font-variant-numeric: tabular-nums; }
.bd-table .bd-empty { text-align: center; padding: 48px 16px; color: var(--eh-white-dim); }
.bd-table a {
  font: 12px var(--eh-font-mono);
  color: var(--eh-white);
  text-decoration: none;
  border-bottom: 1px solid var(--eh-white-faint);
  transition: border-color .15s var(--eh-ease);
  white-space: nowrap;
}
.bd-table a:hover { border-color: var(--eh-ember-bright); }
.bd-tag {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--eh-radius-xs);
  font: 11px var(--eh-font-mono);
  border: 1px solid var(--eh-rule-strong);
  white-space: nowrap;
}
.bd-tag.is-fin { color: var(--eh-blue-light); }
.bd-tag.is-nfin { color: var(--eh-ember-bright); }

.bd-pager {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-top: 16px;
}
.bd-pager .elu-mono-label { color: var(--eh-white-dim); }
.bd-pager-btns { display: flex; gap: 8px; }
.bd-page-btn {
  height: 40px;
  padding: 0 16px;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--eh-rule-strong);
  border-radius: var(--eh-radius-md);
  color: var(--eh-white);
  font: 600 13px var(--eh-font-body);
  cursor: pointer;
  transition: background-color .15s var(--eh-ease);
}
.bd-page-btn:hover:not(:disabled) { background: rgba(255,255,255,0.1); }
.bd-page-btn:disabled { opacity: 0.35; cursor: default; }

/* ─── Outro ───────────────────────────────────────────────────── */
.bd-outro-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 64px;
  align-items: start;
}
/* Sources & method footer: a short lead + link to the Methodology page, then
   only this page's own credits (netlify/lib/directory-methodology.mjs). */
.bd-sources-lead { margin: 0; font-size: 15px; line-height: 1.6; color: var(--eh-white-muted); }
.bd-sources-lead + .bd-sources-lead { margin-top: 12px; }
.bd-outro .bk-more { margin-top: 16px; }
.bd-sources-label { margin: 36px 0 16px; color: var(--eh-white-dim); }
.bd-sources { margin: 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.bd-sources li { font-size: 14px; line-height: 1.6; color: var(--eh-white-muted); padding-left: 16px; border-left: 1px solid var(--eh-rule-strong); }
.bd-sources strong { color: var(--eh-white); font-weight: 600; }
.bd-cta .bd-intro-text { margin-bottom: 28px; }

/* ─── Trademark notice — above the site footer, directory + /bank/* ─ */
.bd-legal {
  border-top: 1px solid var(--eh-rule);
  padding: 28px 0;
}
.bd-legal p {
  margin-block: 0;
  font-size: 12px;
  line-height: 1.6;
  color: var(--eh-white-dim);
}

/* ─── Responsive ──────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .bd-grid { grid-template-columns: minmax(0, 1fr); }
  .bd-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bd-outro-grid { grid-template-columns: minmax(0, 1fr); gap: 48px; }
}
@media (max-width: 640px) {
  .bd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bd-section-intro { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .bd-card { padding: 20px; }
  .bd-bar-row { grid-template-columns: minmax(80px, 38%) minmax(0, 1fr) 56px; }
}
@media (prefers-reduced-motion: reduce) {
  .bd-bar-fill { animation: none; }
  .bd-search-box, .bd-bar-row, .bd-table tbody tr, .bd-chart, .bd-page-btn { transition: none; }
}

/* ==========================================================================
   Bank pages — /bank/* (netlify/functions/bank.mjs → netlify/lib/bank-render.mjs)
   Same navy theme; .bk-* is page-specific, everything else reuses .bd-*.
   ========================================================================== */

.bk-hero {
  position: relative;
  padding: clamp(112px, 11vw, 152px) 0 clamp(40px, 5vw, 64px);
  overflow: hidden;
}
.bk-crumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 28px;
  padding: 0;
  list-style: none;
  color: var(--eh-white-dim);
}
.bk-crumbs li + li::before { content: '/'; margin-right: 8px; color: var(--eh-white-faint); }
.bk-crumbs a { color: var(--eh-white-muted); text-decoration: none; transition: color .15s var(--eh-ease); }
.bk-crumbs a:hover { color: var(--eh-white); }
.bk-crumbs [aria-current] { color: var(--eh-white); }

.bk-search { position: relative; max-width: 640px; margin-bottom: 56px; }
.bk-search-go {
  height: 36px;
  padding: 0 14px;
  border: 1px solid var(--eh-rule-strong);
  border-radius: var(--eh-radius-sm);
  background: rgba(255,255,255,0.06);
  color: var(--eh-white);
  font: 600 13px var(--eh-font-body);
  cursor: pointer;
  transition: background-color .15s var(--eh-ease);
}
.bk-search-go:hover { background: rgba(255,255,255,0.12); }

.bk-title {
  font-family: var(--eh-font-body);
  font-size: clamp(34px, 4.6vw, 60px);
  font-weight: 300;
  line-height: 1.05;
  letter-spacing: -0.025em;
  margin: 0 0 16px;
  max-width: 980px;
  color: var(--eh-white);
}
.bk-title em {
  font-family: var(--eh-font-serif);
  font-style: italic;
  font-weight: 500;
  color: var(--eh-ember-bright);
}
.bk-lead { max-width: 640px; margin-bottom: 32px; }
.bk-legal { display: grid; gap: 6px; margin: 4px 0 24px; }
.bk-legal-label { color: var(--eh-white-dim); }
.bk-legal-name {
  justify-self: start;          /* hug the text so RTL names sit left like the title */
  font-size: clamp(20px, 2.2vw, 28px);
  font-weight: 400;
  line-height: 1.3;
  color: var(--eh-white);
}

.bk-idbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 28px; }
.bk-id {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  padding: 10px 16px;
  border: 1px solid var(--eh-rule-strong);
  border-radius: var(--eh-radius-md);
  background: rgba(255,255,255,0.04);
}
.bk-id .elu-mono-label { color: var(--eh-white-dim); }
.bk-id strong { font: 700 16px var(--eh-font-mono); letter-spacing: 0.04em; color: var(--eh-white); }
.bk-id a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.bk-id a:hover { border-color: var(--eh-ember-bright); }
.bk-dot { width: 8px; height: 8px; border-radius: 50%; align-self: center; background: var(--eh-white-dim); }
.bk-dot.is-mint { background: var(--eh-mint); }
.bk-dot.is-cyan { background: var(--eh-cyan); }
/* Warning status (STYLE.md role map: warning = --eh-ember-bright) — OFAC listings. */
.bk-dot.is-ember { background: var(--eh-ember-bright); }
.bd-chip.is-ember {
  /* It's an <a> (jumps to #sanctions): undo the legacy Webflow link rule's font + margin. */
  margin: 0;
  font-family: inherit;
  font-weight: 400;
  align-items: center;
  border-color: var(--eh-ember-bright);
  color: var(--eh-white);
  text-decoration: none;
  transition: background-color .15s var(--eh-ease);
}
.bd-chip.is-ember:hover { background: color-mix(in srgb, var(--eh-ember-bright) 12%, transparent); }
.bk-sanctions { border-color: var(--eh-ember-bright); }
.bk-sanctions .bd-card-title { display: flex; align-items: center; gap: 10px; }
.bk-sanctions .bk-facts + .bk-facts { margin-top: 24px; }
.bk-sanctions-head { margin-top: 24px; }
.bk-sanctions-head h3 { margin: 0; color: var(--eh-ember-bright); }
.bk-country-level { display: block; margin-bottom: 6px; }
.bk-country-programs { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; font-size: 14px; color: var(--eh-white-muted); }
.bk-country-programs .bk-asof { margin-left: 4px; }
.bk-fact dd a[href="#sanctions"] { color: var(--eh-ember-bright); }
.bk-asof { font-family: var(--eh-font-mono); font-size: 12px; color: var(--eh-white-dim); margin-left: 6px; }
/* Compact tables inside a card (market identifiers, payment schemes, national bank
   codes) — a bd-table without the wrap border / sticky navy head. */
.bk-compact-wrap { margin-top: 16px; overflow-x: auto; }
.bk-compact-table { min-width: 640px; }
.bk-compact-table th { position: static; padding-left: 0; background: none; }
.bk-compact-table td { padding-left: 0; }
.bk-compact-table tr.is-segment .bd-bic { padding-left: 16px; color: var(--eh-white-muted); }
/* Sub-blocks inside a card (regulatory status, bank-code schemes) — the sanctions sub-head, neutral. */
.bk-subhead { margin-top: 24px; }
.bk-subhead h3 { margin: 0; color: var(--eh-white-muted); }
.bk-note { margin: 16px 0 0; font-size: 13px; line-height: 1.5; color: var(--eh-white-dim); }
/* ISO 20022 identification (#iso20022): the <FinInstnId> block, a deep-navy code frame (for-agents' .agents-code, card-sized). */
.bk-iso-xml { margin: 16px 0 0; padding: 18px 20px; background: var(--eh-navy-deep); border: 1px solid var(--eh-rule); border-radius: var(--eh-radius-sm); overflow-x: auto; }
.bk-iso-xml code { font: 13px/1.7 var(--eh-font-mono); color: var(--eh-white-muted); white-space: pre; background: none; padding: 0; }
.bk-iso-issues { margin: 16px 0 0; padding-left: 18px; font-size: 13px; line-height: 1.5; color: var(--eh-white-dim); }
.bk-iso-issues li + li { margin-top: 6px; }
/* A chip that jumps to its card — undo the legacy Webflow link rule, like .bd-chip.is-ember. */
.bd-chip.is-link {
  margin: 0;
  font-family: inherit;
  font-weight: 400;
  align-items: center;
  color: var(--eh-white-muted);
  text-decoration: none;
  transition: border-color .15s var(--eh-ease);
}
.bd-chip.is-link:hover { border-color: var(--eh-rule-strong); color: var(--eh-white); }
@media (prefers-reduced-motion: reduce) { .bd-chip.is-link { transition: none; } }
.bk-mic-op { font-family: var(--eh-font-mono); font-size: 12px; color: var(--eh-white); }

/* Facts */
.bk-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.bk-span-2 { grid-column: 1 / -1; }
.bk-facts { margin: 16px 0 0; display: grid; gap: 0; }
.bk-facts-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
.bk-fact { padding: 14px 0; border-top: 1px solid var(--eh-rule); }
.bk-fact dt { color: var(--eh-white-dim); margin-bottom: 6px; }
.bk-fact dd { margin: 0; font-size: 15px; line-height: 1.5; color: var(--eh-white); overflow-wrap: anywhere; }
.bk-fact dd.is-mono { font-family: var(--eh-font-mono); font-size: 14px; letter-spacing: 0.02em; }
.bk-fact dd a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.bk-fact dd a:hover { border-color: var(--eh-ember-bright); }

/* Network section: graph, correspondent accounts, branch codes */
.bk-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px 32px;
  margin-bottom: 24px;
}
.bk-section-head .bd-h2 { margin: 0; }
/* Sub-heading inside a section (Network → Branch codes), filter alongside. */
.bk-section-head.is-compact { margin: 40px 0 16px; }
.bk-section-head.is-compact .bd-card-title { margin: 0; }
.bk-network-card { margin: 0 0 24px; }
.bk-branch-filter { max-width: 360px; }
.bk-branches { min-width: 860px; }
.bk-branches tr { scroll-margin-top: 120px; }
.bd-table .bk-anchor { font: 700 12px var(--eh-font-mono); color: var(--eh-blue-light); border: 0; }
.bd-table .bd-bic a { font: 700 12px var(--eh-font-mono); color: var(--eh-blue-light); border: 0; }
.bd-table .bd-bic a:hover { color: var(--eh-white); }
.bk-branch-count { margin-top: 12px; color: var(--eh-white-dim); }

/* Network graph (SVG from netlify/lib/bank-render.mjs → networkGraph):
   head office hub → group joints (labelled) → branch nodes; correspondent
   accounts on the other side (.is-cyan): rings for the bank's accounts at
   other banks, discs (data-dir="in") for other banks' accounts here. */
.bk-graph { margin: 0 0 24px; }
.bk-graph-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin-bottom: 8px; }
.bk-graph-head .bd-card-title { margin: 0; }
.bk-graph-tabs { display: flex; align-items: center; gap: 6px; }
.bk-graph-tabs[hidden] { display: none; }
.bk-graph-tabs .elu-mono-label { margin-right: 6px; color: var(--eh-white-dim); }
.bk-graph-tab {
  padding: 6px 12px;
  border: 1px solid var(--eh-rule);
  border-radius: var(--eh-radius-pill);
  background: transparent;
  font: 12px var(--eh-font-mono);
  color: var(--eh-white-muted);
  cursor: pointer;
  transition: border-color .15s var(--eh-ease), color .15s var(--eh-ease), background-color .15s var(--eh-ease);
}
.bk-graph-tab:hover { color: var(--eh-white); border-color: var(--eh-rule-strong); }
.bk-graph-tab[aria-selected="true"] { color: var(--eh-white); border-color: var(--eh-blue-light); background: var(--bd-surface); }
.bk-graph-tab:focus-visible { outline: 2px solid var(--eh-ember-bright); outline-offset: 2px; }
.bk-graph-summary { margin: 0 0 8px; max-width: 72ch; }
.bk-graph-svg { display: block; max-width: 100%; height: auto; margin: 0 auto; overflow: visible; }

.bk-graph-spoke { stroke: var(--eh-white-dim); stroke-linecap: round; transition: opacity .15s var(--eh-ease), stroke .15s var(--eh-ease); }
.bk-graph-edge { stroke: var(--eh-white-faint); stroke-width: 1px; transition: opacity .15s var(--eh-ease), stroke .15s var(--eh-ease); }
.bk-graph-joint { fill: var(--eh-white-dim); transition: opacity .15s var(--eh-ease); }

.bk-graph-hub circle { fill: var(--eh-white); stroke: var(--eh-blue-light); stroke-width: 3px; }
.bk-graph-hub text { font: 700 11px var(--eh-font-mono); letter-spacing: 0.06em; fill: var(--eh-navy); text-anchor: middle; }

.bk-graph-label {
  font: 600 13px var(--eh-font-body);
  fill: var(--eh-white);
  paint-order: stroke;
  stroke: var(--eh-navy);
  stroke-width: 4px;
  stroke-linejoin: round;
  cursor: default;
  transition: opacity .15s var(--eh-ease);
}
.bk-graph-label.is-other,
.bk-graph-label.is-unknown { font-weight: 400; fill: var(--eh-white-muted); font-style: italic; }
.bk-graph-count { font: 400 11px var(--eh-font-mono); fill: var(--eh-white-dim); font-style: normal; }

.bk-graph-node { cursor: pointer; outline: none; text-decoration: none; }
.bk-graph-node circle {
  fill: var(--eh-navy-mid);
  stroke: var(--eh-blue-light);
  stroke-width: 1.5px;
  transition: fill .15s var(--eh-ease), stroke .15s var(--eh-ease), opacity .15s var(--eh-ease);
}
.bk-graph-node text {
  font: 700 10px var(--eh-font-mono);
  letter-spacing: 0.04em;
  fill: var(--eh-white);
  text-anchor: middle;
  pointer-events: none;
  transition: opacity .15s var(--eh-ease);
}
/* Dense networks: dots; a branch's code shows only while it is lit. */
.bk-graph-nodes.is-dense circle { fill: var(--eh-blue-light); stroke: var(--eh-navy); stroke-width: 1.5px; }
.bk-graph-nodes.is-dense text { opacity: 0; paint-order: stroke; stroke: var(--eh-navy); stroke-width: 3px; stroke-linejoin: round; }
.bk-graph-nodes.is-dense .bk-graph-node:hover circle { stroke: var(--eh-white); }

/* Hover / focus: the branch (or group) and its path to the hub stay lit. */
.bk-graph-view.is-active .bk-graph-edge,
.bk-graph-view.is-active .bk-graph-spoke,
.bk-graph-view.is-active .bk-graph-joint,
.bk-graph-view.is-active .bk-graph-label,
.bk-graph-view.is-active .bk-graph-node circle { opacity: 0.2; }
.bk-graph-view.is-active .bk-graph-node text { opacity: 0.2; }
.bk-graph-view.is-active .bk-graph-nodes.is-dense .bk-graph-node text { opacity: 0; }
.bk-graph-view.is-active .is-on,
.bk-graph-view.is-active .bk-graph-node.is-on circle,
.bk-graph-view.is-active .bk-graph-node.is-on text,
.bk-graph-view.is-active .bk-graph-nodes.is-dense .bk-graph-node.is-focus text { opacity: 1; }
.bk-graph-view.is-active .bk-graph-edge.is-on,
.bk-graph-view.is-active .bk-graph-spoke.is-on { stroke: var(--eh-blue-light); }
.bk-graph-node:focus-visible circle { fill: var(--eh-blue-light); stroke: var(--eh-white); stroke-width: 2.5px; }

/* Accounts at other banks: cyan rings on dashed links. Own offices stay blue. */
.bk-graph-spoke.is-cyan,
.bk-graph-edge.is-cyan { stroke-dasharray: 3 4; }
.bk-graph-node.is-cyan circle { stroke: var(--eh-cyan); }
.bk-graph-nodes.is-dense .bk-graph-node.is-cyan circle { fill: var(--eh-navy); stroke: var(--eh-cyan); }
.bk-graph-nodes.is-dense .bk-graph-node.is-cyan:hover circle { stroke: var(--eh-white); }
.bk-graph-view.is-active .bk-graph-edge.is-cyan.is-on,
.bk-graph-view.is-active .bk-graph-spoke.is-cyan.is-on { stroke: var(--eh-cyan); }
.bk-graph-node.is-cyan:focus-visible circle { fill: var(--eh-cyan); }
/* Respondents (other banks' accounts held here): the same cyan, filled. */
.bk-graph-node.is-cyan[data-dir="in"] circle,
.bk-graph-nodes.is-dense .bk-graph-node.is-cyan[data-dir="in"] circle { fill: var(--eh-cyan); stroke: var(--eh-cyan); }
.bk-graph-node.is-cyan[data-dir="in"] text { fill: var(--eh-navy); }
.bk-graph-nodes.is-dense .bk-graph-node.is-cyan[data-dir="in"] text { fill: var(--eh-white); }
.bk-graph-node.is-cyan[data-dir="in"]:focus-visible circle { stroke: var(--eh-white); }

/* A branch network too big to draw: its branches stacked into one counted node, linking to the table. */
.bk-graph-node.is-stacked circle,
.bk-graph-nodes.is-dense .bk-graph-node.is-stacked circle { fill: var(--eh-navy-mid); stroke: var(--eh-blue-light); stroke-width: 2px; }
.bk-graph-node.is-stacked text,
.bk-graph-nodes.is-dense .bk-graph-node.is-stacked text { opacity: 1; font-size: 12px; stroke: none; }
.bk-graph-view.is-active .bk-graph-nodes.is-dense .bk-graph-node.is-stacked text { opacity: 0.2; }
.bk-graph-view.is-active .bk-graph-nodes.is-dense .bk-graph-node.is-stacked.is-on text { opacity: 1; }

.bk-graph-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 16px 0 0; padding: 0; list-style: none; font-size: 13px; color: var(--eh-white-muted); }
.bk-graph-legend li { display: flex; align-items: center; gap: 8px; }
.bk-graph-key { width: 10px; height: 10px; border-radius: 50%; background: var(--eh-blue-light); }
.bk-graph-key.is-cyan { background: var(--eh-navy); box-shadow: inset 0 0 0 2px var(--eh-cyan); }
.bk-graph-key.is-cyan[data-dir="in"] { background: var(--eh-cyan); }

.bk-graph-info { margin: 12px 0 0; min-height: 1.6em; color: var(--eh-white-muted); text-transform: none; letter-spacing: 0.04em; }
.bk-city { white-space: nowrap; color: var(--eh-white); }
@media (prefers-reduced-motion: reduce) {
  .bk-graph-tab, .bk-graph-spoke, .bk-graph-edge, .bk-graph-joint, .bk-graph-label,
  .bk-graph-node circle, .bk-graph-node text { transition: none; }
}

/* Branch page: the network round one branch (bank-render.mjs → branchEgo) */
.bk-ego-edge { stroke: var(--eh-white-faint); stroke-linecap: round; transition: stroke .15s var(--eh-ease), opacity .15s var(--eh-ease); }
.bk-ego-edge.is-hq { stroke: var(--eh-white-dim); stroke-width: 3px; }
.bk-ego-hq, .bk-ego-node { cursor: pointer; text-decoration: none; outline: none; }
.bk-ego-hq circle { fill: var(--eh-white); stroke: var(--eh-blue-light); stroke-width: 3px; }
.bk-ego-hq > text:not(.bk-ego-name) { font: 700 11px var(--eh-font-mono); fill: var(--eh-navy); text-anchor: middle; }
.bk-ego-self circle { fill: var(--eh-blue-light); stroke: var(--eh-white); stroke-width: 3px; }
.bk-ego-self text { font: 700 13px var(--eh-font-mono); letter-spacing: 0.04em; fill: var(--eh-navy); text-anchor: middle; }
.bk-ego-node circle { fill: var(--eh-navy-mid); stroke: var(--eh-blue-light); stroke-width: 1.5px; transition: fill .15s var(--eh-ease), stroke .15s var(--eh-ease); }
.bk-ego-code { font: 700 10px var(--eh-font-mono); letter-spacing: 0.04em; fill: var(--eh-white); text-anchor: middle; pointer-events: none; }
.bk-ego-name { font: 500 12px var(--eh-font-body); fill: var(--eh-white-muted); paint-order: stroke; stroke: var(--eh-navy); stroke-width: 4px; stroke-linejoin: round; transition: fill .15s var(--eh-ease); }
.bk-ego-node:hover circle, .bk-ego-node:focus-visible circle,
.bk-ego-hq:hover circle, .bk-ego-hq:focus-visible circle { stroke: var(--eh-white); stroke-width: 2.5px; }
.bk-ego-node:hover .bk-ego-name, .bk-ego-node:focus-visible .bk-ego-name,
.bk-ego-hq:hover .bk-ego-name, .bk-ego-hq:focus-visible .bk-ego-name { fill: var(--eh-white); }
.bk-ego-edge.is-on { stroke: var(--eh-blue-light); }
.bk-reason {
  display: inline-block;
  margin: 0 6px 4px 0;
  padding: 2px 8px;
  border: 1px solid var(--eh-rule);
  border-radius: var(--eh-radius-pill);
  font: 11px var(--eh-font-mono);
  color: var(--eh-white-muted);
  white-space: nowrap;
}
.bk-related-branches { min-width: 720px; }
@media (prefers-reduced-motion: reduce) {
  .bk-ego-edge, .bk-ego-node circle, .bk-ego-name { transition: none; }
}

/* Result lists (search page + related) */
.bk-results { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.bk-result {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 16px;
  padding: 16px 18px;
  border: 1px solid var(--eh-rule);
  border-radius: var(--eh-radius-md);
  background: var(--bd-surface);
  text-decoration: none;
  transition: border-color .15s var(--eh-ease), background-color .15s var(--eh-ease);
}
.bk-result:hover,
.bk-result:focus-visible { border-color: var(--eh-rule-strong); background: rgba(255,255,255,0.06); }
.bk-result-name { font-weight: 600; font-size: 15px; color: var(--eh-white); }
.bk-result-bic { font: 700 13px var(--eh-font-mono); color: var(--eh-blue-light); }
.bk-result-meta { grid-column: 1 / -1; font: 12px/1.5 var(--eh-font-mono); color: var(--eh-white-dim); }
.bk-results-head { margin-bottom: 16px; }

.bk-related {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 32px;
  margin-top: 32px;
}
.bk-related .bd-card-title { margin-bottom: 16px; }
.bk-more {
  display: inline-block;
  margin-top: 16px;
  font: 12px var(--eh-font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--eh-white-muted);
  text-decoration: none;
  transition: color .15s var(--eh-ease);
}
.bk-more:hover { color: var(--eh-white); }

@media (max-width: 1024px) {
  .bk-detail-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .bk-facts-2 { grid-template-columns: minmax(0, 1fr); }
  .bk-search-go { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .bk-crumbs a, .bk-search-go, .bd-chip.is-ember, .bk-id a, .bk-fact dd a, .bk-result, .bk-more { transition: none; }
}

/* ==========================================================================
   World map — Geography section (js/bank-directory.js → renderMap)
   Sequential ramp: one blue hue, dim → bright = fewer → more. Validated with
   the dataviz checker (--ordinal, dark, vs the card surface): monotone
   lightness, ≥0.06 ΔL between steps, dimmest step 2.2:1 vs surface. Step 3
   is --eh-blue-glow; the others have no token.
   ========================================================================== */

body.bd-page {
  --bd-ramp-1: #2d46ad;
  --bd-ramp-2: #3a5de0;
  --bd-ramp-3: var(--eh-blue-glow);
  --bd-ramp-4: #7196ff;
  --bd-ramp-5: #a3bdff;
  --bd-ramp-6: #dbe5ff;
  --bd-land-empty: rgba(255,255,255,0.07);
}

.bd-map-card { margin-bottom: 24px; padding-bottom: 20px; }
.bd-map-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px 24px;
  margin-bottom: 12px;
}
.bd-map-head .bd-card-head { margin-bottom: 0; }
.bd-map-controls { display: flex; flex-wrap: wrap; gap: 10px; }

/* Segmented control */
.bd-seg {
  display: inline-flex;
  padding: 3px;
  gap: 2px;
  border: 1px solid var(--eh-rule-strong);
  border-radius: var(--eh-radius-pill);
  background: rgba(255,255,255,0.03);
}
.bd-seg button {
  height: 32px;
  padding: 0 14px;
  border: 0;
  border-radius: var(--eh-radius-pill);
  background: transparent;
  color: var(--eh-white-muted);
  font: 600 12px var(--eh-font-body);
  cursor: pointer;
  transition: background-color .15s var(--eh-ease), color .15s var(--eh-ease);
}
.bd-seg button:hover { color: var(--eh-white); background: rgba(255,255,255,0.06); }
.bd-seg button[aria-checked="true"] { background: var(--eh-white); color: var(--eh-navy); }
.bd-seg button:focus-visible { outline: 2px solid var(--eh-ember-bright); outline-offset: 2px; }

.bd-map-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 24px;
  align-items: stretch;
}
.bd-map {
  position: relative;
  border-radius: var(--eh-radius-md);
  overflow: hidden;
  background:
    radial-gradient(ellipse 70% 60% at 50% 45%, rgba(45,90,255,0.10) 0%, rgba(45,90,255,0) 70%),
    var(--eh-navy-deep);
  border: 1px solid var(--eh-rule);
}
.bd-map svg { display: block; width: 100%; height: auto; }
.bd-map .bd-graticule { fill: none; stroke: rgba(255,255,255,0.045); stroke-width: 0.5; vector-effect: non-scaling-stroke; }
.bd-map .bd-sphere { fill: rgba(255,255,255,0.012); stroke: var(--eh-rule); stroke-width: 1; vector-effect: non-scaling-stroke; }
.bd-map .bd-land {
  stroke: var(--eh-navy-deep);           /* surface gap between neighbours */
  stroke-width: 0.6;
  vector-effect: non-scaling-stroke;
  stroke-linejoin: round;
  transition: fill .35s var(--eh-ease), opacity .15s var(--eh-ease);
  cursor: pointer;
}
.bd-map .bd-land.is-empty { fill: var(--bd-land-empty); cursor: default; }
.bd-map .bd-dot {
  stroke: var(--eh-navy-deep);           /* surface ring */
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
  transition: fill .35s var(--eh-ease), opacity .15s var(--eh-ease);
  pointer-events: none;
}
.bd-map .bd-dot-hit { fill: transparent; cursor: pointer; }
.bd-map .bd-top-glow { filter: url(#bd-glow); pointer-events: none; }
.bd-map .bd-land.is-outside,
.bd-map .bd-dot.is-outside { opacity: 0.22; }
.bd-map .bd-top-glow .is-outside { display: none; }
.bd-map svg.is-hovering .bd-land:not(.is-hover),
.bd-map svg.is-hovering .bd-dot:not(.is-hover) { opacity: 0.45; }
.bd-map .bd-land.is-hover,
.bd-map .bd-dot.is-hover { stroke: var(--eh-white); stroke-width: 1.5; }
.bd-map .bd-land.is-selected { stroke: var(--eh-ember-bright); stroke-width: 1.5; }

/* Leaders list */
.bd-map-side { display: flex; flex-direction: column; min-width: 0; }
.bd-map-side-label { color: var(--eh-white-dim); margin: 4px 0 12px; }
.bd-map-side-note { margin: 12px 0 0; font-size: 12px; color: var(--eh-white-dim); }
.bd-map-side-note:empty { display: none; }
.bd-leaders { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.bd-leaders button {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  grid-template-rows: auto 4px;
  align-items: center;
  gap: 6px 8px;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: var(--eh-radius-sm);
  background: transparent;
  color: var(--eh-white-muted);
  font: 13px var(--eh-font-body);
  text-align: left;
  cursor: pointer;
  transition: background-color .15s var(--eh-ease);
}
.bd-leaders button:hover,
.bd-leaders button:focus-visible,
.bd-leaders button.is-hover { background: rgba(255,255,255,0.06); outline: none; }
.bd-leaders .bd-rank { font: 11px var(--eh-font-mono); color: var(--eh-white-dim); }
.bd-leaders .bd-leader-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--eh-white); }
.bd-leaders .bd-leader-value { font: 12px var(--eh-font-mono); color: var(--eh-white); font-variant-numeric: tabular-nums; }
.bd-leaders .bd-leader-bar { grid-column: 2 / -1; height: 4px; border-radius: 2px; background: var(--bd-track); overflow: hidden; }
.bd-leaders .bd-leader-bar span { display: block; height: 100%; border-radius: 2px; background: var(--bd-series-1); transition: width .35s var(--eh-ease); }

/* Legend */
.bd-map-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
  margin-top: 16px;
}
.bd-map-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  margin: 0;
  padding: 0;
  list-style: none;
  font: 11px var(--eh-font-mono);
  color: var(--eh-white-muted);
}
.bd-map-legend li { display: inline-flex; align-items: center; gap: 6px; }
.bd-map-legend .bd-swatch { width: 18px; height: 10px; border-radius: 2px; }
.bd-map-credit { margin: 0; color: var(--eh-white-dim); font-size: 10px; }

@media (max-width: 1024px) {
  .bd-map-body { grid-template-columns: minmax(0, 1fr); }
  .bd-leaders { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .bd-leaders { grid-template-columns: minmax(0, 1fr); }
  .bd-seg button { padding: 0 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .bd-seg button, .bd-map .bd-land, .bd-map .bd-dot, .bd-leaders button, .bd-leaders .bd-leader-bar span { transition: none; }
}

/* BIC anatomy — Identifiers card on /bank/* pages (bicParts() in bank-render.mjs) */
.bk-card-top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; }
.bk-scope { margin: 0; font-size: 13px; color: var(--eh-white-dim); }
.bk-scope a { color: var(--eh-white-muted); text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.bk-scope a:hover { border-color: var(--eh-ember-bright); }
.bk-bic-parts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
}
.bk-bic-parts li {
  display: grid;
  gap: 6px;
  min-width: 64px;
  padding: 10px 12px;
  border: 1px solid var(--eh-rule-strong);
  border-radius: var(--eh-radius-sm);
  background: rgba(255,255,255,0.03);
}
.bk-bic-parts li.is-branch { border-color: rgba(77,122,255,0.55); background: rgba(77,122,255,0.10); }
.bk-part-code { font: 700 17px var(--eh-font-mono); letter-spacing: 0.08em; color: var(--eh-white); }
.bk-part-label { font-size: 12px; line-height: 1.3; color: var(--eh-white-dim); }
.bk-flash { animation: bk-flash .8s var(--eh-ease); }
@keyframes bk-flash { from { background: rgba(77,122,255,0.35); } to { background: rgba(77,122,255,0.10); } }
@media (prefers-reduced-motion: reduce) {
  .bk-flash { animation: none; }
  .bk-scope a { transition: none; }
}

/* ==========================================================================
   Claim this profile — /bank/* institution pages (netlify/lib/bank-claims.mjs)
   A warm-paper band on the navy page (STYLE.md: forms live on paper) with a
   cream card. Inputs + consent row are the shared cream-form atoms —
   .s-input / label.consent in css/elucidate-form.css, scoped by .bk-claim.
   ========================================================================== */
.bd-section.bk-claim {
  position: relative;
  background: var(--eh-paper-2);
  border-top: 0;
  color: var(--eh-ink);
}
.bk-claim .bd-h2 { color: var(--eh-ink); }
.bk-claim .bd-intro-text { color: var(--eh-ink-soft); }
/* Accents on paper: the deeper --eh-ember reads on cream; --eh-ember-bright and mint are for navy. */
.bk-claim .bd-h2 em,
.bk-claim .elu-kicker { color: var(--eh-ember); }
.bk-claim .elu-kicker.is-mint { color: var(--eh-ink-soft); }
.bk-claim .elu-kicker.is-mint .bk-seal { width: 16px; height: 16px; }
.bk-claim-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: 64px;
  align-items: start;
}
.bk-claim-grid.is-claimed { grid-template-columns: minmax(0, 720px); }
.bk-claim-copy .bd-intro-text { margin-bottom: 20px; }
.bk-claim .bk-asof { margin-left: 0; white-space: nowrap; color: var(--eh-ink-soft); }
.bk-claim-link { color: var(--eh-ink); text-decoration: none; border-bottom: 1px solid var(--eh-ink-rule-strong); transition: border-color .15s var(--eh-ease); }
.bk-claim-link:hover { border-color: var(--eh-ember); }
.bk-claim-steps { margin: 28px 0 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.bk-claim-steps li {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  font-size: 14px;
  line-height: 1.6;
  color: var(--eh-ink-soft);
  padding-left: 16px;
  border-left: 1px solid var(--eh-ink-rule-strong);
}
.bk-claim-steps .elu-mono-label { grid-row: span 2; color: var(--eh-ember); line-height: 1.9; }
.bk-claim-steps strong { color: var(--eh-ink); font-weight: 600; }

.bk-claim-card {
  padding: 32px;
  background: var(--eh-cream);
  border: 1px solid var(--eh-ink-rule);
  border-radius: var(--eh-radius-lg);
  box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset, 0 24px 48px -28px rgba(11,20,48,0.35);
}
.bk-claim-form { display: grid; gap: 20px; margin: 0; }
.bk-claim-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 18px 16px; }
.bk-claim-wide { grid-column: 1 / -1; display: grid; }
.bk-claim-field { display: grid; align-content: start; gap: 6px; margin: 0; font-weight: 400; }
.bk-claim-field .elu-mono-label { color: var(--eh-ink-soft); }
.bk-claim-opt { margin-left: 6px; opacity: 0.6; }
.bk-claim-hint { font-size: 12px; line-height: 1.45; color: var(--eh-ink-soft); }
.bk-claim label.consent { margin: 0; }
.bk-claim-form .elu-btn { justify-self: start; }

/* Submission states — js/netlify-forms.js shows one and hides the form.
   Undo the legacy Webflow .s-form-done/.s-form-fail box (grey fill, centred). */
.bk-claim-state { display: none; margin: 0; padding: 0; background: none; text-align: left; }
.bk-claim-state .bd-card-title { margin-bottom: 8px; color: var(--eh-ink); }
.bk-claim-state .bk-scope { color: var(--eh-ink-soft); }
.bk-claim-state.is-fail { margin-top: 16px; }
.bk-claim-state.is-fail .bk-scope { color: var(--eh-ember); }
.bk-claim-state a { color: var(--eh-ink); }

@media (max-width: 1024px) {
  .bk-claim-grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }
}
@media (max-width: 640px) {
  .bk-claim-fields { grid-template-columns: minmax(0, 1fr); }
  .bk-claim-card { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .bk-claim-link { transition: none; }
}

/* Verified seal + corner ribbon — claimed institutions (verifiedSeal / verifiedRibbon in
   netlify/lib/bank-claims.mjs). Mint = success in the status map. */
.bk-seal { flex-shrink: 0; overflow: visible; }
.bk-seal-body {
  fill: var(--eh-mint);
  stroke: var(--eh-mint);
  stroke-width: 1.6;
  stroke-linejoin: round;
}
.bk-seal-check {
  fill: none;
  stroke: var(--eh-navy);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.bk-title-seal {
  width: 0.62em;
  height: 0.62em;
  margin-left: 0.22em;
  vertical-align: 0.02em;
  filter: drop-shadow(0 0 6px color-mix(in srgb, var(--eh-mint) 20%, transparent));
}

/* Corner ribbon: a square clip box in the hero's top-right corner with a 45°
   band through it. Geometry: the band's centre sits --t along both edges from
   the corner (right = L/2 − t, top = t − H/2), so it crosses the corner
   symmetrically; the clip box must exceed ~2t + H. The hero's overflow:hidden
   (it starts under the sticky nav) trims the band ends. */
.bk-ribbon {
  --t: 108px;              /* band centre offset from the corner */
  --h: 44px;               /* band height */
  --l: 420px;              /* band length (ends are clipped) */
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  width: calc(var(--t) * 2 + var(--h) + 24px);
  height: calc(var(--t) * 2 + var(--h) + 24px);
  margin: 0;               /* undo the legacy Webflow link rule's margin + font */
  font-family: inherit;
  overflow: hidden;
  pointer-events: none;
  text-decoration: none;
}
.bk-ribbon-band {
  position: absolute;
  top: calc(var(--t) - var(--h) / 2);
  right: calc(var(--t) - var(--l) / 2);
  width: var(--l);
  height: var(--h);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  transform: rotate(45deg);
  /* A navy sash a step lighter than the page, edged like a certificate: an
     outer mint hairline plus a fainter inner rule (::before). Mint is the
     accent only — seal and rules — never the fill. */
  background: linear-gradient(180deg, var(--eh-navy-soft), var(--eh-navy-mid));
  border-block: 1px solid color-mix(in srgb, var(--eh-mint) 55%, transparent);
  box-shadow: 0 10px 30px -10px rgba(0,0,0,0.7);
  color: var(--eh-white);
  font: 400 11px/1 var(--eh-font-mono);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: auto;
  transition: border-color .15s var(--eh-ease);
}
.bk-ribbon-band::before {
  content: "";
  position: absolute;
  inset: 3px 0;
  border-block: 1px solid color-mix(in srgb, var(--eh-mint) 22%, transparent);
  pointer-events: none;
}
.bk-ribbon-band strong { font-weight: 700; color: var(--eh-white); }
.bk-ribbon-band .bk-ribbon-by { color: var(--eh-white-muted); }
.bk-ribbon .bk-seal { width: 18px; height: 18px; transform: rotate(-45deg); }   /* keep the check upright on the band */
.bk-ribbon:hover .bk-ribbon-band { border-color: var(--eh-mint); }
.bk-ribbon:focus-visible { outline: none; }
.bk-ribbon:focus-visible .bk-ribbon-band { outline: 2px solid var(--eh-white); outline-offset: 2px; }
@media (max-width: 640px) {
  .bk-ribbon { --t: 76px; --h: 32px; --l: 300px; }
  .bk-ribbon ~ .bd-container .bk-crumbs { padding-right: 96px; }   /* long names wrap before the band */
  .bk-ribbon-band { font-size: 9px; letter-spacing: 0.14em; gap: 6px; }
  .bk-ribbon .bk-seal { width: 14px; height: 14px; }
}

.bd-chip.bk-verified-chip { border-color: color-mix(in srgb, var(--eh-mint) 45%, transparent); color: var(--eh-white); }
.bd-chip.bk-verified-chip .bk-seal { width: 16px; height: 16px; align-self: center; }

@media (prefers-reduced-motion: reduce) {
  .bk-ribbon-band { transition: none; }
}

/* ==========================================================================
   Status panel — bank page hero (statusPanelHtml in bank-render.mjs).
   Mirrors the share card's panel (bank-og.mjs): same content, same accent
   meaning — blue-light = G-SIB (decorative), cyan = ECB info, ember-bright =
   sanctions warning.
   ========================================================================== */
.bk-hero-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 24px 40px;
}
.bk-hero-name { min-width: 0; }
.bk-dot.is-blue { background: var(--eh-blue-light); }

.bk-status {
  --bk-accent: var(--eh-blue-light);
  --bk-accent-rule: rgba(138,173,255,0.45);
  --bk-accent-wash: rgba(77,122,255,0.10);
  display: grid;
  gap: 10px;
  width: 340px;
  margin-bottom: 24px;
  padding: 20px 22px;
  border: 1px solid var(--bk-accent-rule);
  border-radius: var(--eh-radius-lg);
  background: linear-gradient(160deg, var(--bk-accent-wash) 0%, rgba(255,255,255,0.02) 100%);
}
.bk-status.is-significant {
  --bk-accent: var(--eh-cyan);
  --bk-accent-rule: rgba(0,212,255,0.40);
  --bk-accent-wash: rgba(0,212,255,0.08);
}
.bk-status.is-sanctioned {
  --bk-accent: var(--eh-ember-bright);
  --bk-accent-rule: rgba(251,146,60,0.55);
  --bk-accent-wash: rgba(234,88,12,0.14);
}
.bk-status p { margin: 0; }
.bk-status-label { color: var(--bk-accent); }
.bk-status-main { display: flex; align-items: center; gap: 16px; }
.bk-status-num { font: 700 56px/1 var(--eh-font-mono); color: var(--eh-white); }
.bk-status-meta { display: grid; gap: 8px; }
.bk-buckets { display: flex; align-items: flex-end; gap: 5px; }
.bk-bucket { width: 20px; border-radius: 4px 4px 0 0; background: var(--eh-rule-strong); }
.bk-bucket.is-on { background: var(--bk-accent); }
.bk-status-caption { font-size: 14px; line-height: 1.4; color: var(--eh-white-muted); }
.bk-status-headline { font-size: 18px; font-weight: 600; line-height: 1.3; color: var(--eh-white); }
.bk-status-row { display: grid; gap: 2px; }
.bk-status-row + .bk-status-row { padding-top: 10px; border-top: 1px solid var(--eh-rule); }
.bk-status-note { display: flex; align-items: center; gap: 8px; padding-top: 10px; border-top: 1px solid var(--eh-rule); font-size: 14px; color: var(--eh-white); }
.bk-status-link {
  justify-self: start;
  font: 12px var(--eh-font-mono);
  letter-spacing: 0.06em;
  color: var(--eh-white-muted);
  text-decoration: none;
  border-bottom: 1px solid var(--eh-white-faint);
  transition: color .15s var(--eh-ease), border-color .15s var(--eh-ease);
}
.bk-status-link:hover { color: var(--eh-white); border-color: var(--bk-accent); }

@media (max-width: 1024px) {
  .bk-hero-head { grid-template-columns: minmax(0, 1fr); }
  .bk-status { width: auto; max-width: 420px; margin-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .bk-status-link { transition: none; }
}

/* Info tooltip — connection type on /bank/* pages (connWithTip in bank-render.mjs).
   Opens on hover and keyboard focus; stays open while hovered; Esc closes it
   (js/bank-page.js adds .is-dismissed). */
.bk-chip-tip { position: relative; }
.bk-tip-wrap { position: relative; display: inline-flex; margin-left: 6px; vertical-align: middle; }
.bk-tip-btn {
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 1px solid var(--eh-rule-strong);
  border-radius: 50%;
  background: transparent;
  color: var(--eh-white-muted);
  font: 700 11px/1 var(--eh-font-body);
  cursor: help;
  transition: color .15s var(--eh-ease), border-color .15s var(--eh-ease);
}
.bk-tip-btn:hover,
.bk-tip-btn:focus-visible { color: var(--eh-white); border-color: var(--eh-white-dim); outline: none; }
.bk-tip-btn:focus-visible { box-shadow: 0 0 0 2px var(--eh-ember-bright); }
.bk-tip {
  position: absolute;
  z-index: 30;
  bottom: calc(100% + 10px);
  left: 50%;
  width: max-content;
  max-width: 320px;
  padding: 12px 14px;
  border: 1px solid var(--eh-rule-strong);
  border-radius: var(--eh-radius-sm);
  background: var(--eh-navy-soft);
  box-shadow: 0 16px 36px -10px rgba(0,0,0,0.6);
  font: 400 13px/1.5 var(--eh-font-body);
  letter-spacing: 0;
  text-transform: none;
  text-align: left;
  white-space: normal;
  color: var(--eh-white-muted);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 4px);
  transition: opacity .15s var(--eh-ease), transform .15s var(--eh-ease), visibility 0s linear .15s;
}
/* hover bridge so the pointer can travel from button to tooltip */
.bk-tip::after { content: ''; position: absolute; left: 0; right: 0; top: 100%; height: 12px; }
.bk-tip-wrap:hover .bk-tip,
.bk-tip-btn:focus + .bk-tip {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
  transition-delay: 0s;
}
.bk-tip-wrap.is-dismissed .bk-tip { opacity: 0; visibility: hidden; }
@media (max-width: 640px) {
  .bk-tip { left: auto; right: -12px; transform: translateY(4px); max-width: min(300px, 80vw); }
  .bk-tip-wrap:hover .bk-tip,
  .bk-tip-btn:focus + .bk-tip { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .bk-tip, .bk-tip-btn { transition: none; }
}

/* G-SIB panel extras: tooltips anchored right (panel sits at the viewport's
   right edge), and the two source links side by side. */
.bk-tip-wrap.is-end .bk-tip { left: auto; right: -10px; transform: translateY(4px); }
.bk-tip-wrap.is-end:hover .bk-tip,
.bk-tip-wrap.is-end .bk-tip-btn:focus + .bk-tip { transform: none; }
.bk-status-label .bk-tip-wrap { vertical-align: 1px; }
.bk-status-links { display: flex; flex-wrap: wrap; gap: 8px 18px; }

/* ==========================================================================
   Directory insights — sections 04 / 05 / 07 / 09 / 10 (renderInsights in
   js/bank-directory.js). Sanctions use --eh-ember-bright, the warning status
   colour; everything else stays on the validated blue series/ramp.
   ========================================================================== */

/* Hero: second KPI row — each tile links to its section */
.bd-kpis.is-secondary { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 12px; }
.bd-kpis.is-secondary { align-items: stretch; }
.bd-kpis.is-secondary .bd-kpi {
  display: block;
  margin: 0;                /* a legacy Webflow rule offsets links inside the hero */
  padding: 18px 22px;
  text-decoration: none;
  color: inherit;
  transition: background-color .15s var(--eh-ease);
}
.bd-kpis.is-secondary .bd-kpi:hover,
.bd-kpis.is-secondary .bd-kpi:focus-visible { background: var(--eh-navy-soft); outline: none; }
.bd-kpis.is-secondary .bd-kpi-value { font-size: clamp(22px, 2.2vw, 30px); }
.bd-kpis.is-secondary .bd-kpi.is-warning .bd-kpi-value { color: var(--eh-ember-bright); }

/* Bars: warning tone + stacked segments */
.bd-bars.is-warning .bd-bar-fill { background: var(--eh-ember-bright); }
.bd-bar-track.is-stacked { display: flex; gap: 2px; }
.bd-bar-track.is-stacked .bd-bar-fill { flex: none; border-radius: 0; }
.bd-bar-track.is-stacked .bd-bar-fill:last-child { border-radius: 0 4px 4px 0; }

.bd-card-note { margin: 14px 0 0; font-size: 13px; line-height: 1.5; color: var(--eh-white-dim); }

/* Sanctions: country-wide regimes */
.bd-regime + .bd-regime { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--eh-rule); }
.bd-regime-label { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; color: var(--eh-white-muted); }
.bd-regime-list { display: flex; flex-wrap: wrap; gap: 8px; }
.bd-regime-chip {
  background: transparent;
  font: inherit;
  font-size: 13px;
  color: var(--eh-white-muted);
  cursor: pointer;
  transition: border-color .15s var(--eh-ease), background-color .15s var(--eh-ease);
}
.bd-regime-chip:hover,
.bd-regime-chip:focus-visible { border-color: var(--eh-rule-strong); background: rgba(255,255,255,0.05); outline: none; }
.bk-dot.is-muted { background: var(--eh-white-dim); }

/* Institution lists inside cards (sanctioned networks, oldest institutions) */
.bd-inst-list { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }

/* Explorer tags */
.bd-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.bd-tag.is-warning { color: var(--eh-ember-bright); border-color: rgba(251,146,60,0.5); }
.bd-tag.is-gsib { color: var(--eh-blue-light); border-color: rgba(138,173,255,0.45); }
.bd-tag.is-info { color: var(--eh-cyan); border-color: rgba(0,212,255,0.35); }

@media (max-width: 1024px) {
  .bd-kpis.is-secondary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .bd-kpis.is-secondary .bd-kpi, .bd-regime-chip { transition: none; }
}

/* Bar labels that may wrap (long programme / scheme / venue names) */
.bd-bars.is-wrap .bd-bar-row { grid-template-columns: minmax(120px, 44%) minmax(0, 1fr) 56px; }
.bd-bars.is-wrap .bd-bar-label { white-space: normal; line-height: 1.3; }

/* Compact institution list — plain rows instead of boxed results */
.bd-inst-list.is-compact { grid-template-columns: minmax(0, 1fr); gap: 0; }
.bd-inst-list.is-compact .bk-result {
  padding: 12px 4px;
  border: 0;
  border-bottom: 1px solid var(--eh-rule);
  border-radius: 0;
  background: transparent;
}
.bd-inst-list.is-compact li:last-child .bk-result { border-bottom: 0; }
.bd-inst-list.is-compact .bk-result:hover,
.bd-inst-list.is-compact .bk-result:focus-visible { background: rgba(255,255,255,0.04); }

/* ==========================================================================
   AI-researched profile — /bank/* (netlify/lib/bank-render-profile.mjs)
   Hero lead, Overview / Leadership / Supervisors / Recent events cards and the
   researched sanctions blocks. The AI disclosure is in the Sources & method footer.
   ========================================================================== */

/* Hero */
.bk-profile-lead {
  max-width: 760px;
  margin: 4px 0 12px;
  font-size: 17px;
  line-height: 1.6;
  color: var(--eh-white-muted);
}

/* Overview: key figures */
.bk-figures {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 20px;
  background: var(--eh-rule);
  border: 1px solid var(--eh-rule);
  border-radius: var(--eh-radius-md);
  overflow: hidden;
}
.bk-figure { padding: 18px 20px; }
.bk-figure p { margin: 0; }
.bk-figure .bd-kpi-label { margin-bottom: 10px; }
.bk-figure .bd-kpi-value { margin-bottom: 0; font-size: clamp(20px, 2vw, 28px); line-height: 1.15; overflow-wrap: anywhere; }
.bk-figure .bd-kpi-value.is-empty { font-size: 16px; font-weight: 400; color: var(--eh-white-dim); }
.bk-figure .bd-kpi-note { margin-top: 8px; line-height: 1.45; }
.bk-figure a,
.bk-profile-text a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.bk-figure a:hover { border-color: var(--eh-ember-bright); }

/* Overview: business lines, text, sources */
.bk-profile-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; }
.bk-profile-tags .bd-tag { padding: 4px 10px; font-size: 12px; color: var(--eh-white-muted); white-space: normal; }
.bk-profile-text { max-width: 880px; margin: 14px 0 0; font-size: 14px; line-height: 1.55; color: var(--eh-white-muted); }
.bk-profile-sources { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--eh-rule); }
.bk-profile-sources summary { cursor: pointer; color: var(--eh-white-muted); transition: color .15s var(--eh-ease); }
.bk-profile-sources summary:hover { color: var(--eh-white); }
.bk-profile-sources ol { margin: 12px 0 0; padding-left: 22px; display: grid; gap: 6px; font-size: 13px; color: var(--eh-white-dim); }
.bk-profile-sources a { color: var(--eh-white-muted); text-decoration: none; overflow-wrap: anywhere; }
.bk-profile-sources a:hover { color: var(--eh-white); }
.bk-profile-path { color: var(--eh-white-dim); }

/* Leadership + supervisors */
.bk-person-name { display: block; font-weight: 600; }
.bk-person-title { display: block; font-size: 14px; line-height: 1.45; color: var(--eh-white-muted); }
.bk-person-meta { display: block; margin-top: 4px; font-size: 12px; color: var(--eh-white-dim); }
.bk-profile-roles { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.bk-profile-roles .bd-tag { color: var(--eh-white-muted); }

/* Recent events */
.bk-events-count { margin-left: 8px; font: 400 12px var(--eh-font-mono); color: var(--eh-ember-bright); }
.bk-events { margin: 16px 0 0; padding: 0; list-style: none; }
.bk-event {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 20px;
  padding: 16px 0;
  border-top: 1px solid var(--eh-rule);
}
.bk-event-date { padding-top: 2px; font: 13px var(--eh-font-mono); color: var(--eh-white-muted); }
.bk-event-body p { max-width: 880px; margin: 8px 0 6px; font-size: 15px; line-height: 1.55; color: var(--eh-white); }
.bk-event-src { font-size: 13px; color: var(--eh-white-dim); text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.bk-event-src:hover { border-color: var(--eh-ember-bright); }

@media (max-width: 1024px) {
  .bk-figures { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .bk-profile-lead { font-size: 16px; }
  .bk-event { grid-template-columns: minmax(0, 1fr); gap: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  .bk-figure a, .bk-profile-text a, .bk-profile-sources summary, .bk-event-src { transition: none; }
}
.bk-figure .bd-kpi-note a, .bk-person-meta a { white-space: nowrap; }
.bk-profile-sources summary::after { content: ' +'; color: var(--eh-white-dim); }
.bk-profile-sources[open] summary::after { content: ' −'; }

/* ==========================================================================
   Register-firm pages and the firm list (.fm-*) — formerly css/firm-directory.css,
   appended byte for byte below. Loaded after the .bd-* / .bk-* rules above.
   ========================================================================== */

/* ============================================================================
   css/firm-directory.css — firm directory (/firm) and firm pages (/firm/<id>).
   Loaded after css/bank-directory.css: the firm pages reuse its .bd-* / .bk-*
   anatomy (hero, cards, facts, tables, chips) and only add the firm-specific
   pieces here, prefixed .fm-*. Dark navy theme; tokens from elucidate-tokens.css.
   Markup: netlify/lib/firm-render.mjs.
   ========================================================================== */

/* ─── Register-status panel (hero, right) ─────────────────────── */
.fm-status.is-active {
  --bk-accent: var(--eh-mint);
  --bk-accent-rule: color-mix(in srgb, var(--eh-mint) 45%, transparent);
  --bk-accent-wash: color-mix(in srgb, var(--eh-mint) 8%, transparent);
}
.fm-status.is-inactive {
  --bk-accent: var(--eh-ember-bright);
  --bk-accent-rule: color-mix(in srgb, var(--eh-ember-bright) 55%, transparent);
  --bk-accent-wash: color-mix(in srgb, var(--eh-ember) 14%, transparent);
}
.fm-status .bk-status-headline { display: flex; align-items: center; gap: 10px; font-size: 22px; }

/* ─── Badges (type · regulation · status) ─────────────────────── */
.fm-badge { align-items: center; gap: 6px; padding: 4px 10px; font-size: 12px; }
.bk-idbar .fm-badge { padding: 8px 14px; font-size: 13px; }
.fm-result-badges { display: flex; flex-wrap: wrap; gap: 6px; }

/* ─── Result rows (directory + related) ───────────────────────── */
.fm-result { grid-template-columns: minmax(0, 1fr); gap: 8px; }
.fm-result.is-static { cursor: default; }
.fm-result.is-static:hover { border-color: var(--eh-rule); background: var(--bd-surface); }
.fm-result-aka { font-weight: 400; color: var(--eh-white-dim); }
.fm-nopage { color: var(--eh-white-dim); }

/* ─── Directory layout ────────────────────────────────────────── */
.fm-dir-title { margin: 12px 0 16px; }
.fm-dir-lead { max-width: 720px; margin-bottom: 28px; }
.fm-kpis { margin-top: 32px; }
.fm-dir-grid {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 40px;
  align-items: start;
}
.fm-filters { position: sticky; top: 24px; display: grid; gap: 28px; }
.fm-facet-group { display: grid; gap: 10px; }
.fm-facet-title { display: flex; align-items: center; color: var(--eh-white-dim); margin: 0; }
.fm-facets { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.fm-facet {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: var(--eh-radius-sm);
  color: var(--eh-white-muted);
  font-size: 14px;
  text-decoration: none;
  transition: background-color .15s var(--eh-ease), color .15s var(--eh-ease), border-color .15s var(--eh-ease);
}
.fm-facet:hover { color: var(--eh-white); background: rgba(255,255,255,0.05); }
.fm-facet:focus-visible { outline: 2px solid var(--eh-ember-bright); outline-offset: 2px; }
.fm-facet.is-on { color: var(--eh-white); background: rgba(255,255,255,0.08); border-color: var(--eh-rule-strong); }
.fm-facet[aria-disabled="true"] { opacity: 0.45; }
.fm-facet-label { flex: 1; }
.fm-facet-count { font: 12px var(--eh-font-mono); color: var(--eh-white-dim); }
.fm-facet.is-on .fm-facet-count { color: var(--eh-white); }
.fm-cc-more .bd-field { min-width: 0; }

.fm-results-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px 24px;
  margin-bottom: 20px;
}
.fm-results-count { margin: 0; font-size: 22px; }
.fm-results-count strong { font-weight: 600; }
.fm-active-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.fm-active-filter { padding: 4px 12px; font-size: 12px; text-decoration: none; }
.fm-notice { margin-bottom: 16px; }
.fm-notice + .bk-results { margin-bottom: 40px; }
.fm-pager { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 28px; }
.fm-pager a.bd-page-btn { display: inline-flex; align-items: center; text-decoration: none; }
.fm-pager span.bd-page-btn { display: inline-flex; align-items: center; opacity: 0.35; }

/* ─── Firm page: licences table, activities, history ──────────── */
.fm-licences { min-width: 1080px; }
.fm-licences td { vertical-align: top; }
.fm-licences tr.is-inactive td { color: var(--eh-white-dim); }
.fm-reg-name { display: block; color: var(--eh-white); font-weight: 600; }
.fm-reg-by { display: block; margin-top: 2px; font-size: 12px; color: var(--eh-white-dim); }
.fm-lic-status { display: inline-flex; align-items: center; gap: 8px; }
.fm-acts { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; }
.fm-acts li {
  padding: 2px 8px;
  border: 1px solid var(--eh-rule);
  border-radius: var(--eh-radius-pill);
  font-size: 11px;
  color: var(--eh-white-muted);
  white-space: nowrap;
}
.fm-sub { display: block; margin-top: 4px; font-size: 12px; }
.fm-history { margin: 0; padding: 0; list-style: none; font-size: 14px; }
.fm-history li { padding: 10px 0; border-bottom: 1px solid var(--eh-rule); color: var(--eh-white-muted); }
.fm-history li:last-child { border-bottom: 0; }
.fm-history strong { color: var(--eh-white); font-weight: 600; }
.fm-old { color: var(--eh-white-dim); text-decoration: line-through; }

@media (max-width: 1024px) {
  .fm-dir-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .fm-filters { position: static; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
}
@media (max-width: 640px) {
  .fm-filters { grid-template-columns: minmax(0, 1fr); }
  .fm-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .fm-facet { transition: none; }
}

/* ==========================================================================
   Bank images — /bank/* (netlify/lib/bank-render-images.mjs)
   Logo on a white tile (logos are drawn for light backgrounds), the
   organisation's photo with its credit, round executive headshots.
   ========================================================================== */

.bk-logo {
  display: flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  margin: 0 0 20px;
  padding: 10px 16px;
  background: var(--eh-white);
  border-radius: var(--eh-radius-md);
}
.bk-logo-img { display: block; width: auto; height: 44px; max-width: 240px; object-fit: contain; }

.bk-photo { margin: 20px 0 0; }
.bk-photo-img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: var(--eh-radius-md);
  background: var(--eh-navy-soft);
}
.bk-photo.is-about .bk-photo-img { max-height: 340px; }
.bk-photo-credit { margin-top: 8px; text-align: left; font-size: 12px; line-height: 1.4; color: var(--eh-white-dim); }
.bk-photo-credit a { color: var(--eh-white-muted); text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.bk-photo-credit a:hover { border-color: var(--eh-ember-bright); }

/* Overview: photo beside the key figures (2 × 2) */
.bk-overview-top {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 20px;
  margin-top: 20px;
}
.bk-overview-top .bk-photo { display: flex; flex-direction: column; margin: 0; }
.bk-overview-top .bk-photo-img { flex: 1; height: 100%; min-height: 220px; max-height: 340px; }
.bk-overview-top .bk-figures { margin-top: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Leadership: headshot beside the name */
.bk-person { display: flex; align-items: flex-start; gap: 14px; }
.bk-person-text { min-width: 0; }
.bk-headshot {
  flex: none;
  width: 56px;
  height: 56px;
  overflow: hidden;
  border: 1px solid var(--eh-rule);
  border-radius: 50%;
  background: var(--eh-navy-soft);
}
.bk-headshot-img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; }

@media (max-width: 1024px) {
  .bk-overview-top { grid-template-columns: minmax(0, 1fr); }
  .bk-overview-top .bk-photo-img { max-height: 280px; }
}
@media (prefers-reduced-motion: reduce) {
  .bk-photo-credit a { transition: none; }
}
/* Correspondent names link to their directory page: body font, like the other name cells. */
.bd-table a.bk-corr-name { font-family: var(--eh-font-body); font-size: 14px; letter-spacing: 0; }

/* ==========================================================================
   Methodology — directory-methodology.html (/directory/methodology)
   Built from the .bd-* / .bk-* atoms above; .ds-* is only what that page adds.
   Its tables are filled by build.js from the data (netlify/lib/directory-methodology.mjs).
   ========================================================================== */
.ds-toc { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 32px; }
.ds-table { min-width: 860px; }
.ds-table .bd-name { min-width: 180px; font-weight: 600; }
/* Source names read as prose here: body font, like .bk-corr-name, and allowed to wrap. */
.bd-table.ds-table a { font-family: var(--eh-font-body); font-size: 13px; white-space: normal; }
.ds-num { font: 12px var(--eh-font-mono); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.bd-table th.ds-num { text-align: right; }
.ds-subhead { margin: 48px 0 16px; }
.ds-method .bd-card p,
.ds-routes .bd-card p:not(.ds-route-label) { margin: 10px 0 0; font-size: 14px; line-height: 1.6; color: var(--eh-white-muted); }
/* Corrections: three routes side by side; each card's link sits at its foot. */
.bd-grid.ds-routes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ds-routes .bd-card { display: flex; flex-direction: column; }
.ds-route-label { margin: 0 0 12px; color: var(--eh-blue-light); }
.ds-routes .bd-card p a { color: var(--eh-white); text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.ds-routes .bd-card p a:hover { border-color: var(--eh-ember-bright); }
.ds-routes .bk-more { margin-top: auto; padding-top: 20px; }
.ds-cta { max-width: 720px; }
@media (max-width: 1024px) {
  .bd-grid.ds-routes { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .ds-routes .bd-card p a { transition: none; }
}
.ds-list { max-width: 820px; }

/* ==========================================================================
   Unified directory — the one entity-page skeleton (netlify/lib/entity-blocks.mjs):
   institution (BIC8), branch (BIC11) and no-BIC pages share the hero, the
   three-identifier ID bar and the card order. Licences and registrations,
   the legal-entity pointer, Swift network, ownership and group, the branch
   head-office strip, research mentions. Built on the .bk-* / .fm-* atoms
   above; tokens only.
   ========================================================================== */

/* ID bar: BIC · LEI · licence no. are always there. A linked identifier keeps
   the .bk-id look; an absent one ("No BIC", "No LEI mapped", "Not on a
   tracked register") reads as a plain muted statement, not as a code. */
a.bk-id.is-link {
  margin: 0;
  font-family: inherit;
  color: inherit;
  text-decoration: none;
  transition: border-color .15s var(--eh-ease), background-color .15s var(--eh-ease);
}
a.bk-id.is-link:hover { border-color: var(--eh-rule-strong); background: rgba(255,255,255,0.07); }
a.bk-id.is-link:focus-visible { outline: 2px solid var(--eh-ember-bright); outline-offset: 2px; }
.bk-id.is-none { border-style: dashed; border-color: var(--eh-rule); background: transparent; }
.bk-id.is-none strong,
.bk-id.is-text strong { font: 500 14px var(--eh-font-body); letter-spacing: 0; }
.bk-id.is-none strong { font-weight: 400; color: var(--eh-white-muted); }
.bd-chip.is-link.is-ember { border-color: var(--eh-ember-bright); color: var(--eh-white); }
.bd-chip.is-link strong { font-family: var(--eh-font-mono); font-weight: 700; color: var(--eh-white); }

/* Licences table: register names and jurisdictions link to their hubs, in the body font. */
.bd-table a.fm-reg-name {
  display: inline;
  font: 600 14px var(--eh-font-body);
  letter-spacing: 0;
  white-space: normal;
}
.bd-table a.fm-juris { font: 14px var(--eh-font-body); letter-spacing: 0; white-space: normal; }
.fm-reg-link { color: var(--eh-white-muted); }
.fm-licences td .fm-reg-by + .fm-reg-by { margin-top: 4px; }
/* Nine columns in one card: tighter gutters, room for the register and licence names, wrap the long bits. */
.fm-licences th, .fm-licences td { padding-left: 10px; padding-right: 10px; }
.fm-licences th:first-child, .fm-licences td:first-child { padding-left: 16px; }
.fm-licences th:last-child, .fm-licences td:last-child { padding-right: 16px; }
.fm-licences td:first-child { min-width: 190px; }
.fm-licences td:nth-child(2) { min-width: 150px; }
.fm-licences td.bd-bic .fm-reg-by { font: 12px/1.4 var(--eh-font-body); letter-spacing: 0; white-space: normal; }
.bd-table.fm-licences td:last-child a { white-space: normal; }
.fm-trading .bk-asof { margin-left: 2px; }

/* Visible caveats under a table (Markdown twins keep them; tooltips are dropped). */
.bk-notes {
  margin: 16px 0 0;
  padding: 0 0 0 18px;
  display: grid;
  gap: 4px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--eh-white-dim);
}
.bk-note.is-warning { color: var(--eh-ember-bright); }
.bk-note a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.bk-note a:hover { border-color: var(--eh-ember-bright); }
.fm-sub-line { display: block; }
.fm-sub-line + .fm-sub-line { margin-top: 4px; }
.fm-sub a { color: var(--eh-white-muted); }

/* Cards in their empty state (nothing matched): the same card, one statement. */
.bk-licences.is-empty .bk-profile-text,
.bk-swift.is-empty > .bk-profile-text:first-of-type,
.bk-group.is-empty .bk-profile-text { color: var(--eh-white); font-size: 15px; }
.bk-licences .bk-results, .bk-swift .bk-results { margin-top: 16px; }

/* The legal-entity pointer (other BIC8s of an LEI) and a branch code filed under its own LEI. */
.bk-legal-entity { border-color: var(--eh-rule-strong); }
.bk-legal-name a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.bk-legal-name a:hover { border-color: var(--eh-ember-bright); }
.fm-gleif-note { max-width: 640px; margin: 0 0 16px; }

/* Swift network: facts of the BIC, or the same-LEI cross-links on a no-BIC page. */
.bk-swift .bk-more { margin-top: 16px; }
.bk-filed { margin-top: 12px; }
.bk-filed .bd-bic { font: 700 12px var(--eh-font-mono); color: var(--eh-blue-light); border: 0; }

/* Ownership and group */
.bk-group .bk-more { margin-top: 12px; }

/* Branch page: the institution-level facts the branch inherits, as jump chips. */
.bk-hq-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--eh-rule);
}
.bk-hq-strip-label { color: var(--eh-white-dim); margin-right: 4px; }

/* "In Elucidate research" */
.bk-mentions { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.bk-mentions li { font-size: 15px; line-height: 1.45; }
.bk-mentions a { color: var(--eh-white); text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.bk-mentions a:hover { border-color: var(--eh-ember-bright); }

/* The EFI link inside the product CTA copy. */
.bd-cta-link { color: var(--eh-white); text-decoration: none; border-bottom: 1px solid var(--eh-white-faint); transition: border-color .15s var(--eh-ease); }
.bd-cta-link:hover { border-color: var(--eh-ember-bright); }

/* Links in entity-page prose and facts read in the surrounding type, not the legacy Webflow link font. */
.bk-profile-text a, .bk-note a, .bk-notes a, .bk-legal-name a, .bk-fact dd a, .bk-scope a, .bk-mentions a {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
}

/* Jump targets clear the site's fixed navbar. */
.bk-detail-grid > .bd-card[id], #network, #correspondents, #respondents, #branches, #related, #claim, #sources { scroll-margin-top: 96px; }

@media (max-width: 1024px) {
  .bk-related { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
}
@media (max-width: 640px) {
  .bk-hq-strip-label { flex-basis: 100%; }
  .bk-idbar { gap: 8px; }
  .bk-id { padding: 8px 12px; }
  .bk-id strong { font-size: 14px; }
  .bk-related { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  a.bk-id.is-link, .bk-note a, .bk-legal-name a, .bk-mentions a, .bd-cta-link { transition: none; }
}
