/* Hero 背景宣传视频 —— 叠加在现有背景图之上，视频失败时自动降级 */
.hero-video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  z-index:0;
  pointer-events:none;
  opacity:0;
  transition:opacity .9s ease;
}
.hero-video.is-ready{ opacity:1; }

/* 视频上的半透明遮罩，保证标题/按钮文字清晰可读（红/绿主题都压得住） */
.hero::after{
  content:"";
  position:absolute; inset:0;
  z-index:1;
  background:linear-gradient(180deg, rgba(7,28,19,.50) 0%, rgba(7,28,19,.66) 55%, rgba(7,28,19,.74) 100%);
  pointer-events:none;
}
/* 让 hero 内的内容（标题/按钮）始终在视频与遮罩之上 */
.hero > *:not(.hero-video){ position:relative; z-index:2; }

/* 移动端：视频更暗一点，防止文字被画面抢 */
@media (max-width:760px){
  .hero::after{ background:linear-gradient(180deg, rgba(7,28,19,.60), rgba(7,28,19,.80)); }
}