/* 页眉 3D logo（大 G 悬停转起来）—— 只作用于 .logo-badge[data-logo3d]
   设计：尺寸按原 lockup 比例（大 G 高占 84%、下方文字 16%），确保换成 3D 后页眉高度不变 */
.logo-badge[data-logo3d]{position:relative;line-height:0}
.logo-badge[data-logo3d] .l3d-fb{height:clamp(44px,6vh,58px);width:auto;display:block}
.logo-badge[data-logo3d] .l3d-stack{--h:clamp(44px,6vh,58px);display:none;flex-direction:column;align-items:center}
.logo-badge.l3d-ready .l3d-fb{display:none}
.logo-badge.l3d-ready .l3d-stack{display:inline-flex}

/* 尺寸严格按原 lockup 实测比例：整体高 h=clamp(44px,6vh,58px)
   大 G 占 70.6%（实测 440/623）、文字占 16.4%（102/623）、两者间距 13%
   ★ 2026-09-24：大 G 转到侧面/斜侧时会被画布边缘切掉（原先画布＝G 的占位，G 又填满 97.8% →
     一加俯仰角就溢出，实测下/右边缘贴死 = 老大说的「旋转起来不完整」）。
     做法：画布四周加一圈透明余量（--pad），用等值负外边距把画布拉回原占位，
     lockup 尺寸与页眉高度完全不变，只是旋转时有地方可转。 */
.logo-badge[data-logo3d] .l3d-stack{--pad:calc(var(--h) * .17)}
.logo-badge[data-logo3d] .l3d-cv{
  --g:calc(var(--h) * .706);                                 /* 大 G 本体（441×440，近正方） */
  height:calc(var(--g) + var(--pad) * 2);width:calc(var(--g) + var(--pad) * 2);
  margin:calc(var(--pad) * -1);                              /* 负外边距：占位仍是 var(--g) */
  display:block;cursor:pointer;touch-action:manipulation;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.28));   /* 深墨绿页眉上给一点分离感 */
}
.logo-badge[data-logo3d] .l3d-word{
  height:calc(var(--h) * .164);width:auto;display:block;margin-top:calc(var(--h) * .10);opacity:.97;
}
.logo-badge.l3d-ready:hover .l3d-cv{filter:drop-shadow(0 3px 10px rgba(205,232,107,.32))}

@media (max-width:760px){
  .logo-badge[data-logo3d] .l3d-fb{height:38px}
  .logo-badge[data-logo3d] .l3d-stack{--h:38px}
  .logo-badge[data-logo3d] .l3d-word{height:6.2px;margin-top:1px}
}
/* 低性能/弱网兜底：禁动效时连 WebGL 都不初始化（保留原 PNG） */
@media (prefers-reduced-motion:reduce){
  .logo-badge[data-logo3d] .l3d-stack{display:none !important}
  .logo-badge[data-logo3d] .l3d-fb{display:block !important}
}