/**
 * Шапка сайта и две шторки (меню, рубрики). Значения — токены src/theme.css (--ee-header-*, --ee-brand-*, --ee-logo-size, --ee-control).
 * Телефон и планшет: строка «логотип — кнопки — бургер»; шторки выезжают панелями. Компьютер (от 64rem): логотип, меню, поиск и кнопки в одной шапке
 * (меню — либо в строке с логотипом, либо второй строкой, если пункты длинные: класс ee-header--menu-below ставит шаблон до отрисовки, страница не прыгает).
 * Шапка закреплена на всех размерах: закрепляется область .region-header, внешний <header> страницы «растворяется» (display: contents).
 */
header:has(> .region-header .ee-header) { display: contents; }
header:has(> .region-header .ee-header) > .region-header { position: sticky; top: 0; z-index: 500; background: var(--ee-header-bg); border-bottom: var(--ee-line) solid var(--ee-header-border); }
.ee-header { position: relative; background: transparent; color: var(--ee-header-fg); }
.ee-header__bar { box-sizing: border-box; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--ee-s1); max-width: var(--ee-container); min-height: var(--ee-header-height); margin: 0 auto; padding: var(--ee-s1) var(--ee-gutter); }
.ee-header__logo { grid-column: 1; grid-row: 1; display: flex; align-items: center; min-width: 0; }
.ee-header__logo a { display: inline-flex; align-items: center; gap: var(--ee-s3); color: var(--ee-header-fg); text-decoration: none; }
.ee-header__logo .branding { flex: none; width: var(--ee-logo-size); height: var(--ee-logo-size); }
.ee-header__logo .branding img { width: 100%; height: 100%; }
.ee-header__logo .heading-responsive-4xl { font-family: var(--ee-font-brand); font-size: var(--ee-fs-brand); font-weight: var(--ee-fw-heading); line-height: 1; letter-spacing: var(--ee-brand-tracking); text-transform: var(--ee-brand-transform); white-space: nowrap; color: var(--ee-header-fg); }
.ee-header__right { grid-column: 2; grid-row: 1; display: flex; align-items: center; gap: var(--ee-s1); }
.ee-header__btn--menu { grid-column: 3; grid-row: 1; justify-self: end; }
.ee-header__btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--ee-s2); min-width: var(--ee-control); min-height: var(--ee-control); padding: 0 var(--ee-s3); border: var(--ee-line) solid transparent; border-radius: var(--ee-radius-pill); background: transparent; color: var(--ee-header-fg); font: inherit; font-weight: var(--ee-fw-strong); cursor: pointer; }
.ee-header__btn:hover { background: var(--ee-btn-soft); border-color: var(--ee-btn-accent); }
.ee-header__btn[aria-expanded="true"] { background: var(--secondary); border-color: var(--border); }
.ee-header__btn--topics, .ee-header__fav { display: none; }   /* на телефоне рубрики и избранное — в шторке меню */
.ee-header__btn-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
@media (min-width: 36rem) { .ee-header__btn--topics, .ee-header__fav { display: inline-flex; } }
.ee-header .ee-header__search, .ee-header .ee-header__cta, .ee-header .ee-header__ask, .ee-header .ee-header__follow { display: none; }   /* поле поиска и кнопки шапки — только на компьютере */

/* ---------- шторки ---------- */
.ee-shutter-backdrop { position: fixed; inset: 0; z-index: 900; background: var(--ee-overlay); opacity: 0; transition: opacity var(--ee-motion); }
.ee-shutter-backdrop.is-open { opacity: 1; }
.ee-shutter { position: fixed; top: 0; bottom: 0; z-index: 1000; display: flex; flex-direction: column; width: min(100vw, var(--ee-shutter-width)); background: var(--ee-header-bg); color: var(--ee-header-fg); box-shadow: var(--shadow-2xl); visibility: hidden; transition: transform var(--ee-motion), visibility 0s linear var(--ee-motion); }
.ee-shutter--menu { left: 0; transform: translateX(-102%); }
.ee-shutter--topics { right: 0; transform: translateX(102%); }
.ee-shutter.is-open { transform: none; visibility: visible; transition: transform var(--ee-motion), visibility 0s; }
.ee-shutter__head { display: flex; align-items: center; justify-content: space-between; padding: var(--ee-s3) var(--ee-s4); border-bottom: var(--ee-line) solid var(--ee-header-border, var(--border)); }
.ee-shutter__title { font-family: var(--ee-font-brand); font-size: var(--ee-fs-h4); font-weight: var(--ee-fw-heading); text-transform: var(--ee-brand-transform); }
.ee-shutter__close { display: inline-flex; align-items: center; justify-content: center; width: var(--ee-control); height: var(--ee-control); border: 0; border-radius: 50%; background: transparent; color: inherit; cursor: pointer; }
.ee-shutter__close:hover { background: var(--secondary); }
.ee-shutter__body { display: flex; flex: 1; flex-direction: column; padding: var(--ee-s4); overflow-y: auto; overscroll-behavior: contain; }
.ee-shutter-lock { overflow: hidden; }
.ee-shutter__cta { position: sticky; bottom: 0; margin-top: auto; box-shadow: 0 calc(-1 * var(--ee-s3)) var(--ee-s5) calc(-1 * var(--ee-s3)) color-mix(in oklab, var(--ee-header-fg) 35%, transparent); }
.ee-shutter__slot h2:not(.visually-hidden) { margin: var(--ee-s5) 0 var(--ee-s2); font-size: var(--ee-fs-meta); line-height: var(--ee-lh-meta); text-transform: uppercase; letter-spacing: var(--ee-tracking-caps); color: var(--muted-foreground); }

/* поиск в шторке */
.ee-search { position: relative; margin-bottom: var(--ee-s5); }
.ee-search input[type="search"] { padding-right: calc(var(--ee-control) + var(--ee-s2)); border-radius: var(--ee-radius-pill); }
.ee-search__submit { position: absolute; top: 50%; right: 0; display: inline-flex; align-items: center; justify-content: center; width: var(--ee-control); height: var(--ee-control); border: 0; border-radius: 50%; background: var(--ee-btn-accent); color: var(--ee-btn-accent-fg); cursor: pointer; transform: translateY(-50%); }
.ee-search__submit:hover { background: var(--ee-btn-hover); }

/* меню в шторке: столбец крупных ссылок */
.ee-shutter .ee-menu { display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0; list-style: none; }
.ee-shutter .ee-menu__link { display: flex; align-items: center; min-height: var(--ee-control); padding: var(--ee-s3) var(--ee-s2); border-bottom: var(--ee-line) solid var(--ee-header-border, var(--border)); color: var(--ee-header-fg); font-size: var(--ee-fs-body); font-weight: var(--ee-fw-medium); text-decoration: none; }
.ee-shutter .ee-menu__link:hover, .ee-shutter .ee-menu__link:focus-visible { background: var(--secondary); }
.ee-shutter .ee-menu__link[aria-current="page"] { color: var(--ee-btn-accent); font-weight: var(--ee-fw-strong); }

/* шторка 2: разделы и темы */
.ee-shutter--topics .view-topics-tree .views-row, .ee-shutter--topics .view-topics-tree .item-list { display: block; margin-bottom: var(--ee-s4); }
.ee-shutter--topics .view-topics-tree h3 { margin: var(--ee-s4) 0 var(--ee-s2); font-size: var(--ee-fs-body); line-height: var(--ee-lh-body); }
.ee-shutter--topics .view-topics-tree h3 a { color: var(--foreground); text-decoration: none; }
.ee-shutter--topics .view-topics-tree h3 a:hover { color: var(--ee-btn-accent); text-decoration: underline; }
.ee-shutter--topics .view-topics-tree ul { display: flex; flex-flow: row wrap; gap: var(--ee-s2); margin: 0; padding: 0; list-style: none; }
.ee-shutter--topics .view-topics-tree li a, .ee-shutter--topics .view-directions-chips li a { display: inline-block; padding: var(--ee-s1) var(--ee-s3); border-radius: var(--ee-radius-pill); background: var(--secondary); color: var(--foreground); font-size: var(--ee-fs-card); text-decoration: none; }
.ee-shutter--topics .view-topics-tree li a:hover, .ee-shutter--topics .view-directions-chips li a:hover { background: var(--accent); }
.ee-shutter--topics .view-directions-hub .views-view-grid.horizontal { display: flex; flex-wrap: wrap; gap: var(--ee-s2); }

/* ---------- компьютер (от 64rem) ---------- */
@media (min-width: 64rem) {
  .ee-header { box-sizing: border-box; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; column-gap: var(--ee-s5); max-width: var(--ee-container); margin-inline: auto; padding: 0 var(--ee-gutter); }
  .ee-header__bar { display: contents; }
  .ee-header__logo, .ee-header__right { min-height: var(--ee-header-row); }
  .ee-header__logo { grid-column: 1; justify-self: start; }
  .ee-header__right { grid-column: 3; gap: var(--ee-s2); flex-wrap: nowrap; }
  .ee-header__btn--menu, .ee-header__btn--icon, .ee-shutter--menu .ee-shutter__head, .ee-shutter--menu .ee-search, .ee-shutter--menu .ee-shutter__cta, .ee-shutter--menu .ee-install { display: none; }
  .ee-header__btn--topics { display: inline-flex; }
  .ee-header :is(.ee-header__ask, .ee-header__cta) { display: inline-flex; white-space: nowrap; }
  html.ee-ask-ready .ee-header .ee-header__follow { display: inline-flex; white-space: nowrap; }
  .ee-header [data-ee-ask-rank="1"] { order: 2; }
  .ee-header [data-ee-ask-rank="2"] { order: 1; }
  /* шторка меню становится полосой меню в шапке */
  .ee-header .ee-shutter--menu { grid-column: 2; grid-row: 1; position: static; z-index: auto; display: block; width: auto; background: transparent; box-shadow: none; transform: none; visibility: visible; }
  .ee-header .ee-shutter--menu .ee-shutter__body { display: flex; flex-direction: row; justify-content: center; padding: 0; overflow: visible; }
  .ee-header .ee-shutter--menu .ee-menu { flex-flow: row nowrap; justify-content: center; gap: var(--ee-s1); }
  .ee-header .ee-shutter--menu .ee-menu__link { min-height: var(--ee-menu-row); padding: var(--ee-s2) var(--ee-s3); border-bottom: var(--ee-line-strong) solid transparent; border-radius: 0; font-size: var(--ee-fs-card); white-space: nowrap; }
  .ee-header .ee-shutter--menu .ee-menu__link:hover { background: none; color: var(--ee-btn-accent); border-bottom-color: var(--ee-header-border, var(--border)); }
  .ee-header .ee-shutter--menu .ee-menu__link[aria-current="page"] { border-bottom-color: var(--ee-btn-accent); color: var(--ee-header-fg); }
  .ee-header .ee-shutter--menu .ee-shutter__slot li:has(> a[href="/poisk"]) { display: none; }   /* пункт «Поиск» дублирует поле в шапке */
  /* меню второй строкой: полоса на всю ширину; вторая строка уезжает при прокрутке, первая остаётся закреплённой */
  .ee-header--menu-below .ee-shutter--menu { grid-column: 1 / -1; grid-row: 2; min-height: var(--ee-menu-row); border-top: var(--ee-line) solid var(--ee-header-border, var(--border)); }
  header:has(> .region-header .ee-header--menu-below) > .region-header { top: calc(-1 * (var(--ee-menu-row) + var(--ee-line))); }
  /* поле поиска: видно всегда, в покое компактное, при фокусе растёт влево поверх свободного места, соседей не сдвигает */
  .ee-header .ee-header__search { position: relative; z-index: 3; display: block; flex: none; width: var(--ee-header-search-w); height: var(--ee-control); margin-right: var(--ee-s1); }
  .ee-header__search input[type="search"] { position: absolute; top: 0; right: 0; width: 100%; height: 100%; min-height: 0; padding: 0 calc(var(--ee-control) + var(--ee-s1)) 0 var(--ee-s4); border-radius: var(--ee-radius-pill); transition: width var(--ee-motion), box-shadow var(--ee-motion), border-color var(--ee-motion); }
  .ee-header__search input[type="search"]::-webkit-search-cancel-button { display: none; }
  .ee-header__search input[type="search"]:focus { width: min(var(--ee-header-search-w-open), 46vw); }
  .ee-header__search-submit { position: absolute; top: 50%; right: 0; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: var(--ee-control); height: var(--ee-control); border: 0; border-radius: 50%; background: transparent; color: var(--ee-header-fg); cursor: pointer; transform: translateY(-50%); }
  .ee-header__search-submit:hover, .ee-header__search-submit:focus-visible { background: var(--ee-btn-soft); box-shadow: inset 0 0 0 var(--ee-line-strong) var(--ee-btn-accent); }
}
/* 64–80rem: места мало — «Рубрики» остаётся значком, пункты плотнее, меню не переносится */
@media (min-width: 64rem) and (max-width: 79.99rem) {
  .ee-header { column-gap: var(--ee-s2); }
  .ee-header__right { gap: var(--ee-s1); }
  .ee-header .ee-shutter--menu .ee-menu { gap: 0; }
  .ee-header .ee-shutter--menu .ee-menu__link { padding-inline: var(--ee-s2); font-size: var(--ee-fs-meta); }
  .ee-header .ee-header__ask, .ee-header .ee-header__cta { padding-inline: var(--ee-s4); }
}
@media (min-width: 80rem) { .ee-header__btn--topics .ee-header__btn-label { position: static; width: auto; height: auto; clip: auto; } }