/* ==========================================================================
   Global Installed Base map — site theme bridge
   Loaded after global-map.css. Overrides only the section's own custom
   properties and typography, so the map component itself stays untouched and
   can be replaced wholesale on the next version.
   ========================================================================== */

/* The map ships with Barlow / Barlow Condensed. The site loads IBM Plex Sans,
   IBM Plex Sans Condensed and IBM Plex Mono and nothing else, so without this
   the section would silently fall back to system-ui and read as foreign. */
.bsm,
.bsm .bsm-lede,
.bsm .bsm-card { font-family: var(--s); }

.bsm .bsm-title,
.bsm .bsm-card-name,
.bsm .bsm-callout-lead { font-family: var(--c); }

.bsm .bsm-eyebrow,
.bsm .bsm-region-btn,
.bsm .bsm-callout-sectors { font-family: var(--m); }

/* ---- colour: inherit the site's palette rather than the map's own ---- */

.bsm {
  --bsm-bg: var(--bg);
  --bsm-ink: var(--th);
  --bsm-ink-soft: var(--tm);
  --bsm-accent: var(--sec);
  --bsm-hairline: var(--bd);
  --bsm-card-bg: var(--pn);
  --bsm-card-border: var(--bd);
  --bsm-card-shadow: var(--s2);
  --bsm-land: #dfe4ea;
  --bsm-land-stroke: #c7cfd8;
  --bsm-grid: rgba(32, 51, 134, 0.07);
  --bsm-accent-soft: rgba(57, 140, 209, 0.14);
  --bsm-chip-active-bg: rgba(57, 140, 209, 0.09);
}

[data-theme="dark"] .bsm {
  --bsm-land: #171d29;
  --bsm-land-stroke: #232b3a;
  --bsm-grid: rgba(210, 215, 224, 0.045);
  --bsm-accent: #5a9ed8;
  --bsm-accent-soft: rgba(90, 158, 216, 0.16);
  --bsm-chip-active-bg: rgba(90, 158, 216, 0.1);
  --bsm-glow: drop-shadow(0 0 6px rgba(90, 158, 216, 0.5));
}

/* Section headings match the site's scale rather than the component's own,
   so the map doesn't shout louder than the sections above and below it. */
.bsm .bsm-title {
  font-size: clamp(1.6rem, 3.2vw, 2.35rem);
  letter-spacing: -0.01em;
}
.bsm .bsm-eyebrow { letter-spacing: 0.18em; }

/* The site draws its own section rules; the component's built-in top padding
   would double them up. */
.bsm { padding-top: clamp(40px, 6vw, 76px); }

/* Chips pick up the site's 2px radius. */
.bsm .bsm-region-btn { border-radius: var(--r); }