/* ===========================================================
   壹隔® 首屏「实景 + 光粒子」层 v1（2026-10-29）
   主色 RAL5002 ｜ 回滚：删掉 index.html 里的 hero-scene.css / hero-scene.js 两行
   组成：照片层(.hs-photo) → 光扫(.hs-sweep) → 粒子(.hs-fx) → 原有文字(.hero-copy)
   =========================================================== */

.page-hero.hs-on{background:#0d0f22;overflow:hidden}
.page-hero.hs-on .hero-3d{display:none!important}          /* 关掉旧 3D 画布 */
.page-hero.hs-on .hero-grid{position:relative;z-index:5}
.page-hero.hs-on::before,.page-hero.hs-on::after{display:none}

.hs-photo{position:absolute;inset:-4% -6% -4% -6%;z-index:1;pointer-events:none;
  will-change:transform;transition:transform .9s cubic-bezier(.16,1,.3,1)}
.hs-photo img{width:100%;height:100%;object-fit:cover;display:block;
  animation:hs-drift 26s ease-in-out infinite alternate;filter:saturate(1.04) contrast(1.03)}
@keyframes hs-drift{from{transform:scale(1.03)}to{transform:scale(1.10) translate3d(-1.2%,-.8%,0)}}

/* 左侧遮罩：减弱到"刚好托住文字"，把阳光留给照片自己发亮 */
.hs-scrim{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,
    rgba(252,252,255,.97) 0%,
    rgba(252,252,255,.95) 30%,
    rgba(252,252,255,.78) 44%,
    rgba(252,252,255,.34) 56%,
    rgba(252,252,255,0) 68%)}
/* 文字区再压一层柔光，保证小字可读（尤其是副标题与标签） */
.hs-scrim::before{content:"";position:absolute;left:0;top:0;bottom:0;width:52%;
  background:radial-gradient(120% 90% at 12% 50%,rgba(252,252,255,.92),rgba(252,252,255,.55) 58%,transparent 78%)}
.hs-scrim::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(252,252,255,.18),transparent 26%,transparent 74%,rgba(12,14,36,.22))}

/* ---------- 阳光层（独立可动） ---------- */
.hs-sun{position:absolute;inset:-4% -6%;z-index:3;pointer-events:none;
  mix-blend-mode:screen;will-change:transform,opacity}
.hs-sun img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  will-change:transform,opacity}
.hs-sun .s-soft{animation:hs-sun-soft 19s ease-in-out infinite alternate}
.hs-sun .s-hot{animation:hs-sun-hot 13s ease-in-out infinite alternate}
@keyframes hs-sun-soft{
  0%{transform:translate3d(0,0,0) scale(1.00);opacity:.50}
  45%{opacity:.92}
  100%{transform:translate3d(-1.8%,1.2%,0) scale(1.055);opacity:.66}
}
@keyframes hs-sun-hot{
  0%{transform:translate3d(0,0,0) scale(1.00) rotate(0deg);opacity:.42}
  58%{opacity:.96}
  100%{transform:translate3d(2.4%,-1.6%,0) scale(1.075) rotate(-1.4deg);opacity:.58}
}

/* 斜向光扫：每 9 秒一次，克制 */
.hs-sweep{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden;mix-blend-mode:screen}
.hs-sweep::before{content:"";position:absolute;top:-30%;bottom:-30%;width:42%;
  left:-60%;transform:rotate(14deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.42) 45%,rgba(216,184,119,.28) 60%,transparent);
  animation:hs-sweep 9s cubic-bezier(.4,0,.2,1) infinite}
@keyframes hs-sweep{0%,72%{left:-60%;opacity:0}76%{opacity:.9}100%{left:120%;opacity:0}}

/* 粒子画布 */
.hs-fx{position:absolute;inset:0;z-index:5;pointer-events:none;mix-blend-mode:screen}

/* 小屏：改成上照片下文字，遮罩改为上下渐变 */
@media (max-width:900px){
  .hs-photo{inset:-2%}
  .hs-scrim{background:linear-gradient(180deg,
    rgba(252,252,255,.30) 0%,
    rgba(252,252,255,.86) 46%,
    rgba(252,252,255,.97) 62%,
    #fcfcff 78%)}
  .hs-sweep{display:none}
}

@media (prefers-reduced-motion:reduce){
  .hs-photo img{animation:none}
  .hs-sweep{display:none}
}
