/* ============================================================
   航辰门户 · 科技感光影特效层 (2026-08-05)
   设计基调：金色晨光 × 深绿田野 × 米白 —— 高级科技感，非霓虹
   ============================================================ */

/* ---------- 全局粒子画布 ---------- */
.fx-canvas{
  position:fixed;inset:0;z-index:1;pointer-events:none;
}
/* 内容层抬升到粒子之上（注意：不得覆盖 .site-header 的 fixed 定位） */
body > section,
body > footer{position:relative;z-index:2}
/* 导航保持固定置顶，层级高于一切内容（修复被 hero 遮挡问题） */
.site-header{position:fixed !important;z-index:1000}

/* ---------- 首屏：极光光斑 ---------- */
.hero{background:#0e1410}
.hero-aurora{position:absolute;inset:0;overflow:hidden;z-index:1;pointer-events:none}
.orb{
  position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;
  mix-blend-mode:screen;will-change:transform;
}
.orb-1{
  width:46vw;height:46vw;left:-12vw;top:-18vh;
  background:radial-gradient(circle,rgba(212,169,92,.55),rgba(212,169,92,0) 70%);
  animation:orbDrift1 16s ease-in-out infinite alternate;
}
.orb-2{
  width:38vw;height:38vw;right:-10vw;top:22vh;
  background:radial-gradient(circle,rgba(255,214,140,.42),rgba(255,214,140,0) 70%);
  animation:orbDrift2 20s ease-in-out infinite alternate;
}
.orb-3{
  width:30vw;height:30vw;left:28vw;bottom:-16vh;
  background:radial-gradient(circle,rgba(122,180,110,.35),rgba(122,180,110,0) 70%);
  animation:orbDrift3 24s ease-in-out infinite alternate;
}
@keyframes orbDrift1{
  0%{transform:translate(0,0) scale(1)}
  50%{transform:translate(10vw,6vh) scale(1.18)}
  100%{transform:translate(-4vw,12vh) scale(.92)}
}
@keyframes orbDrift2{
  0%{transform:translate(0,0) scale(1)}
  50%{transform:translate(-9vw,-7vh) scale(1.12)}
  100%{transform:translate(5vw,4vh) scale(.9)}
}
@keyframes orbDrift3{
  0%{transform:translate(0,0) scale(1)}
  50%{transform:translate(6vw,-8vh) scale(1.2)}
  100%{transform:translate(-7vw,-3vh) scale(.95)}
}
/* 首屏内容层级 */
.hero-content{z-index:3}
.hero-scroll{z-index:3}

/* 首屏：光线扫过 */
.hero-sweep{
  position:absolute;top:-20%;bottom:-20%;width:34%;left:-40%;
  background:linear-gradient(105deg,transparent 0%,rgba(255,236,190,.10) 45%,rgba(255,236,190,.22) 50%,rgba(255,236,190,.10) 55%,transparent 100%);
  transform:skewX(-18deg);z-index:2;pointer-events:none;
  animation:sweep 9s ease-in-out infinite;
}
@keyframes sweep{
  0%{left:-45%}
  55%{left:130%}
  100%{left:130%}
}

/* 首屏标题光晕 */
.hero h1{
  text-shadow:0 0 40px rgba(212,169,92,.35),0 0 90px rgba(212,169,92,.18);
}
.hero-eyebrow{
  display:inline-block;padding:8px 22px;border-radius:30px;
  background:rgba(212,169,92,.12);border:1px solid rgba(212,169,92,.4);
  backdrop-filter:blur(6px);box-shadow:0 0 24px rgba(212,169,92,.18),inset 0 0 14px rgba(212,169,92,.08);
  animation:eyebrowGlow 3.2s ease-in-out infinite;
}
@keyframes eyebrowGlow{
  0%,100%{box-shadow:0 0 18px rgba(212,169,92,.15),inset 0 0 14px rgba(212,169,92,.06)}
  50%{box-shadow:0 0 34px rgba(212,169,92,.4),inset 0 0 18px rgba(212,169,92,.12)}
}

/* 首屏底部金色光边 */
.hero::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:3px;z-index:3;
  background:linear-gradient(90deg,transparent,rgba(212,169,92,.9),rgba(255,236,190,.5),rgba(212,169,92,.9),transparent);
  background-size:200% 100%;animation:goldLine 5s linear infinite;
}
@keyframes goldLine{
  0%{background-position:200% 0}
  100%{background-position:-200% 0}
}

/* ---------- 导航 ---------- */
.site-header.scrolled{
  border-bottom:1px solid rgba(212,169,92,.25);
  box-shadow:0 2px 24px rgba(184,134,59,.14),0 1px 0 rgba(255,255,255,.6) inset;
}
.nav a::after{
  box-shadow:0 0 10px rgba(212,169,92,.9);
}
.brand-mark{
  display:inline-block;filter:drop-shadow(0 0 10px rgba(212,169,92,.6));
  animation:brandPulse 3.6s ease-in-out infinite;
}
@keyframes brandPulse{
  0%,100%{filter:drop-shadow(0 0 6px rgba(212,169,92,.4))}
  50%{filter:drop-shadow(0 0 16px rgba(212,169,92,.85))}
}

/* ---------- 板块标题：渐变流动光 ---------- */
.sec-head h2{
  background:linear-gradient(90deg,var(--green-deep) 0%,var(--gold) 30%,var(--gold-light) 50%,var(--gold) 70%,var(--green-deep) 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  animation:gradFlow 6s ease-in-out infinite;
}
.contact .sec-head h2{background-image:linear-gradient(90deg,#fff 0%,var(--gold-light) 40%,#ffe9bd 55%,var(--gold-light) 70%,#fff 100%)}
@keyframes gradFlow{
  0%{background-position:0% 0}
  50%{background-position:100% 0}
  100%{background-position:0% 0}
}
.sec-eyebrow{
  position:relative;
}
.sec-head h2::after{
  content:"";display:block;width:76px;height:3px;margin:14px auto 0;
  border-radius:3px;
  background:linear-gradient(90deg,transparent,var(--gold-light),transparent);
  background-size:200% 100%;animation:goldLine 4s linear infinite;
}

/* ---------- 卡片：流光边框 + 悬停光晕 ---------- */
.card,.step,.plogo,.news-card,.product,.contact-box{
  position:relative;overflow:hidden;
}
.card::before,.step::before,.plogo::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:linear-gradient(135deg,rgba(212,169,92,.55),transparent 30%,transparent 65%,rgba(212,169,92,.4));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .5s;pointer-events:none;
}
.card:hover::before,.step:hover::before,.plogo:hover::before{opacity:1}
.card:hover,.step:hover,.plogo:hover,.product:hover{
  box-shadow:0 14px 40px rgba(184,134,59,.22),0 0 0 1px rgba(212,169,92,.35),0 0 34px rgba(212,169,92,.14);
}
/* 光泽扫过 */
.card::after,.product::after,.step::after,.plogo::after{
  content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;
  background:linear-gradient(100deg,transparent,rgba(255,244,214,.35),transparent);
  transform:skewX(-20deg);pointer-events:none;
  transition:left .7s ease;
}
.card:hover::after,.product:hover::after,.step:hover::after,.plogo:hover::after{left:130%}

/* ---------- 按钮流光 ---------- */
.btn{position:relative;overflow:hidden}
.btn-gold{
  background:linear-gradient(135deg,#e3b96a,var(--gold) 55%,#a97c2f);
  background-size:200% 200%;animation:btnShift 5s ease-in-out infinite;
  box-shadow:0 8px 30px rgba(184,134,59,.5),0 0 22px rgba(212,169,92,.3);
}
@keyframes btnShift{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}
.btn::after{
  content:"";position:absolute;top:0;bottom:0;width:30%;left:-45%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-20deg);transition:left .6s ease;
}
.btn:hover::after{left:130%}
.btn-dark{box-shadow:0 8px 24px rgba(51,73,47,.4),0 0 18px rgba(122,180,110,.18)}

/* ---------- 时间线节点：呼吸脉冲 ---------- */
.tl-item::before{
  box-shadow:0 0 0 2px var(--gold-light),0 0 14px rgba(212,169,92,.7);
  animation:nodePulse 3s ease-in-out infinite;
}
.tl-item:nth-child(2)::before{animation-delay:.7s}
.tl-item:nth-child(3)::before{animation-delay:1.4s}
.tl-item:nth-child(4)::before{animation-delay:2.1s}
@keyframes nodePulse{
  0%,100%{box-shadow:0 0 0 2px var(--gold-light),0 0 10px rgba(212,169,92,.5)}
  50%{box-shadow:0 0 0 4px rgba(212,169,92,.3),0 0 24px rgba(212,169,92,.95)}
}
.tl-year{text-shadow:0 0 14px rgba(212,169,92,.5)}

/* ---------- 步骤数字发光 ---------- */
.step-num{
  -webkit-text-stroke:1.5px var(--gold);
  text-shadow:0 0 18px rgba(212,169,92,.45);
}

/* ---------- 图片光晕 ---------- */
.story-media img,.origin-media img,.about-media img,.product-img img{
  box-shadow:var(--shadow),0 0 0 1px rgba(212,169,92,.18),0 0 44px rgba(212,169,92,.12);
}

/* ---------- 联系区：光晕背景 ---------- */
.contact{position:relative;overflow:hidden}
.contact::before{
  content:"";position:absolute;width:60vw;height:60vw;left:-22vw;top:-30vw;
  background:radial-gradient(circle,rgba(212,169,92,.22),transparent 65%);
  pointer-events:none;animation:orbDrift1 18s ease-in-out infinite alternate;
}
.contact::after{
  content:"";position:absolute;width:46vw;height:46vw;right:-16vw;bottom:-24vw;
  background:radial-gradient(circle,rgba(140,200,130,.16),transparent 65%);
  pointer-events:none;animation:orbDrift2 22s ease-in-out infinite alternate;
}
.contact .container{position:relative;z-index:2}
.contact-box{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(212,169,92,.28);
  box-shadow:0 18px 60px rgba(0,0,0,.35),inset 0 0 40px rgba(212,169,92,.05),0 0 30px rgba(212,169,92,.12);
}

/* ---------- 页脚金色光边 ---------- */
.site-footer{position:relative}
.site-footer::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(212,169,92,.8),transparent);
}

/* ---------- 滚动显现增强：光晕渐入 ---------- */
.reveal{transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1),filter .9s ease}
.reveal{filter:blur(6px)}
.reveal.visible{filter:blur(0)}

/* 卡片错峰显现 */
.cards .reveal:nth-child(2){transition-delay:.12s}
.cards .reveal:nth-child(3){transition-delay:.24s}
.product-grid .reveal:nth-child(2){transition-delay:.08s}
.product-grid .reveal:nth-child(3){transition-delay:.16s}
.product-grid .reveal:nth-child(4){transition-delay:.24s}
.product-grid .reveal:nth-child(5){transition-delay:.32s}
.product-grid .reveal:nth-child(6){transition-delay:.4s}
.steps .reveal:nth-child(2){transition-delay:.08s}
.steps .reveal:nth-child(3){transition-delay:.16s}
.steps .reveal:nth-child(4){transition-delay:.24s}
.steps .reveal:nth-child(5){transition-delay:.32s}

/* ---------- 数据统计：发光数字 ---------- */
.stat strong{
  text-shadow:0 0 22px rgba(212,169,92,.55);
  background:linear-gradient(90deg,var(--gold),var(--gold-light),var(--gold));
  background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  animation:gradFlow 4s ease-in-out infinite;
}

/* ---------- 科技网格装饰（区块分隔） ---------- */
.section::before{
  content:"";display:none;
}
.eco,.quality{
  position:relative;
}
.eco::before,.quality::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:
    linear-gradient(rgba(184,134,59,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(184,134,59,.05) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(ellipse at center,black 30%,transparent 75%);
  mask-image:radial-gradient(ellipse at center,black 30%,transparent 75%);
}
.eco .container,.quality .container{position:relative;z-index:2}

/* ---------- 移动端性能降级 ---------- */
@media(max-width:760px){
  .orb{filter:blur(40px);opacity:.4}
  .hero-sweep{display:none}
  .card::after,.product::after,.step::after,.plogo::after{display:none}
}
@media(prefers-reduced-motion:reduce){
  .orb,.hero-sweep,.hero::after,.brand-mark,.tl-item::before,.stat strong{animation:none !important}
  .hero h1,.sec-head h2{text-shadow:none}
}