/* ============================================================
   V3.5 · 星球 logo + 桌面端导航菜单居中
   logo 依据素材重建：截角二十面体（足球结构）线框 + 左上实心面
   叠加层：不改 style.css / v3.css 旧样式
   ============================================================ */

/* ---------- 1. 星球 logo ---------- */
.brand-mark{
  width:40px;height:40px;border-radius:10px;
  background:transparent;
  box-shadow:none;
  display:inline-flex;align-items:center;justify-content:center;
  transition:transform var(--dur-base) var(--ease-brand);
}
.brand-mark img{width:40px;height:40px;display:block}
.brand:hover .brand-mark{transform:translateY(-2px) rotate(-8deg)}

/* ---------- 2. 桌面端（≥980px）：菜单绝对居中 + CTA 贴容器右缘 ----------
   nav 脱离文档流铺满 header，菜单组几何居中；CTA 在 nav 内绝对定位到右缘。
   <980px 完全走原有布局，移动端抽屉行为零改动。 */
@media (min-width:980px){
  .header-inner{position:relative}
  .main-nav{
    position:absolute;left:0;right:0;top:50%;
    display:flex;align-items:center;justify-content:center;
    transform:translateY(-50%);
    pointer-events:none;              /* 覆盖层不挡 brand 点击 */
  }
  .main-nav > *{pointer-events:auto}
  .main-nav > .btn-primary{
    position:absolute;right:24px;top:50%;transform:translateY(-50%);
  }
  /* 下拉面板防溢出：中间项居中弹出，首项左对齐、末项右对齐 */
  .nav-panel{left:50%;transform:translate(-50%,8px)}
  .nav-item:hover > .nav-panel,
  .nav-item:focus-within > .nav-panel{transform:translate(-50%,0)}
  .nav-item:first-child .nav-panel{left:-16px;transform:translate(0,8px)}
  .nav-item:first-child:hover > .nav-panel,
  .nav-item:first-child:focus-within > .nav-panel{transform:translate(0,0)}
  .nav-item:last-child .nav-panel{left:auto;right:-16px;transform:translate(0,8px)}
  .nav-item:last-child:hover > .nav-panel,
  .nav-item:last-child:focus-within > .nav-panel{transform:translate(0,0)}
}

/* ---------- 3. 修复既有移动端溢出 bug ----------
   hero-grid 子项 min-width:auto 使 H1 min-content(437px) 撑宽单列 grid，
   整页 scrollWidth 485 > 视口 390，粘性 header 跟宽导致汉堡按钮被顶出屏外。 */
.hero-grid > *{min-width:0}
.hero h1{overflow-wrap:anywhere}

@media (max-width:980px){
  .brand{max-width:calc(100vw - 96px)}   /* brand 收缩保险，汉堡永远留在屏内 */
  .brand-text{min-width:0}
}
