/* mall 横幅统一升级样式（参考 banner 风格） */

:root{
  --mall-banner-h: 300px;
  --mall-banner-h-m: 270px;
  --mall-banner-img: url("../image/banner-mall-hero-clean.jpg");
}

.page-banner.banner-upgrade{
  min-height: var(--mall-banner-h);
  background:
    radial-gradient(circle at 76% 34%, rgba(255,255,255,.18), transparent 44%),
    radial-gradient(circle at 18% 68%, rgba(255,214,96,.14), transparent 52%),
    linear-gradient(90deg, rgba(255,112,20,.82) 0%, rgba(255,146,36,.52) 44%, rgba(255,214,120,.10) 100%),
    var(--mall-banner-img) center/cover no-repeat !important;
}

/* 覆盖右下角可能出现的水印区域：做一层柔和遮罩 */
.page-banner.banner-upgrade::after{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  width:min(42vw, 520px);
  height:min(42vw, 360px);
  pointer-events:none;
  background:
    radial-gradient(circle at 80% 80%, rgba(255,120,24,.55), transparent 62%),
    linear-gradient(135deg, rgba(255,120,24,.00) 0%, rgba(255,120,24,.36) 68%, rgba(255,120,24,.52) 100%);
  mix-blend-mode:multiply;
}

.page-banner.banner-upgrade .page-banner-inner{
  min-height: var(--mall-banner-h);
  padding: 0;
}

.page-banner.banner-upgrade .page-banner-copy{
  max-width: 760px;
  text-shadow: 0 18px 42px rgba(114,40,10,.22);
}

.page-banner.banner-upgrade .page-banner-copy p{
  max-width: 860px;
}

@media (max-width: 900px){
  .page-banner.banner-upgrade{
    min-height: var(--mall-banner-h-m);
    background-position: 70% center !important;
  }

  .page-banner.banner-upgrade .page-banner-inner{
    min-height: var(--mall-banner-h-m);
  }

  .page-banner.banner-upgrade .page-banner-copy{
    max-width: 100%;
  }
}