/* Меню шапки с подразделами (11.09.2026): ПК — раскрытие по наведению, телефон — аккордеон в бургере. Разметка nav_data.py */
.fd-menu__item > a { position: relative; }
.fd-menu__item > a::after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: 8px;
  vertical-align: 3px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  opacity: 0.6;
  transition: transform 0.25s ease, opacity 0.25s ease;
}
.fd-menu__panel a { display: block; white-space: nowrap; color: var(--color-light); transition: background 0.2s ease, color 0.2s ease; }
.fd-menu__panel a:hover { color: var(--color-white); scale: 1; }
.fd-menu__cap {
  display: block;
  padding: 8px 12px 4px;
  font-family: 'FD-JB', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-grey);
}

/* ── ПК: выпадающая панель ── */
@media (min-width: 1101px) {
  .fd-menu__item { position: relative; }
  .fd-menu__item > a:hover { scale: 1; }
  .fd-menu__item:hover > a, .fd-menu__item:focus-within > a { color: var(--color-accent); }
  .fd-menu__item:hover > a::after, .fd-menu__item:focus-within > a::after { transform: rotate(225deg); vertical-align: 0; opacity: 1; }
  .fd-menu__sub {
    position: absolute;
    left: -16px;
    top: 100%;
    z-index: 40;
    padding-top: 14px;                 /* мостик между пунктом и панелью — курсор не «падает» */
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    clip-path: inset(0 0 100% 0);
    transition: opacity 0.18s ease, transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), clip-path 0.32s cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0s linear 0.32s;
  }
  .fd-menu__item:hover > .fd-menu__sub, .fd-menu__item:focus-within > .fd-menu__sub {
    opacity: 1;
    visibility: visible;
    transform: none;
    clip-path: inset(0 0 -40px 0);
    transition: opacity 0.15s ease, transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), clip-path 0.32s cubic-bezier(0.2, 0.8, 0.2, 1);
  }
  .fd-menu__panel {
    min-width: 280px;
    padding: 10px;
    background: var(--color-dark);
    border: 1px solid var(--color-border);
    border-radius: 14px;
    box-shadow: 0 24px 48px rgba(8, 12, 22, 0.55);
  }
  .fd-menu__panel--cols { display: grid; grid-template-columns: repeat(2, minmax(230px, max-content)); gap: 4px 16px; }
  .fd-menu__panel--cols .fd-menu__page { grid-column: 1 / -1; }
  .fd-menu__panel a { padding: 9px 12px; border-radius: 8px; font-size: 15px; line-height: 1.3; }
  .fd-menu__panel a:hover { background: rgba(245, 192, 74, 0.09); }
  .fd-menu__page { color: var(--color-accent); margin-bottom: 4px; border-bottom: 1px solid var(--color-border); border-radius: 8px 8px 0 0; }
  /* правые пункты: панель прижата к правому краю, чтобы не уходить за экран */
  .fd-menu__item:nth-last-child(-n+3) .fd-menu__sub { left: auto; right: -16px; }
}

/* ── телефон/планшет: аккордеон в бургере ── */
@media (max-width: 1100px) {
  html.fd-menu-open { overflow: hidden; }   /* только html: overflow на body делает body контейнером прокрутки и липкая шапка уезжает вверх */
  .mf-header__burger-con { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .mf-header__nav-list li.fd-menu__item { padding-block: 0; }
  .fd-menu__item > a { display: block; padding: 20px 36px; }
  .fd-menu__item > a::after { width: 8px; height: 8px; margin-left: 12px; vertical-align: 4px; }
  .fd-menu__item.is-open > a { color: var(--color-accent); }
  .fd-menu__item.is-open > a::after { transform: rotate(225deg); vertical-align: 0; opacity: 1; }
  .fd-menu__sub { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0s linear 0.35s; }
  .fd-menu__sub > .fd-menu__panel { min-height: 0; overflow: hidden; opacity: 0; transform: translateY(-6px); transition: opacity 0.25s ease, transform 0.3s ease; }
  .fd-menu__item.is-open > .fd-menu__sub { grid-template-rows: 1fr; visibility: visible; transition: grid-template-rows 0.35s cubic-bezier(0.2, 0.8, 0.2, 1); }
  .fd-menu__item.is-open > .fd-menu__sub > .fd-menu__panel { opacity: 1; transform: none; padding-bottom: 14px; }
  .fd-menu__panel a { padding: 10px 16px; font-size: 17px; line-height: 1.4; white-space: normal; }
  .fd-menu__page { color: var(--color-accent); }
  .fd-menu__cap { padding-top: 14px; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .fd-menu__sub, .fd-menu__sub > .fd-menu__panel, .fd-menu__item > a::after { transition: none !important; }
}