/* ==========================================================================
   全局样式 - GlobalTrade
   ========================================================================== */

/* Hero 区域基础样式 */
.hero-section {
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

/* 毛玻璃导航栏 */
.glass-nav {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* 卡片悬停上浮动画 */
.hover-card-up {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-card-up:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* ==========================================================================
   移动端汉堡菜单动画
   ========================================================================== */
.checkboxtoggler {
  width: 1.5em;
  display: flex;
  flex-direction: column;
  gap: 0.35em;
  cursor: pointer;
}

.checkboxtoggler .line {
  height: 0.15em;
  border-radius: 10em;
  transition-duration: 500ms;
}

#toggleChecker {
  display: none;
}

#toggleChecker:checked+#togglerLable .checkboxtoggler .line-1 {
  transform: rotate(45deg) translateY(0.35em) translateX(0.35em);
}

#toggleChecker:checked+#togglerLable .checkboxtoggler .line-2 {
  transform: rotate(-45deg) translateY(0em) translateX(0.05em);
}

#toggleChecker:checked+#togglerLable .checkboxtoggler .line-3 {
  transform: scaleX(0);
  transform-origin: left;
}

/* 移动端菜单显示控制 */
.mobile-menu {
  display: none;
}

.mobile-menu.open {
  display: block;
}