  /*
  Theme Name: Hello Elementor Child
  Theme URI: https://yourwebsite.com/
  Description: Child theme for Hello Elementor
  Author: Your Name
  Author URI: https://yourwebsite.com/
  Template: hello-elementor
  Version: 1.0.0
  Text Domain: hello-elementor-child
  */

  /* 在这里写你的自定义 CSS */

/* =============================================================================
 * 页眉视觉（原 Elementor 自定义 CSS 迁入）
 * 滚动后 body.vsw-header-is-scrolled 与 .header_hover:hover 使用同一套样式，可删后台重复代码
 * ============================================================================= */

/* PART 1 - Before Lazy Load */
img[data-lazyloaded]{
  opacity: 0;
}

/* PART 2 - Upon Lazy Load */
img.litespeed-loaded{
  -webkit-transition: opacity .5s linear 0.2s;
  -moz-transition: opacity .5s linear 0.2s;
  transition: opacity .5s linear 0.2s;
  opacity: 1;
}

.header_hover {
  color: #fff;
}

.header_hover:hover,
body.vsw-header-is-scrolled .header_hover {
  color: #000;
}

.header_hover:hover .elementor-button,
body.vsw-header-is-scrolled .header_hover .elementor-button {
  color: #000 !important;
  fill: #000 !important;
}

.header_hover:hover
  .elementor-element.elementor-element-453cb8c.elementor-view-default
  .elementor-icon
  svg,
body.vsw-header-is-scrolled
  .header_hover
  .elementor-element.elementor-element-453cb8c.elementor-view-default
  .elementor-icon
  svg {
  fill: #000;
}

.header_hover:hover .elementor-widget-theme-site-logo img,
body.vsw-header-is-scrolled .header_hover .elementor-widget-theme-site-logo img {
  filter: none !important;
}

.elementor-location-header .elementor-nav-menu *,
[data-elementor-type="header"] .elementor-nav-menu * {
  color: inherit !important;
}

/* JHC_nav：让它跟 header_hover / 滚动态同样变色 */
.header_hover .jhc-nav #jhc-nav-menu > li > a,
body.vsw-header-is-scrolled .header_hover .jhc-nav #jhc-nav-menu > li > a {
  color: #fff !important;
  font-weight: 600 !important;
  transition: color .12s ease !important;
}

/* 鼠标进入整个导航块（不是点到链接）时，整排菜单立刻变黑 */
.header_hover:hover .jhc-nav #jhc-nav-menu > li > a {
  color: #000 !important;
}

/* 滚动后强制变黑（避免 sticky_offset=0 时顶部也被判定 active） */
body.vsw-header-is-scrolled .header_hover .jhc-nav #jhc-nav-menu > li > a,
.header_hover[data-vsw-scrolled-fx="1"] .jhc-nav #jhc-nav-menu > li > a {
  color: #000 !important;
}

.hdr-search-trigger {
  cursor: pointer;
}

/* Animated open/close (JS toggles .vsw-search-open on the real panel) */
.elementor-location-header .vsw-search-panel,
.elementor-location-header .hdr-search-panel,
[data-elementor-type="header"] .vsw-search-panel,
[data-elementor-type="header"] .hdr-search-panel {
  display: block !important; /* keep in flow for animation; use max-height to "hide" */
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 100% !important;
  z-index: 99999 !important;

  overflow: hidden !important;
  max-height: 0 !important;
  opacity: 0 !important;
  transform: translateY(-8px) !important;
  pointer-events: none !important;
  transition: max-height .28s ease, opacity .18s ease, transform .28s ease;
}

.elementor-location-header .vsw-search-panel.vsw-search-open,
.elementor-location-header .hdr-search-panel.vsw-search-open,
[data-elementor-type="header"] .vsw-search-panel.vsw-search-open,
[data-elementor-type="header"] .hdr-search-panel.vsw-search-open {
  max-height: 240px !important; /* enough for the search widget */
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}

/*
 * 页头「滚动后保持效果」—— custom.js 会在向下滚动超过约 12px 时加上：
 *   body.vsw-header-is-scrolled
 *   html.vsw-header-is-scrolled
 *   .elementor-location-header.vsw-is-scrolled
 * 回到顶部（滚动距离 ≤ 12px）时自动去掉。
 *
 * 把你在导航/顶栏 :hover 里写的样式，复制一份到下面选择器上，即可滚动后也常驻。
 * （阈值在 custom.js 里 bindHeaderScrollState 的 threshold 变量。）
 */
/*
 * 滚动后样式：同时覆盖 Elementor 页眉 + Hello 默认 #site-header（很多人没有 .elementor-location-header）
 */
body.vsw-header-is-scrolled .elementor-location-header,
body.vsw-header-is-scrolled [data-elementor-type="header"],
body.vsw-header-is-scrolled #site-header.site-header,
body.vsw-header-is-scrolled header.site-header,
.elementor-location-header.vsw-is-scrolled,
[data-elementor-type="header"].vsw-is-scrolled,
#site-header.site-header.vsw-is-scrolled,
header.site-header.vsw-is-scrolled {
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
  position: relative;
  z-index: 99;
}

/* Sticky 激活条、首屏 Section / Container（外层透明时靠内层显背景） */
body.vsw-header-is-scrolled .elementor-location-header .elementor-sticky--active,
body.vsw-header-is-scrolled [data-elementor-type="header"] .elementor-sticky--active,
body.vsw-header-is-scrolled .elementor-location-header > .e-con,
body.vsw-header-is-scrolled .elementor-location-header .elementor-top-section {
  background-color: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12) !important;
}

/*
 * 滚动时复刻 Elementor「导航菜单」指针 hover 结束态（与 widget-nav-menu 默认逻辑对齐）。
 * JS 会给主导航 a.elementor-item / Mega Menu .e-n-menu-title 加 .vsw-scroll-link-fx
 */
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::after,
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::before {
  opacity: 1 !important;
  transform: scale(1) !important;
}

/* 垂直菜单 */
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .elementor-nav-menu--layout-vertical
  .elementor-nav-menu
  > li
  > .elementor-item.vsw-scroll-link-fx::after,
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .elementor-nav-menu--layout-vertical
  .elementor-nav-menu
  > li
  > .elementor-item.vsw-scroll-link-fx::before {
  opacity: 1 !important;
  transform: scale(1) !important;
}

/* Slide：线下划线滑入结束位置 */
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-underline.e--animation-slide
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::after,
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-double-line.e--animation-slide
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::after {
  inset-inline-start: 0 !important;
  left: 0 !important;
  width: 100% !important;
  opacity: 1 !important;
  transform: scale(1) !important;
}

body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-double-line.e--animation-slide
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::before,
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-overline.e--animation-slide
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::before {
  left: 0 !important;
  width: 100% !important;
  opacity: 1 !important;
  transform: scale(1) !important;
}

/* Grow：线由点展开 */
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--animation-grow
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::after,
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--animation-grow
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::before {
  height: 3px !important;
  width: 100% !important;
  left: 0 !important;
  opacity: 1 !important;
  transform: scale(1) !important;
}

/* Drop-in / Drop-out：大致回到 hover 位置 */
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--animation-drop-in
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::before {
  top: 0 !important;
}
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--animation-drop-in
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::after {
  bottom: 0 !important;
}
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--animation-drop-out
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::before {
  top: 0 !important;
}
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--animation-drop-out
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::after {
  bottom: 0 !important;
}

/* Background 指针 grow */
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-background.e--animation-grow
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::before {
  opacity: 1 !important;
  transform: scale(1) !important;
}

/* Background shrink：结束态 */
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-background.e--animation-shrink
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::before {
  opacity: 1 !important;
  transform: scale(1) !important;
}

/* Framed draw / corners 简化结束态 */
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-framed
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::after,
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-framed
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx::before {
  opacity: 1 !important;
  width: 100% !important;
  height: 100% !important;
  transform: scale(1) !important;
}

/* Text 指针 */
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-text.e--animation-float
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx {
  transform: translateY(-8px) !important;
}
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-text.e--animation-sink
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx {
  transform: translateY(8px) !important;
}
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-text.e--animation-skew
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx {
  transform: skew(-8deg) !important;
}
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-text.e--animation-grow
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx {
  transform: scale(1.2) !important;
}
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-text.e--animation-shrink
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx {
  transform: scale(0.8) !important;
}
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e--pointer-text.e--animation-rotate
  .elementor-nav-menu--main
  > li
  > .elementor-item.vsw-scroll-link-fx {
  transform: rotate(6deg) !important;
}

/* Elementor Mega Menu（n-menu）：颜色/图标与 hover 一致 */
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e-n-menu-title.vsw-scroll-link-fx:not(.e-current) {
  color: var(--n-menu-title-color-hover) !important;
}
body.vsw-header-is-scrolled
  :is(.elementor-location-header, [data-elementor-type="header"])
  .e-n-menu-title.vsw-scroll-link-fx:not(.e-current)
  svg {
  fill: var(--n-menu-icon-color-hover, var(--n-menu-title-color-hover)) !important;
}

/* =============================================================================
 * Mobile header behavior
 * ============================================================================= */
/* Header sticks to top while scrolling (desktop + mobile). */
.elementor-location-header,
[data-elementor-type="header"],
#site-header.site-header,
header.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
}

