/* ===================================================================
   斯普乐供应链 (SPL) - PC端专属区域视口滚动动效样式表 (Scroll Motion)
   Powered by GSAP 3.12+ & ScrollTrigger (本地离线版)
   规则: 仅限 PC 桌面端 (> 992px) 生效，手机端绝对豁免
=================================================================== */

/* 移动端与平板端绝对豁免：全部元素默认展示，无任何阻碍与隐藏 */
@media (max-width: 992px) {
  .gsap-reveal-hero,
  .gsap-reveal-stagger,
  .gsap-reveal-left,
  .gsap-reveal-right,
  .gsap-parallax-img,
  .stat-card-motion {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
  }
}

/* PC 端 (> 992px) 专属工业级科技动效增强 */
@media (min-width: 993px) {
  /* 基础透视视口，赋予子元素 3D 空间感 */
  .perspective-container,
  .grid-2, .grid-3, .grid-4,
  .products-grid, .cases-grid, .news-grid, .solutions-grid {
    perspective: 1400px !important;
  }

  /* 动画执行期间彻底屏蔽 CSS transition，防止与 GSAP 逐帧插值冲突导致中途卡住 */
  [data-spl-animating="true"] {
    transition: none !important;
  }

  /* GPU 独立硬件加速 60FPS 极速视差背景架构 */
  .spl-parallax-container {
    position: relative !important;
    overflow: hidden !important;
  }

  .spl-parallax-bg {
    position: absolute !important;
    top: -30% !important;
    left: 0 !important;
    width: 100% !important;
    height: 165% !important;
    background-size: cover !important;
    background-position: center !important;
    z-index: 1 !important;
    pointer-events: none !important;
    will-change: transform !important;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden !important;
  }

  .spl-parallax-container > .container,
  .spl-parallax-container > .about-hero-content,
  .spl-parallax-container > .mission-content,
  .spl-parallax-container > .hero-content-wrapper {
    position: relative !important;
    z-index: 5 !important;
  }

  /* 卡片飞入定格瞬间的高光脉冲 */
  .motion-glow-pop {
    animation: glowPop 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  @keyframes glowPop {
    0% {
      box-shadow: 0 0 0 rgba(255, 121, 0, 0);
    }
    35% {
      box-shadow: 0 16px 36px rgba(255, 121, 0, 0.25), 0 0 20px rgba(255, 121, 0, 0.35);
      border-color: rgba(255, 121, 0, 0.6);
    }
    100% {
      box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05);
    }
  }

  /* 核心挑战与方案的对冲卡片容器 */
  .collision-container {
    overflow: hidden;
    perspective: 1000px;
  }

  /* 数字卡片高光状态 */
  .stat-card-motion {
    position: relative;
    transition: box-shadow 0.4s ease, border-color 0.4s ease;
  }

  .stat-card-motion.stat-active-glow {
    box-shadow: 0 10px 30px rgba(255, 121, 0, 0.15);
    border-color: rgba(255, 121, 0, 0.4);
  }

  /* 3D 卡片微互动 */
  .card-3d-hover {
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
    will-change: transform;
  }

  .card-3d-hover:hover {
    transform: translateY(-8px) scale(1.015);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.08), 0 0 20px rgba(255, 121, 0, 0.18);
    border-color: var(--sungrow-orange);
  }

  /* 视差大图平滑裁剪容器 */
  .parallax-viewport {
    overflow: hidden;
    position: relative;
  }

  .parallax-viewport img {
    will-change: transform;
  }

  /* 动态发光流线指示器 */
  .motion-beam-line {
    position: relative;
    overflow: hidden;
  }

  .motion-beam-line::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 121, 0, 0.8), transparent);
    animation: beamSweep 3s infinite ease-in-out;
  }

  @keyframes beamSweep {
    0% { left: -100%; }
    50%, 100% { left: 200%; }
  }
}