:root{ --header-h: 72px; }

/* 全出血 hero（不受 container 限制） */
.yqh-hero{
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: #000;
}

.yqh-hero__viewport{
  position: relative;
  height: clamp(520px, calc(100vh - var(--header-h)), 760px);
  overflow: hidden;
  outline: none;
}

/* 轮播轨道 */
.yqh-hero__track{
  height: 100%;
  display: flex;
  transition: transform .55s ease;
  will-change: transform;
}

.yqh-hero__slide{
  position: relative;
  min-width: 100%;
  height: 100%;
}

/* ✅ 背景：cover + blur + scale（永远铺满左右） */
.yqh-hero__bg{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: blur(28px);
  transform: scale(1.22);
  opacity: .72;
}

/* ✅ 主图：完整展示（不裁切） */
.yqh-hero__main{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
}

/* 遮罩增强对比 */
.yqh-hero__mask{
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center,
    rgba(0,0,0,.10) 0%,
    rgba(0,0,0,.35) 55%,
    rgba(0,0,0,.55) 100%
  );
  z-index: 3;
}



/* 文案 */
.yqh-hero__content{
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  text-align: center;
  padding: 0 24px;
  color: #fff;
  text-shadow: 0 10px 30px rgba(0,0,0,.45);
  z-index: 5;
}

.yqh-hero__content h1{
  margin: 0 0 14px;
  font-size: clamp(28px, 3.4vw, 52px);
  font-weight: 800;
  letter-spacing: 2px;
}

.yqh-hero__content p{
  margin: 0;
  font-size: clamp(14px, 1.4vw, 20px);
  letter-spacing: 1px;
  opacity: .96;
}

/* 只有左右箭头 */
.yqh-hero__arrow{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 60px;
  height: 60px;
  border: none;
  background: transparent;
  cursor: pointer;
  z-index: 6;
  opacity: .92;
}

.yqh-hero__arrow--prev{ left: 28px; }
.yqh-hero__arrow--next{ right: 28px; }

.yqh-hero__arrow::before{
  content:"";
  display:block;
  width: 14px;
  height: 14px;
  border-top: 3px solid rgba(255,255,255,.95);
  border-right: 3px solid rgba(255,255,255,.95);
  margin: auto;
}

.yqh-hero__arrow--prev::before{ transform: rotate(-135deg); }
.yqh-hero__arrow--next::before{ transform: rotate(45deg); }

.yqh-hero__arrow:hover{ opacity: 1; }

/* 手机：竖图完整显示（不裁剪） */
@media (max-width: 768px){
  /* 1) 用 svh 更稳定，避免地址栏导致的vh跳动 */
  .yqh-hero__viewport{
    height: 100svh;      /* 推荐：比70vh更高，能容纳竖图 */
    min-height: 700px;  /* 兜底：避免小屏太矮 */
    max-height: 920px;  /* 兜底：避免超高屏太高 */
  }

  /* 2) 关键：让图完整显示，不裁剪 */
  .yqh-hero__viewport img,
  .yqh-hero__img{
    width: 100%;
    height: 100%;
    object-fit: contain;        /* ✅完整显示 */
    object-position: center;    /* 居中 */
    background: #000;           /* 黑底填充空白区域（可换成你的深色） */
    object-fit: cover;     /* ✅铺满屏幕，不黑边 */
    display: block;
  }

  .yqh-hero__watermark{
    top: 12%;
    opacity: .18;
  }
}