/* ==========================================================================
   Esperanto. Шапка, подвал, сквозной блок «Связаться».
   ========================================================================== */

/* --- Шапка ------------------------------------------------------------------ */

.e-header { background: var(--e-paper); }

.e-header__strip { border-bottom: var(--e-rule-w) solid var(--e-rule); }
.e-header__strip-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  height: 36px;
  overflow: hidden;
}
.e-header__hours { text-transform: uppercase; white-space: nowrap; }
.e-header__messengers {
  display: flex;
  gap: 14px;
  align-items: center;
  font-family: var(--e-mono);
  font-size: var(--e-fs-meta);
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--e-ink-muted);
  white-space: nowrap;
}
@media (max-width: 779px) { .e-header__messengers { display: none; } }

.e-header__main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(20px, 2.6vw, 40px);
  padding-top: clamp(18px, 2.6vw, 34px);
  padding-bottom: clamp(14px, 2vw, 22px);
}
.e-header__logo { flex-shrink: 1; min-width: 0; }
.e-header__logo img { height: clamp(34px, 6vw, 78px); width: auto; }

.e-header__phones { flex-shrink: 0; text-align: right; }
.e-header__phones a {
  display: block;
  font-family: var(--e-serif);
  font-size: var(--e-fs-phone);
  line-height: 1.15;
  letter-spacing: -0.01em;
}
@media (max-width: 979px) { .e-header__phones { display: none; } }

.e-header__burger {
  flex-shrink: 0;
  background: none;
  border: var(--e-rule-w) solid var(--e-ink);
  padding: 13px 16px;
  font-family: var(--e-mono);
  font-size: var(--e-fs-meta);
  letter-spacing: var(--e-ls-meta);
  text-transform: uppercase;
}
@media (min-width: 980px) { .e-header__burger { display: none; } }

/* Циферблаты: сколько показывать, решает ширина окна.
   Уходят по одному слева, последний город остается дольше всех.
   Логика в CSS, а не в скрипте: нет дерганья при изменении размера. */
@media (max-width: 1059px) { .e-dials { display: none; } }
@media (max-width: 1199px) { .e-dials[data-count="5"] .e-dial:nth-child(-n+3),
                             .e-dials[data-count="4"] .e-dial:nth-child(-n+2),
                             .e-dials[data-count="3"] .e-dial:nth-child(1) { display: none; } }
@media (min-width: 1200px) and (max-width: 1339px) {
  .e-dials[data-count="5"] .e-dial:nth-child(-n+2),
  .e-dials[data-count="4"] .e-dial:nth-child(1) { display: none; }
}
@media (min-width: 1340px) and (max-width: 1499px) {
  .e-dials[data-count="5"] .e-dial:nth-child(1) { display: none; }
}

.e-dial { transition: transform var(--e-dur-base) var(--e-ease-elastic); }
a.e-dial:hover { transform: translateY(calc(var(--e-lift) * -1)); }
a.e-dial:hover .e-dial__city { color: var(--e-accent); }

/* Полоса меню: толстая линейка, волосяная, ряд, волосяная.
   Газетный прием: линейки разной толщины задают иерархию без цвета. */
.e-header__rule--thick { height: 3px; background: var(--e-ink); margin-bottom: 3px; }
.e-header__rule--thin  { height: 1px; background: var(--e-ink); }

.e-header__navrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  height: 52px;
}
@media (max-width: 979px) { .e-header__navbar { display: none; } }

.e-nav { display: flex; align-items: center; gap: clamp(16px, 2.4vw, 38px); margin: 0; padding: 0; list-style: none; min-width: 0; }
.e-nav a {
  display: block;
  font-family: var(--e-sans);
  font-size: 12.5px;
  font-weight: var(--e-fw-medium);
  letter-spacing: 0.11em;
  text-transform: uppercase;
  white-space: nowrap;
  padding: 15px 0;
  border-bottom: 2px solid transparent;
  transition: border-color var(--e-dur-base) var(--e-ease-settle), color var(--e-dur-fast) var(--e-ease-out);
}
.e-nav a:hover,
.e-nav .current-menu-item > a { border-bottom-color: var(--e-accent); }

/* Выпадающий список: раскрывается вниз, с тем же перелетом, что и все остальное */
.e-nav li { position: relative; }
.e-nav .sub-menu {
  position: absolute;
  top: 100%;
  left: -18px;
  min-width: 240px;
  margin: 0;
  padding: 8px 0;
  list-style: none;
  background: var(--e-paper);
  border: var(--e-rule-w) solid var(--e-ink);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity var(--e-dur-fast) var(--e-ease-out), transform var(--e-dur-base) var(--e-ease-elastic), visibility 0s linear var(--e-dur-base);
  z-index: 40;
}
.e-nav li:hover > .sub-menu,
.e-nav li:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 0s;
}
.e-nav .sub-menu a {
  padding: 10px 18px;
  text-transform: none;
  letter-spacing: 0;
  font-family: var(--e-serif);
  font-size: var(--e-fs-small);
  border-bottom: 0;
}
.e-nav .sub-menu a:hover { background: var(--e-paper-warm); color: var(--e-accent); }

.e-search { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.e-search input {
  background: transparent;
  border: 0;
  width: clamp(110px, 11vw, 150px);
  padding: 2px 0;
  text-align: right;
  font-family: var(--e-mono);
  font-size: var(--e-fs-meta);
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--e-ink-muted);
}
.e-search button { background: none; border: 0; padding: 0; display: flex; color: var(--e-ink-muted); }
.e-search button:hover { color: var(--e-accent); }

/* --- Мобильное меню ----------------------------------------------------------- */

.e-mobile { border-top: var(--e-rule-w) solid var(--e-rule); padding-block: 18px 28px; }
.e-mobile[hidden] { display: none; }
@media (min-width: 980px) { .e-mobile { display: none; } }

.e-mobile__search { display: flex; align-items: center; gap: 10px; border: var(--e-rule-w) solid var(--e-ink); padding: 12px 14px; margin-bottom: 14px; }
.e-mobile__search input { border: 0; background: transparent; flex: 1; min-width: 0; padding: 0; }
.e-mobile__search button { background: none; border: 0; font-family: var(--e-mono); font-size: var(--e-fs-meta); letter-spacing: var(--e-ls-meta); text-transform: uppercase; color: var(--e-ink-muted); }

.e-mobile__nav { margin: 0; padding: 0; list-style: none; }
.e-mobile__nav a { display: block; font-family: var(--e-serif); font-size: 22px; padding: 14px 0; border-bottom: var(--e-rule-w) solid var(--e-rule); }
.e-mobile__nav .sub-menu { margin: 0 0 0 18px; padding: 0; list-style: none; }
.e-mobile__nav .sub-menu a { font-size: var(--e-fs-small); padding: 11px 0; color: var(--e-ink-muted); }

.e-mobile__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }

/* --- Сквозной блок «Связаться» -------------------------------------------------- */

.e-contact { display: flex; flex-wrap: wrap; gap: var(--e-gap-lg); }
.e-contact__form { flex: 1 1 460px; min-width: 0; }
.e-contact__form h2 { margin-bottom: 16px; font-weight: var(--e-fw-regular); }
.e-contact__note { font-family: var(--e-serif); font-size: var(--e-fs-small); color: var(--e-ink-muted); margin-bottom: clamp(26px, 3vw, 38px); }

.e-contact__side {
  flex: 1 1 320px;
  min-width: 270px;
  border-left: var(--e-rule-w) solid var(--e-rule);
  padding-left: clamp(22px, 3vw, 44px);
}
.e-contact__lines { border-top: var(--e-rule-w) solid var(--e-rule); padding-block: clamp(18px, 2.4vw, 26px); display: flex; flex-direction: column; gap: 10px; }
.e-contact__phone { font-family: var(--e-serif); font-size: clamp(20px, 2.2vw, 26px); letter-spacing: -0.01em; }
.e-contact__link { font-family: var(--e-serif); font-size: var(--e-fs-body); border-bottom: var(--e-rule-w) solid var(--e-rule); align-self: flex-start; }
.e-contact__address { border-top: var(--e-rule-w) solid var(--e-rule); padding-top: clamp(18px, 2.4vw, 26px); font-family: var(--e-serif); font-size: var(--e-fs-xsmall); line-height: var(--e-lh-prose); color: var(--e-ink-muted); }
.e-contact__address .e-link { margin-top: 10px; }

/* --- Блок менеджера ----------------------------------------------------------- */

.e-manager { display: flex; gap: 18px; align-items: flex-start; margin-bottom: clamp(22px, 3vw, 32px); }
.e-manager__photo { width: 88px; height: 110px; flex-shrink: 0; object-fit: cover; }
.e-manager__photo--empty {
  display: grid;
  place-items: center;
  text-align: center;
  background: repeating-linear-gradient(135deg, #E1D8C6, #E1D8C6 6px, #EAE2D2 6px, #EAE2D2 12px);
  font-family: var(--e-mono);
  font-size: var(--e-fs-meta-xs);
  letter-spacing: 0.1em;
  color: #8B8375;
  line-height: 1.5;
}
.e-manager__name { font-family: var(--e-serif); font-size: 21px; line-height: 1.2; margin-block: 8px; }
.e-manager__text { font-family: var(--e-serif); font-size: var(--e-fs-xsmall); line-height: var(--e-lh-text); color: var(--e-ink-muted); }

/* --- Подвал --------------------------------------------------------------------- */

.e-footer { border-top: var(--e-rule-w) solid var(--e-ink); background: var(--e-paper-warm); padding-block: clamp(40px, 5vw, 72px); }
.e-footer__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: var(--e-gap-md); }
.e-footer__list { margin: 16px 0 0; padding: 0; list-style: none; }
.e-footer__list a { display: block; font-size: var(--e-fs-small); padding: 6px 0; }
.e-footer__list .sub-menu { display: none; }

.e-footer__contacts { margin-top: 16px; font-size: var(--e-fs-small); line-height: 1.65; color: var(--e-ink-body); }
.e-footer__contacts a { display: block; }
.e-footer__muted { color: var(--e-ink-muted); }
.e-footer__messengers { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; font-family: var(--e-mono); font-size: 11.5px; letter-spacing: 0.08em; }
.e-footer__messengers a { display: inline; }

.e-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 26px;
  justify-content: space-between;
  border-top: var(--e-rule-w) solid var(--e-rule);
  margin-top: clamp(32px, 4vw, 56px);
  padding-top: 20px;
  font-size: 12.5px;
  color: var(--e-ink-muted);
}
.e-footer__legal { display: flex; flex-wrap: wrap; gap: 18px; }

/* --- Куки-баннер ------------------------------------------------------------------ */

.e-cookies[hidden] { display: none; }
.e-cookies__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding-block: 16px; }
.e-cookies__text { font-size: 13.5px; line-height: 1.5; max-width: 70ch; color: #D8D2C6; }
.e-cookies__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.e-cookies__btn { padding: 11px 22px; font-size: 14px; white-space: nowrap; }
.e-cookies .e-btn--ghost { border-color: #6B655C; color: #D8D2C6; }
.e-cookies .e-btn--ghost::before { background: #2B2721; }
.e-cookies__btn--accept { background: var(--e-paper); color: var(--e-ink); }
