/* Шапка и две шторки. Токены — из theme.css (--ee-*). Мобильный подход: шторка на всю ширину до 30rem, дальше — панель --ee-shutter-width. */
.ee-header { position: relative; z-index: 500; background: var(--ee-header-bg, var(--background)); color: var(--ee-header-fg, var(--foreground)); border-bottom: 1px solid var(--ee-header-border, transparent); }
.ee-header__bar {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .5rem;
  max-width: var(--ee-container); margin: 0 auto; min-height: var(--ee-header-height); padding: .35rem var(--ee-gutter);
}
.ee-header__logo { justify-self: center; }
.ee-header__logo a { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--foreground); }
.ee-header__logo .branding { height: 2.25rem; width: 2.25rem; }
.ee-header__logo .branding img { height: 100%; width: 100%; }
.ee-header__logo .heading-responsive-4xl { font-family: var(--ee-header-font, inherit); font-size: 1.125rem; font-weight: 700; letter-spacing: -.01em; line-height: 1.1; }
.ee-header__right { justify-self: end; display: flex; gap: .25rem; align-items: center; }
.ee-header__btn {
  display: inline-flex; align-items: center; gap: .5rem; min-height: 2.75rem; min-width: 2.75rem; justify-content: center;
  padding: .4rem .75rem; border: 1px solid transparent; border-radius: var(--ee-radius-pill);
  background: transparent; color: var(--foreground); font: inherit; font-weight: 600; cursor: pointer;
}
.ee-header__btn:hover { background: var(--secondary); }
.ee-header__btn[aria-expanded="true"] { background: var(--secondary); border-color: var(--border); }
.ee-header__btn--menu { justify-self: start; justify-content: flex-start; }
@media (max-width: 35.99rem) { .ee-header__btn-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } .ee-header__btn { padding: .4rem; } }

.ee-shutter-backdrop { position: fixed; inset: 0; background: var(--ee-overlay); opacity: 0; transition: opacity .25s; z-index: 900; }
.ee-shutter-backdrop.is-open { opacity: 1; }
.ee-shutter-backdrop[hidden] { display: none; }
.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, var(--background)); color: var(--ee-header-fg, var(--foreground));
  box-shadow: var(--shadow-2xl); transition: transform .28s ease, visibility 0s linear .28s;
  visibility: hidden;
}
.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 .28s ease, visibility 0s; }
.ee-shutter__head { display: flex; align-items: center; justify-content: space-between; padding: .75rem 1rem; border-bottom: 1px solid var(--border); }
.ee-shutter__title { font-weight: 700; font-size: 1.125rem; }
.ee-shutter__close { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%; background: transparent; color: inherit; cursor: pointer; }
.ee-shutter__close:hover { background: var(--secondary); }
.ee-shutter__body { flex: 1; overflow-y: auto; padding: 1rem; overscroll-behavior: contain; }
.ee-shutter-lock { overflow: hidden; }

.ee-search { position: relative; margin-bottom: 1.25rem; }
.ee-search input[type="search"] { padding-right: 3rem; border-radius: var(--ee-radius-pill); }
.ee-search__submit { position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); width: 2.25rem; height: 2.25rem; border: 0; border-radius: 50%; background: var(--primary); color: var(--primary-foreground); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }

/* меню внутри шторки: столбец крупных ссылок (переопределяет горизонтальное меню Mercury) */
.ee-shutter .ee-shutter__slot nav > nav, .ee-shutter .ee-shutter__slot nav { display: block; }
.ee-shutter .ee-shutter__slot ul { display: flex !important; flex-direction: column !important; gap: .15rem; margin: 0; padding: 0; list-style: none; }
.ee-shutter .ee-shutter__slot li { display: block !important; max-width: none !important; background: none !important; }
.ee-shutter .ee-shutter__slot li a { display: flex !important; min-height: 2.75rem; align-items: center; padding: .5rem .75rem !important; border-radius: var(--radius); font-size: 1.125rem; color: var(--foreground); text-decoration: none; }
.ee-shutter .ee-shutter__slot li a:hover, .ee-shutter .ee-shutter__slot li a:focus-visible { background: var(--secondary); color: var(--foreground); }   /* цвет задан явно: утилита Mercury делала текст белым при наведении */
.ee-shutter .ee-shutter__slot li a[aria-current="page"], .ee-shutter .ee-shutter__slot li a.is-active { background: var(--accent); font-weight: 700; }
.ee-shutter .ee-shutter__slot h2:not(.visually-hidden) { font-size: .8125rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted-foreground); margin: 1.25rem 0 .5rem; }

/* шторка 2: разделы и темы */
.ee-shutter--topics .view-topics-tree .views-row { display: block; margin-bottom: 1rem; }
.ee-shutter--topics .view-topics-tree h3 { font-size: 1rem; margin: 0 0 .25rem; }
.ee-shutter--topics .view-topics-tree ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.ee-shutter--topics .view-topics-tree li a, .ee-shutter--topics .view-directions-chips li a { display: inline-block; padding: .3rem .8rem; border-radius: var(--ee-radius-pill); background: var(--secondary); color: var(--foreground); text-decoration: none; font-size: .9375rem; }
.ee-shutter--topics .view-topics-tree li a:hover, .ee-shutter--topics .view-directions-chips li a:hover { background: var(--accent); }

@media (prefers-reduced-motion: reduce) { .ee-shutter, .ee-shutter-backdrop { transition: none; } }

.ee-shutter--topics .view-directions-hub .views-view-grid.horizontal { display: flex !important; flex-wrap: wrap; gap: .5rem; }
.ee-shutter--topics .view-topics-tree .views-row, .ee-shutter--topics .view-topics-tree .item-list { display: block; }
.ee-shutter--topics .view-topics-tree h3 { font-size: 1rem; margin: 1rem 0 .4rem; }
.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(--primary); text-decoration: underline; }
.ee-shutter--topics .view-topics-tree ul { display: flex !important; flex-direction: row !important; flex-wrap: wrap; }

/* кнопка-таблетка «Записаться»: в шапке на компьютере и внизу шторки 1 на планшете и телефоне */
.ee-header__cta { display: none; }
.ee-shutter__cta { display: flex; align-items: center; justify-content: center; min-height: 2.75rem; margin-top: 1.25rem; padding: .55rem 1.4rem; border-radius: var(--ee-radius-pill); background: var(--ee-header-accent, var(--primary)); color: var(--ee-header-accent-fg, var(--primary-foreground)) !important; font-weight: 600; text-decoration: none; }
.ee-shutter__cta:hover { filter: brightness(1.12); }

/* ===== Компьютер (от 64rem): обычная шапка в одну строку =====
 * Логотип слева, главное меню по центру (шторка 1 становится полосой меню: та же разметка, без клика), справа лупа
 * (раскрывает поле поиска), «Рубрики» (шторка 2) и кнопка-таблетка. Селекторы длиннее, чем у шторки (.ee-header .ee-shutter.ee-shutter--menu),
 * чтобы перебить и правила шторки, и запасной вид без JavaScript. */
@media (min-width: 64rem) {
  .ee-header {
    display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; column-gap: 1rem;
    max-width: var(--ee-container); margin-inline: auto; padding: .35rem var(--ee-gutter); min-height: var(--ee-header-height);
  }
  .ee-header__bar { display: contents; }
  .ee-header__logo { grid-column: 1; grid-row: 1; justify-self: start; }
  .ee-header__right { grid-column: 3; grid-row: 1; gap: .5rem; }
  .ee-header__btn--menu { display: none; }
  .ee-header__btn--topics .ee-header__btn-label { position: static; width: auto; height: auto; clip: auto; }
  .ee-header__right .ee-header__btn { padding: .4rem .6rem; }
  .ee-header__cta { display: inline-flex; align-items: center; min-height: 2.5rem; padding: .4rem 1.2rem; border-radius: var(--ee-radius-pill); background: var(--ee-header-accent, var(--primary)); color: var(--ee-header-accent-fg, var(--primary-foreground)); font-weight: 600; text-decoration: none; white-space: nowrap; }
  .ee-header__cta:hover { filter: brightness(1.12); }
  .ee-header__cta:focus-visible { outline: 3px solid var(--ee-focus); outline-offset: 2px; }
  .ee-shutter__cta { display: none; }

  .ee-header .ee-shutter.ee-shutter--menu {
    grid-column: 2; grid-row: 1; position: static; transform: none; visibility: visible; width: auto;
    background: transparent; box-shadow: none; border: 0; display: block; z-index: auto;
  }
  /* длинное меню (класс ee-header--menu-below ставит шаблон по длине меню и настройке ee_menu_position; до отрисовки, без скрипта): вторая строка шапки на всю ширину */
  .ee-header.ee-header--menu-below .ee-shutter.ee-shutter--menu { grid-column: 1 / -1; grid-row: 2; padding-bottom: .35rem; min-height: 2.75rem; }
  .ee-header.ee-header--menu-below .ee-header__logo { grid-row: 1; }
  .ee-header:not(.ee-header--menu-below) .ee-shutter--menu .ee-shutter__slot ul { flex-wrap: nowrap; }   /* в строку с логотипом: не переносится (высота шапки не меняется)*/
  .ee-header .ee-shutter--menu .ee-shutter__head { display: none; }
  .ee-header .ee-shutter--menu .ee-shutter__body { padding: 0; overflow: visible; display: flex; justify-content: center; }
  .ee-header .ee-shutter--menu .ee-install { display: none !important; }
  .ee-header .ee-shutter--menu .ee-shutter__slot ul { flex-direction: row !important; flex-wrap: wrap; justify-content: center; gap: .1rem; }
  .ee-header .ee-shutter--menu .ee-shutter__slot li a { min-height: 2.5rem; padding: .4rem .6rem !important; font-size: .875rem; font-weight: 600; border-radius: var(--ee-radius-pill); white-space: nowrap; }
  .ee-header .ee-shutter--menu .ee-shutter__slot li a:hover, .ee-header .ee-shutter--menu .ee-shutter__slot li a:focus-visible { background: var(--secondary); color: var(--foreground); }
  .ee-header .ee-shutter--menu .ee-shutter__slot li a[aria-current="page"], .ee-header .ee-shutter--menu .ee-shutter__slot li a.is-active { background: var(--accent); color: var(--primary); font-weight: 700; }
  /* пункт «Поиск» дублирует лупу в шапке */
  .ee-header .ee-shutter--menu .ee-shutter__slot li:has(> a[href="/poisk"]) { display: none !important; }

  /* поиск: лупа раскрывает поле под шапкой справа */
  .ee-header .ee-search { display: none; position: absolute; top: calc(100% + .25rem); right: var(--ee-gutter); width: min(24rem, calc(100vw - 2 * var(--ee-gutter))); margin: 0; padding: .75rem; background: var(--background); border: 1px solid var(--border); border-radius: var(--ee-radius-card); box-shadow: var(--shadow-lg); z-index: 600; }
  .ee-header.is-search-open .ee-search { display: block; }
  .ee-header .ee-search input[type="search"] { padding-right: 3.25rem; }
  .ee-header .ee-search__submit { right: 1rem; }
}

/* 64–80rem: места мало — «Рубрики» остаётся значком (подпись читают программы экрана), пункты чуть плотнее */
@media (min-width: 64rem) and (max-width: 79.99rem) {
  .ee-header__btn--topics .ee-header__btn-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .ee-header .ee-shutter--menu .ee-shutter__slot li a { padding: .4rem .4rem !important; font-size: .8125rem; }
  .ee-header { column-gap: .5rem; }
  .ee-header__logo .heading-responsive-4xl { font-size: 1rem; }
  .ee-header__right { gap: .15rem; }
  .ee-header__right .ee-header__btn { padding: .4rem .45rem; min-width: 2.5rem; }
  .ee-header__cta { padding: .4rem .9rem; }
}

/* ===== Кнопки «Спросить» / «Записаться» / «Следить за новыми» в шапке (управляет ask-bar.js: ранг 1 — главная, 2 — вторая) ===== */
.ee-header__ask, .ee-header__follow { display: none; }   /* «Спросить» на компьютере занимает место с первой отрисовки (см. media ниже), «Следить» появляется только когда скрипт её покажет */
[data-ee-ask-role][hidden] { display: none !important; }
@media (min-width: 64rem) {
  html .ee-header__ask { display: inline-flex; align-items: center; min-height: 2.5rem; padding: .4rem 1.2rem; border: 1px solid var(--ee-header-accent, var(--primary)); border-radius: var(--ee-radius-pill); background: var(--background); color: var(--ee-header-accent, var(--primary)); font: inherit; font-weight: 600; white-space: nowrap; cursor: pointer; }
  html .ee-header__ask:hover { background: var(--secondary); }
  html .ee-header__ask:focus-visible { outline: 3px solid var(--ee-focus); outline-offset: 2px; }
  html.ee-ask-ready .ee-header__follow { display: inline-flex; }
  html .ee-header [data-ee-ask-rank="1"] { background: var(--ee-header-accent, var(--primary)); color: var(--ee-header-accent-fg, var(--primary-foreground)); border-color: var(--ee-header-accent, var(--primary)); order: 2; }
  html .ee-header .ee-header__ask[data-ee-ask-rank="1"] { background: var(--ee-header-accent, var(--primary)); color: var(--ee-header-accent-fg, var(--primary-foreground)); }
  .ee-header [data-ee-ask-rank="2"] { order: 1; }
  .ee-header .ee-header__cta[data-ee-ask-rank="2"] { background: var(--background); color: var(--ee-header-accent, var(--primary)); border: 1px solid var(--ee-header-accent, var(--primary)); }
  .ee-header .ee-header__cta[data-ee-ask-rank="2"]:hover { background: var(--secondary); filter: none; }
  .ee-header__right { flex-wrap: nowrap; }
  /* закреплённая шапка на компьютере: внешний тег <header> страницы содержит ещё крошки и заголовок, поэтому он «растворяется» (display: contents),
     а закрепляется только область шапки (.region-header) — она остаётся сверху всё время прокрутки страницы */
  header:has(> .region-header .ee-header) { display: contents; }
  header:has(> .region-header .ee-header) > .region-header { position: sticky; top: 0; z-index: 500; }
  header:has(> .region-header .ee-header) .ee-header { box-shadow: 0 1px 0 var(--border); }
}
}

/* ===== Название сайта в шапке: положение, регистр, размер (настройки темы mercury.settings: ee_logo_align, ee_logo_case, ee_logo_size; по умолчанию как раньше) ===== */
.ee-header--caps .ee-header__logo .heading-responsive-4xl { text-transform: uppercase; letter-spacing: .06em; }
.ee-header.ee-header--logo-large .ee-header__logo a { gap: .5rem; white-space: nowrap; }
.ee-header.ee-header--logo-large .ee-header__logo .heading-responsive-4xl { font-size: 1.15rem; font-weight: 800; line-height: 1.05; letter-spacing: .05em; }
.ee-header.ee-header--logo-large .ee-header__logo .branding { height: 1.85rem; width: 1.85rem; flex: none; }
@media (min-width: 36rem) {
  .ee-header.ee-header--logo-large .ee-header__logo .heading-responsive-4xl { font-size: 1.4rem; }
  .ee-header.ee-header--logo-large .ee-header__logo .branding { height: 2.5rem; width: 2.5rem; }
}
@media (min-width: 64rem) {
  .ee-header.ee-header--logo-large .ee-header__logo a { gap: .75rem; }
  .ee-header.ee-header--logo-large .ee-header__logo .heading-responsive-4xl { font-size: 1.6rem; }
  .ee-header.ee-header--logo-large .ee-header__logo .branding { height: 3rem; width: 3rem; }
}
@media (min-width: 80rem) { .ee-header.ee-header--logo-large .ee-header__logo .heading-responsive-4xl { font-size: 1.85rem; } }
/* логотип слева на планшете и телефоне: название слева, справа кнопки (поиск, избранное, рубрики), бургер последним; бургер не перекрывает название */
@media (max-width: 63.99rem) {
  .ee-header--logo-left .ee-header__bar { grid-template-columns: minmax(0, 1fr) auto auto; }
  .ee-header--logo-left .ee-header__logo { grid-column: 1; grid-row: 1; justify-self: start; min-width: 0; }
  .ee-header--logo-left .ee-header__right { grid-column: 2; grid-row: 1; }
  .ee-header--logo-left .ee-header__btn--menu { grid-column: 3; grid-row: 1; justify-self: end; justify-content: center; }
}

/* ===== Поиск в шапке (компьютер): поле видно всегда, в покое компактное, при фокусе растёт влево поверх свободного места; соседи не сдвигаются ===== */
.ee-header__search { display: none; }
@media (min-width: 64rem) {
  .ee-header__search { display: block; position: relative; flex: none; width: var(--ee-header-search-w, 13rem); height: 2.5rem; margin-right: .25rem; z-index: 3; }
  .ee-header__search input[type="search"] {
    position: absolute; right: 0; top: 0; width: 100%; height: 100%; min-height: 0; padding: 0 2.5rem 0 1rem; border: 1px solid var(--ee-header-field-border, var(--input));
    border-radius: var(--ee-radius-pill); background: var(--ee-header-field-bg, var(--background)); color: var(--ee-header-fg, var(--foreground)); font-size: .9375rem;
    transition: width .2s ease, box-shadow .2s ease, border-color .2s ease;
  }
  .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, 24rem), 46vw); border-color: var(--ee-header-accent, var(--primary)); box-shadow: 0 0 0 3px color-mix(in oklab, var(--ee-header-accent, var(--primary)) 25%, transparent); outline: none; }
  .ee-header__search-submit { position: absolute; right: .3rem; top: 50%; z-index: 1; transform: translateY(-50%); width: 2rem; height: 2rem; border: 0; border-radius: 50%; background: transparent; color: var(--ee-header-fg, var(--foreground)); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
  .ee-header__search-submit:hover, .ee-header__search-submit:focus-visible { background: var(--secondary); }
  .ee-header__btn--icon { display: none; }   /* лупа-значок нужна только там, где поля нет (планшет, телефон) */
}
@media (prefers-reduced-motion: reduce) { .ee-header__search input[type="search"] { transition: none; } }

