/* ============================================================
   top-navigation.css
   MOSINTER GROUP — 俄文顶部导航栏覆盖优化
   目的：解决俄文文字因单词较长导致的导航项拥挤、重叠问题
   加载顺序：在 main.css 之后引入，以覆盖原有规则
   ============================================================ */

/* ---------- 1. 增大 header 高度，为俄文长词提供更多垂直空间 ---------- */
:root {
    --header-h: 72px;
  }
  
  /* ---------- 2. 导航列表：收紧间距，避免在 1280px 以下宽度时导航项溢出 ---------- */
  .nav-list {
    gap: clamp(6px, 1.1vw, 18px);
    flex-wrap: nowrap;
    align-items: center;
  }
  
  /* ---------- 3. 导航链接：缩小字号，使俄文长词不溢出 ---------- */
  .nav-item > a {
    font-size: clamp(11.5px, 1vw, 13.5px);
    white-space: nowrap;
    padding: 8px 0;
    letter-spacing: -0.01em;
    line-height: 1.25;
  }
  
  /* ---------- 4. 带下拉箭头的导航项：限制最大宽度，防止单项过宽 ---------- */
  .nav-item.has-dropdown > a {
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  
  /* ---------- 5. 下拉箭头：缩小并紧贴文字 ---------- */
  .nav-arrow {
    font-size: 7px;
    margin-left: 1px;
    flex-shrink: 0;
    vertical-align: middle;
  }
  
  /* ---------- 6. 下拉菜单：增加最小宽度，适应俄文长条目 ---------- */
  .dropdown {
    min-width: 220px;
    max-width: 320px;
  }
  
  .dropdown li a {
    white-space: normal;
    word-break: break-word;
    line-height: 1.45;
    font-size: clamp(12.5px, 0.9vw, 14px);
    padding: 9px 18px;
  }
  
  /* ---------- 7. 语言切换器：紧凑化，节省导航空间 ---------- */
  .language-switcher {
    margin-left: clamp(2px, 0.4vw, 8px);
    flex-shrink: 0;
  }
  
  .language-current {
    min-width: 76px;
    height: 34px;
    padding: 0 7px;
    font-size: 12px;
    gap: 4px;
  }
  
  .language-icon {
    width: 13px;
    height: 13px;
  }
  
  /* ---------- 8. Logo 区域：修正折行问题，强制 MOSINTER GROUP 单行显示 ---------- */
  .logo-wrap {
    flex: 0 0 auto;
    min-width: 0;
  }
  
  .logo-text-wrap {
    min-width: max-content;
  }
  
  .logo-text {
    font-size: 1.15rem;
    white-space: nowrap;
  }
  
  .logo-tagline {
    white-space: nowrap;
    overflow: visible;
    font-size: 0.75rem;
    letter-spacing: 0.06em;
  }
  
  /* ---------- 9. 断点 1400px–1081px：俄文中等屏幕优化 ---------- */
  @media (max-width: 1400px) and (min-width: 1081px) {
    .nav-list {
      gap: clamp(5px, 0.9vw, 14px);
    }
  
    .nav-item > a {
      font-size: clamp(11px, 0.95vw, 13px);
      letter-spacing: -0.015em;
    }
  
    .nav-item.has-dropdown > a {
      max-width: 140px;
    }
  
    .language-current {
      min-width: 70px;
      padding: 0 6px;
      font-size: 11.5px;
    }
  }
  
  /* ---------- 10. 断点 1280px–1081px：进一步压缩 ---------- */
  @media (max-width: 1280px) and (min-width: 1081px) {
    :root {
      --content-pad: clamp(16px, 2.5vw, 40px);
    }
  
    .nav-list {
      gap: clamp(4px, 0.75vw, 10px);
    }
  
    .nav-item > a {
      font-size: clamp(10.5px, 0.88vw, 12.5px);
    }
  
    .nav-item.has-dropdown > a {
      max-width: 120px;
    }
  
    .logo-text {
      font-size: 1rem;
    }
  
    .logo-tagline {
      font-size: 0.68rem;
    }
  }
  
  /* ---------- 11. 断点 1080px–901px：最小桌面端 ---------- */
  @media (max-width: 1080px) and (min-width: 901px) {
    :root {
      --content-pad: 16px;
    }
  
    .nav-list {
      gap: 4px;
    }
  
    .nav-item > a {
      font-size: 11px;
      letter-spacing: -0.02em;
    }
  
    .nav-item.has-dropdown > a {
      max-width: 110px;
    }
  
    .logo-text {
      font-size: 0.9rem;
    }
  
    .logo-tagline {
      display: none;
    }
  
    .language-current {
      min-width: 64px;
      height: 32px;
      font-size: 11px;
      padding: 0 5px;
    }
  
    .language-icon {
      width: 12px;
      height: 12px;
    }
  }
  
  /* ---------- 12. 下拉菜单动画 ---------- */
  @keyframes dropFadeIn {
    from {
      opacity: 0;
      transform: translateX(-50%) translateY(-4px);
    }
    to {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }
  }
  
  /* ---------- 13. 激活状态下划线：适配缩小后的字号 ---------- */
  .nav-item.active > a::after,
  .nav-item.dropdown-active > a::after,
  .nav-item > a.active::after,
  .nav-item > a:hover::after {
    width: 36px;
  }
  
  /* ---------- 14. 防止 header-inner 溢出 ---------- */
  .header-inner {
    flex-wrap: nowrap;
    overflow: visible;
    gap: clamp(6px, 1vw, 16px);
  }
  
  /* ---------- 15. 导航容器：确保不超出 header 宽度 ---------- */
  .nav {
    flex: 1 1 0;
    min-width: 0;
    overflow: visible;
  }