/* ==========================================================================
   联系我们页 — hero 横幅内联化 + 信封图标可点击链接
   （仅 contact.html 加载，避免影响其它页面的 background 横幅）
   ========================================================================== */

/* 内联 SVG 版横幅：背景色兜底，覆盖掉 page.css 里的背景图 */
.page-hero.hero-banner-inline {
  background: #155fa8;
}

.hero-banner-svg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  display: block;
}

/* 装饰性遮罩层不能挡住 SVG 里链接的点击 */
.page-hero::before {
  pointer-events: none;
  z-index: 1;
}

.page-hero-content {
  z-index: 2;
}

/* ---------------------------------------------------------------- 信封链接 */
.hero-envelope-link {
  cursor: pointer;
}

.hero-envelope-link .env-card,
.hero-envelope-link .env-label {
  transition: opacity 0.25s ease;
}

.hero-envelope-link .env-ring {
  opacity: 0;
  transition: opacity 0.25s ease;
}

.hero-envelope-link:hover .env-card,
.hero-envelope-link:focus-visible .env-card {
  opacity: 1;
}

.hero-envelope-link:hover .env-label,
.hero-envelope-link:focus-visible .env-label {
  opacity: 1;
}

.hero-envelope-link:hover .env-ring,
.hero-envelope-link:focus-visible .env-ring {
  opacity: 0.55;
}

.hero-envelope-link:focus {
  outline: none;
}

.hero-envelope-link:focus-visible .env-ring {
  opacity: 1;
  stroke: #f5a623;
}

/* ---------------------------------------------------------------- 响应式
   移动端 .page-hero 高度降到 220px，SVG 按 slice 缩放后整体只剩约 0.41 倍，
   17px 的标签在手机上不足 7px、完全读不清，因此按用户单位放大。
   （inline SVG 里的 font-size 用 viewBox 用户单位，会被 CSS 媒体查询正常命中） */
@media (max-width: 768px) {
  .hero-envelope-link .env-label {
    font-size: 30px;
  }
}