/* Ссылки вместо <div> в шапке.

   В макете directory_hubs пункты меню и кнопки — это <div> и <span>: он рисует
   вид, а не поведение. На живом сайте это должны быть <a>, иначе по ним нельзя
   перейти и их не видит поисковик. У <a> другое поведение по умолчанию —
   строчный элемент с подчёркиванием и синим цветом, — поэтому пункты выпадающих
   списков вставали в строку вместо столбца. Здесь только то, что возвращает
   ссылкам вид исходных блоков; сами значения дизайна не меняются. */

/* Вес селекторов поднят намеренно.

   На хабах поверх дизайн-пакета продолжают грузиться bootstrap и default.css
   сайта, а там:
       a:not(.btn) { text-decoration: underline }   (вес 0,1,1)
       a:hover     { color: #008c44 }               (вес 0,1,1)
   Правило вида .lp-ihdr-71 весит 0,1,0 и проигрывало — в меню на наведении
   вылезали зелёный цвет и подчёркивание. Поэтому здесь селекторы с тегом и
   явными состояниями: a.lp-ihdr-71 (0,1,1, но объявлен позже) и
   a.lp-ihdr-71:hover (0,2,1). Никаких !important — вес достаточен. */

a.lp-ihdr-71,
a.lp-ihdr-71:link,
a.lp-ihdr-71:visited,
a.lp-ihdr-71:hover,
a.lp-ihdr-71:focus,
a.lp-ihdr-71:active,
a.lp-ihdr-81,
a.lp-ihdr-81:link,
a.lp-ihdr-81:visited,
a.lp-ihdr-81:hover,
a.lp-ihdr-81:focus,
a.lp-ihdr-81:active {
	display: block;
	color: inherit;
	text-decoration: none;
}

a.lp-ihdr-27, a.lp-ihdr-27:link, a.lp-ihdr-27:visited, a.lp-ihdr-27:hover, a.lp-ihdr-27:focus,
a.lp-ihdr-28, a.lp-ihdr-28:link, a.lp-ihdr-28:visited, a.lp-ihdr-28:hover, a.lp-ihdr-28:focus,
a.lp-ihdr-74, a.lp-ihdr-74:link, a.lp-ihdr-74:visited, a.lp-ihdr-74:hover, a.lp-ihdr-74:focus,
a.lp-ihdr-75, a.lp-ihdr-75:link, a.lp-ihdr-75:visited, a.lp-ihdr-75:hover, a.lp-ihdr-75:focus {
	text-decoration: none;
}

/* Строки списка: цвет и фон при наведении задаёт дизайн, подчёркивание от
   bootstrap нужно снять во всех состояниях */
a.lp-sdir-11,
a.lp-sdir-11:link,
a.lp-sdir-11:visited,
a.lp-sdir-11:hover,
a.lp-sdir-11:focus,
a.lp-sdir-11:active {
	text-decoration: none;
}

a.lp-sdir-11:hover {
	color: var(--lp-green);
}

/* Подвал тёмный: своё подчёркивание при наведении у него есть (footer-base.css),
   а зелёный цвет от default.css там неуместен */
a.lp-foot-5,
a.lp-foot-5:link,
a.lp-foot-5:visited,
a.lp-foot-5:hover,
a.lp-foot-5:focus,
a.lp-foot-5:active {
	color: #fff;
}

a.lp-foot-5 {
	text-decoration: none;
}

a.lp-foot-5:hover {
	text-decoration: underline;
	text-decoration-color: rgba(255, 255, 255, .8);
}

/* Логотип обёрнут в ссылку на главную — обёртка не должна ломать выравнивание */
.lp-ihdr-4 > a,
.lp-ihdr-4 > a:hover {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
}

/* Поле поиска в шапке — это <form>, у макета там был <div> */
form.lp-ihdr-13 {
	margin: 0;
}

/* Плотность и раскладка списков во всех хабах.

   1. Колонка уже. В макете max-width 1360 — на списках это растягивало строки
      во всю ширину экрана, и глаз терял связь названия со счётчиком. 1100 —
      ширина контентной колонки из того же пакета (search.html).

   2. Порядок заполнения — по строкам (правка владельца 20.08): разделы идут
      слева направо, потом переносятся на следующий ряд. Колонки CSS давали
      обратный порядок — сверху вниз по колонке, — это их устройство, а не
      настройка. Поэтому сетка, а не columns.

      Сетка выравнивает ячейки ряда по самой высокой, из-за чего под короткой
      группой остаётся пустое место. align-items:start убирает растягивание
      самой группы, но высоту ряда задаёт самая длинная — это неизбежная плата
      за порядок по строкам, и она же видна у Fordaq.

   3. Плотность строк — та, что подобрали на странице стран; подошла всем
      хабам, поэтому общая. */

.lp-sdir-1 {
	max-width: 1100px;
}

.lp-sdir-9 {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: start;
	gap: 36px 50px;
}

.lp-sdir-11 {
	padding: 6px 10px;
}

.lp-sdir-12 {
	line-height: 20px;
}

@media (max-width: 900px) {
	.lp-sdir-9 {grid-template-columns: repeat(2, minmax(0, 1fr));}
}

@media (max-width: 620px) {
	.lp-sdir-9 {grid-template-columns: minmax(0, 1fr);}
}

/* Обе полосы шапки не уезжают при прокрутке (правка владельца 20.08).

   В макете липкой была только верхняя, зелёная (.lp-ihdr-1, sticky top:0,
   z-index:90) — навигация по разделам при прокрутке уезжала вверх. Делаем
   липкой и её: смещение 42px — это высота зелёной полосы (.lp-ihdr-3),
   z-index на единицу ниже, чтобы зелёная оставалась сверху.

   Ниже 700px белая полоса и так скрыта (медиазапрос в internal-header.css),
   поэтому смещение там роли не играет. */

.lp-ihdr-65 {
	position: sticky;
	top: 42px;
	z-index: 89;
}
