/* BLANKOM – Downloads library. Same design language as the product page; scoped to .bh-d. */

.bh-d {
  --p-ink: #14181D;
  --p-ink2: #3C4651;
  --p-muted: #5B6673;
  --p-bg: #F3F5F7;
  --p-paper: #FCFDFD;
  --p-line: #DCE1E6;
  --p-blue: #1560B0;
  --p-blue-dark: #0E4A8A;
  --p-tint: #EEF3F9;
  --p-tline: #D3DEEA;
  --p-night: #14181D;
  --p-disp: "Barlow Semi Condensed", "Arial Narrow", Arial, sans-serif;
  --p-body: "IBM Plex Sans", "Segoe UI", Arial, sans-serif;
  --p-mono: "IBM Plex Mono", Consolas, "Courier New", monospace;

  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  background: var(--p-bg);
  color: var(--p-ink);
  font-family: var(--p-body);
  font-size: 16px;
  line-height: 1.6;
}
.bh-d *, .bh-d *::before, .bh-d *::after { box-sizing: border-box; }
.bh-d h1, .bh-d h2, .bh-d h3 { font-family: var(--p-disp); margin: 0; color: var(--p-ink); text-wrap: balance; }
.bh-d p { margin: 0; }
.bh-d a { color: var(--p-blue); text-decoration: none; }
.bh-d a:hover { text-decoration: underline; }
.bh-d-metak { font-family: var(--p-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--p-muted); display: block; margin-bottom: 10px; }

.bh-d-btn {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--p-blue); color: #fff !important; border-radius: 4px;
  padding: 0 24px; height: 50px; font-weight: 600; font-size: 15.5px;
  text-decoration: none !important; transition: background .15s ease; white-space: nowrap;
}
.bh-d-btn:hover { background: var(--p-blue-dark); }
.bh-d-btn--sm { height: 42px; padding: 0 18px; font-size: 14px; }

/* ---------- hero ---------- */
.bh-d-hero { background: var(--p-night); color: #fff; padding: 56px 64px 48px; }
.bh-d-hero__in { max-width: 900px; display: flex; flex-direction: column; gap: 16px; }
.bh-d-eyebrow { font-family: var(--p-mono); font-size: 12.5px; letter-spacing: .12em; text-transform: uppercase; color: #8E99A4; }
.bh-d-h1 { font-size: 48px; line-height: 1.05; font-weight: 700; letter-spacing: -.01em; color: #fff !important; }
.bh-d-lede { font-size: 17.5px; line-height: 1.6; color: #B9C2CC; max-width: 720px; }
.bh-d-stats { display: flex; gap: 44px; margin-top: 14px; border-top: 1px solid rgba(255,255,255,.12); padding-top: 20px; }
.bh-d-stats > div { display: flex; flex-direction: column; gap: 2px; }
.bh-d-stats strong { font-family: var(--p-disp); font-size: 34px; font-weight: 700; line-height: 1; color: #fff; }
.bh-d-stats span { font-family: var(--p-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #7E8A96; }

/* ---------- layout ---------- */
.bh-d-body { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 48px; padding: 48px 64px 64px; align-items: start; }
.bh-d-side { position: sticky; top: 100px; display: flex; flex-direction: column; gap: 28px; }

.bh-d-search input {
  width: 100%; height: 46px; border: 1px solid var(--p-line); border-radius: 4px; background: #fff;
  padding: 0 14px; font-family: var(--p-body); font-size: 15px; color: var(--p-ink);
}
.bh-d-search input:focus { outline: none; border-color: var(--p-blue); box-shadow: 0 0 0 3px rgba(21,96,176,.12); }

.bh-d-filter { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.bh-d-chip {
  appearance: none; width: 100%; text-align: left; cursor: pointer;
  background: transparent; border: 1px solid transparent; border-radius: 4px;
  padding: 8px 10px; font-family: var(--p-body); font-size: 14.5px; color: var(--p-ink2);
  display: flex; justify-content: space-between; align-items: center; gap: 10px; line-height: 1.35;
}
.bh-d-chip span { font-family: var(--p-mono); font-size: 11.5px; color: var(--p-muted); }
.bh-d-chip:hover { background: #fff; border-color: var(--p-line); }
.bh-d-chip.is-on { background: var(--p-tint); border-color: var(--p-tline); color: var(--p-ink); font-weight: 600; }
.bh-d-chip.is-on span { color: var(--p-blue); }

.bh-d-ask { background: var(--p-tint); border: 1px solid var(--p-tline); border-radius: 6px; padding: 22px; display: flex; flex-direction: column; gap: 12px; }
.bh-d-ask h3 { font-size: 19px; font-weight: 600; line-height: 1.2; }
.bh-d-ask p { font-size: 14px; line-height: 1.55; color: var(--p-ink2); }
.bh-d-ask .bh-d-btn { align-self: flex-start; }

/* ---------- list ---------- */
.bh-d-bar { display: flex; justify-content: space-between; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--p-line); margin-bottom: 4px; }
.bh-d-count { font-family: var(--p-mono); font-size: 12.5px; color: var(--p-muted); letter-spacing: .03em; }
.bh-d-reset { appearance: none; background: none; border: 0; cursor: pointer; font-family: var(--p-body); font-size: 14px; color: var(--p-blue); padding: 0; }
.bh-d-reset:hover { text-decoration: underline; }

.bh-d-list { list-style: none; margin: 0; padding: 0; }
.bh-d-item {
  display: grid; grid-template-columns: 46px minmax(0, 1fr) auto auto; gap: 18px; align-items: center;
  padding: 16px 4px; border-bottom: 1px solid var(--p-line);
}
.bh-d-item[hidden] { display: none; }
.bh-d-item:hover { background: var(--p-paper); }

.bh-d-ext {
  width: 40px; height: 48px; border: 1px solid var(--p-tline); border-radius: 3px; background: var(--p-tint);
  display: flex; align-items: flex-end; justify-content: center; padding-bottom: 6px;
  font-family: var(--p-mono); font-size: 9.5px; letter-spacing: .04em; color: var(--p-blue);
}
.bh-d-ext--zip, .bh-d-ext--bin, .bh-d-ext--exe, .bh-d-ext--img { background: #F1F6EF; border-color: #CFE0C8; color: #3F7A34; }

.bh-d-info { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.bh-d-title { font-size: 16px; font-weight: 500; line-height: 1.35; color: var(--p-ink); }
.bh-d-title:hover { color: var(--p-blue); }
.bh-d-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 13.5px; color: var(--p-muted); }
.bh-d-tag { font-family: var(--p-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--p-ink2); background: #EDF0F3; border: 1px solid var(--p-line); border-radius: 2px; padding: 3px 7px; }
.bh-d-for a { color: var(--p-blue); }

.bh-d-file { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-family: var(--p-mono); font-size: 11.5px; color: var(--p-muted); white-space: nowrap; }

.bh-d-get {
  border: 1px solid #B8C2CC; border-radius: 4px; padding: 0 16px; height: 38px;
  display: inline-flex; align-items: center; font-size: 14px; font-weight: 500;
  color: var(--p-ink) !important; text-decoration: none !important; white-space: nowrap;
}
.bh-d-get:hover { border-color: var(--p-blue); background: var(--p-blue); color: #fff !important; }

.bh-d-empty { padding: 40px 4px; font-size: 16px; color: var(--p-muted); }

/* ---------- compliance note ---------- */
.bh-d-note { background: var(--p-paper); border-top: 1px solid var(--p-line); padding: 44px 64px; }
.bh-d-note__in { display: flex; justify-content: space-between; align-items: center; gap: 44px; flex-wrap: wrap; }
.bh-d-note h2 { font-size: 26px; font-weight: 600; margin-bottom: 8px; }
.bh-d-note p { font-size: 15.5px; line-height: 1.6; color: var(--p-ink2); max-width: 760px; }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .bh-d-hero { padding: 40px 32px; }
  .bh-d-h1 { font-size: 36px; }
  .bh-d-body { grid-template-columns: 1fr; gap: 28px; padding: 32px; }
  .bh-d-side { position: static; }
  .bh-d-filter { flex-direction: row; flex-wrap: wrap; }
  .bh-d-chip { width: auto; border-color: var(--p-line); background: #fff; }
  .bh-d-note { padding: 36px 32px; }
}
@media (max-width: 700px) {
  .bh-d-hero { padding: 28px 18px; }
  .bh-d-h1 { font-size: 28px; }
  .bh-d-lede { font-size: 16px; }
  .bh-d-stats { gap: 24px; }
  .bh-d-stats strong { font-size: 26px; }
  .bh-d-body { padding: 24px 18px; }
  .bh-d-item { grid-template-columns: 36px minmax(0, 1fr); gap: 12px; padding: 14px 0; }
  .bh-d-file { grid-column: 2; flex-direction: row; gap: 10px; align-items: center; }
  .bh-d-get { grid-column: 2; justify-self: start; }
  .bh-d-note { padding: 28px 18px; }
  .bh-d-note__in { gap: 20px; }
}
