/* SP Nav Style — navigation bar tweaks (stable, no shrink) */

/* 1. Header 纯色背景（全站所有页面统一，不做透明效果） */
html body #masthead .ast-primary-header-bar,
html body #masthead .main-header-bar,
html body #masthead .site-header {
	background-color: #ffffff !important;
}

/* 2. 导航菜单字体 + 颜色 */
.ast-builder-menu .main-header-menu .menu-link {
	font-weight: 500 !important;
	color: #333333 !important;
}

/* 3. Account 图标：固定黑色 + 白色描边 */
a[href*="my-account"] .account-icon path,
a[href*="my-account"] .account-icon circle {
	fill: #111111 !important;
	stroke: #ffffff !important;
	stroke-width: 1.5px !important;
	paint-order: stroke !important;
}

/* 4. 禁用 Astra 的 logo SVG 颜色滤镜（防止 logo 变黑块）+ 固定长方形 logo 高度 + 禁过渡干扰
   v2.3.3: logo 高度 +10%（桌面 22px, 手机 18px） */
#masthead .site-logo-img img {
	filter: none !important;
	transition: none !important;
	height: 22px !important;
	width: auto !important;
	max-width: none !important;
}
@media (max-width: 921px) {
	#masthead .site-logo-img img {
		height: 18px !important;
	}
}

/* 5. 内容垂直居中（Astra 默认居中，此处兜底） */
#masthead .ast-builder-grid-row {
	align-items: center !important;
}

/* 6. 滚动收缩（v2.2.1）：只收缩框体高度（JS 驱动），内容零缩放。
      flex 居中 → 每一帧内容视觉中心 = 容器中心（垂直居中恒成立）。
      内容不缩放 → 文字大小不变、水平坐标不动。
      只在桌面（>=922px）生效；JS 未加载时以下规则对默认布局无副作用。 */
@media (min-width: 922px) {
	#masthead .ast-primary-header-bar,
	#masthead .main-header-bar {
		display: flex !important;
		align-items: center !important;
		transition: none !important;
	}
	#masthead .site-primary-header-wrap,
	#masthead .main-header-container {
		width: 100% !important;
		flex: 1 1 100% !important;
	}
}

/* 7. 滚动后导航栏外阴影（与下方页面内容区分，由 JS 加 .sp-nav-shadow） */
#masthead.sp-nav-shadow {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
}

/* ===== 8. v2.4.0 首页 Prada 式沉浸导航（仅 body.home） =====
   初始：导航 fixed 悬浮、全透明、logo/菜单/图标反白，与 hero 视频融为一体。
   滚动 >60px：加 .sp-nav-solid，平滑过渡回白底深字。其他页面零影响。 */
body.home #masthead {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	z-index: 999 !important;
	background-color: transparent !important;
	box-shadow: none !important;
	transition: background-color .3s ease, box-shadow .3s ease;
}
body.home #masthead .ast-primary-header-bar,
body.home #masthead .main-header-bar,
body.home #masthead .site-header {
	background-color: transparent !important;
	box-shadow: none !important;
	border-bottom: none !important;
}
body.home #masthead .ast-builder-menu .main-header-menu .menu-link {
	color: #FFFFFF !important;
}
body.home #masthead .site-logo-img img {
	filter: brightness(0) invert(1) !important;
}
body.home #masthead a[href*="my-account"] .account-icon path,
body.home #masthead a[href*="my-account"] .account-icon circle {
	fill: #ffffff !important;
	stroke: rgba(255,255,255,0) !important;
}
body.home #masthead .ast-button-wrap .menu-toggle .menu-toggle-icon,
body.home #masthead .main-header-menu-toggle {
	color: #FFFFFF !important;
}
/* 滚动后：白底深字（.sp-nav-solid 由 JS 切换） */
body.home #masthead.sp-nav-solid {
	background-color: #ffffff !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10) !important;
}
body.home #masthead.sp-nav-solid .ast-builder-menu .main-header-menu .menu-link {
	color: #333333 !important;
}
body.home #masthead.sp-nav-solid .site-logo-img img {
	filter: none !important;
}
body.home #masthead.sp-nav-solid a[href*="my-account"] .account-icon path,
body.home #masthead.sp-nav-solid a[href*="my-account"] .account-icon circle {
	fill: #111111 !important;
	stroke: #ffffff !important;
	stroke-width: 1.5px !important;
	paint-order: stroke !important;
}
body.home #masthead.sp-nav-solid .ast-button-wrap .menu-toggle .menu-toggle-icon,
body.home #masthead.sp-nav-solid .main-header-menu-toggle {
	color: #333333 !important;
}