/* cgou.shop — 动效层样式
 *
 * 核心纪律：所有"初始隐藏态"都以 html.gsap-ready 为前缀。
 * 那个类由 head 里的内联小脚本添加，且只在 JS 可用、用户未要求减弱动效时才加。
 * 因此：JS 不执行 / 用户开了"减弱动效" / 子主题被停用 ⇒ 内容 100% 原样可见。
 */

/* ---------- 滚动渐显 ---------- */
html.gsap-ready .gsap-reveal        { opacity: 0; transform: translateY(18px); }
html.gsap-ready .gsap-reveal--left  { transform: translateX(-18px); }
html.gsap-ready .gsap-reveal--right { transform: translateX(18px); }

/* ---------- 服务流程 5 步 ---------- */
.gsap-steps { position: relative; }
.gsap-steps li { transition: color 0.35s ease, opacity 0.35s ease; }
.gsap-steps li.is-active { color: inherit; }
.gsap-steps__line { transform-origin: top center; will-change: transform; }
.gsap-steps__dot { will-change: transform, opacity; }

/* ---------- FAQ 手风琴 ---------- */
.gsap-accordion__btn { cursor: pointer; }
.gsap-accordion__panel {
  overflow: hidden;
  height: 0; /* 折叠态；GSAP 做 height:auto 补间 */
}
html:not(.gsap-ready) .gsap-accordion__panel { height: auto; } /* 无 JS 时保持展开可读 */
.gsap-accordion__icon { display: inline-block; }

/* ---------- Track Order 时间轴（无 DrawSVG 时的 CSS 降级） ---------- */
.gsap-timeline__path { --progress: 0%; }
.gsap-timeline__dot { opacity: 0.4; transition: opacity 0.3s ease; }
.gsap-timeline__dot.is-active { opacity: 1; }
html:not(.gsap-ready) .gsap-timeline__dot { opacity: 1; }

/* ---------- 通用 ---------- */
.gsap-reveal { backface-visibility: hidden; }

/* 用户要求减弱动效：一律不隐藏、不位移 */
@media (prefers-reduced-motion: reduce) {
  html.gsap-ready .gsap-reveal { opacity: 1 !important; transform: none !important; }
  .gsap-accordion__panel { height: auto !important; }
}