/* ================================================================
   Справочник (spravochnik.html) — переиспользует fw-* из firmware.css
================================================================ */

.ref-cats{margin-bottom:26px}

/* Подраздел внутри раздела */
.ref-sub{
  font-family:var(--font-m);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);margin:34px 0 14px;display:flex;align-items:center;gap:12px;
}
.ref-sub::after{content:"";flex:1;height:1px;background:var(--line)}
.ref-sub:first-child{margin-top:0}

/* Раздел (H2) */
.ref-sec{scroll-margin-top:150px}
.ref-sec-title{
  display:flex;align-items:baseline;gap:16px;margin:52px 0 20px;scroll-margin-top:150px;
}
.ref-sec-title:first-child{margin-top:0}
.ref-sec-title h2{font-size:clamp(24px,3.2vw,34px)}
.ref-sec-num{font-family:var(--font-m);font-size:13px;color:var(--accent);letter-spacing:.12em;flex-shrink:0}
.ref-sec-count{font-family:var(--font-m);font-size:11px;color:var(--faint);letter-spacing:.08em;white-space:nowrap}

/* Карточка-запись */
.ref-card{
  border:1px solid var(--line);border-radius:var(--r);background:var(--surface);
  padding:20px 24px;margin-bottom:12px;transition:border-color .2s;
}
.ref-card:hover{border-color:var(--line-strong)}
.ref-card h3,.ref-card h4{
  font-family:var(--font-d);font-size:16.5px;font-weight:700;text-transform:uppercase;
  line-height:1.25;margin-bottom:9px;color:var(--text);
}
.ref-card h3 mark,.ref-card h4 mark,.ref-card p mark{
  background:transparent;color:var(--accent);font-weight:700;
}
/* Заголовок-ссылка на свою статью */
.ref-card h4 a.ref-card-link{
  color:var(--text);text-decoration:none;transition:color .15s;
}
.ref-card h4 a.ref-card-link:hover{color:var(--accent)}
.ref-card h4 a.ref-card-link::after{content:" \2192";color:var(--faint);font-size:.85em}
.ref-card h4 a.ref-card-link:hover::after{color:var(--accent)}
.ref-card p{color:var(--muted);font-size:14.5px;line-height:1.65}
.ref-card p + p{margin-top:8px}
.ref-card p b{color:var(--text);font-weight:700}
.ref-card a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.ref-card a:hover{color:var(--accent-dim)}
.ref-card .mono{font-size:13px;color:var(--accent)}
.ref-card.hidden,.ref-sub.hidden,.ref-sec.hidden{display:none}

/* Ключевые слова под записью (для сео и подсказок поиска) */
.ref-keys{
  font-family:var(--font-m);font-size:11px;color:var(--faint);letter-spacing:.05em;
  margin-top:10px;display:flex;flex-wrap:wrap;gap:6px;
}
.ref-keys span{
  border:1px solid var(--line);border-radius:100px;padding:3px 9px;
}

/* Вводный абзац раздела/подраздела */
.ref-lead{color:var(--muted);font-size:14.5px;line-height:1.65;margin:-4px 0 16px;max-width:860px}
.ref-lead b{color:var(--text)}

/* Ссылка на первоисточник в карточке */
.ref-src{
  display:inline-flex;align-items:center;gap:6px;margin-top:10px;
  font-family:var(--font-m);font-size:11px;letter-spacing:.06em;color:var(--faint);
  text-decoration:none;transition:color .15s;
}
.ref-src:hover{color:var(--accent)}
.ref-src svg{width:12px;height:12px}

/* Якорная навигка по разделам в тулбаре */
.ref-toolbar-nav{display:flex;gap:8px;flex-wrap:wrap}

/* Счётчик результатов */
#ref-count{font-family:var(--font-m);font-size:12px;color:var(--faint);letter-spacing:.06em}
#ref-count b{color:var(--accent);font-weight:700}

/* Сообщение «ничего не найдено» */
#ref-empty{display:none}
#ref-empty.show{display:block}

/* SEO-текст */
.ref-seo{margin-top:56px;border-top:1px solid var(--line);padding-top:44px}
.ref-seo h2{font-size:clamp(22px,3vw,30px);margin-bottom:16px}
.ref-seo h2:not(:first-child){margin-top:34px}
.ref-seo p{color:var(--muted);font-size:15.5px;line-height:1.75;margin-bottom:14px}
.ref-seo b{color:var(--text)}
.ref-seo a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.ref-seo a:hover{color:var(--accent-dim)}
.ref-seo ul{margin:0 0 16px;padding-left:24px;color:var(--muted);font-size:15.5px;line-height:1.7}
.ref-seo li{margin-bottom:8px}
.ref-seo li b{color:var(--text)}

/* Подсветка совпадений при поиске */
.ref-card.hit{border-color:var(--accent)}

@media(max-width:760px){
  .ref-card{padding:16px 18px}
  .ref-card h3,.ref-card h4{font-size:15.5px}
  .ref-sec-title{flex-wrap:wrap;gap:8px}
  .ref-sec-count{width:100%}
}
