/* ZfLayout normally reveals these blocks with its runtime. The local app owns
   the same reveal behavior, so content remains visible without that dependency. */
.zf-layout-invisible.zf-revealed {
  visibility: visible;
}

@media (prefers-reduced-motion: reduce) {
  .animated,
  .zf-layout-animation-grow {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}

.zf-local-article .zf-article__section > :first-child {
  margin-top: 0;
}

@media (max-width: 1024px) and (min-width: 768px) {
  .zf-header-nav-menu__breakpoint-tablet .zf-header-nav-menu__toggle {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .zf-header-nav-menu__breakpoint-tablet .zf-header-nav-menu__toggle + nav {
    display: none !important;
  }

  .zf-header-nav-menu__breakpoint-tablet .zf-header-nav-menu__toggle + nav.menu-is-active {
    display: block !important;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 9999;
    background: #fff;
  }

  .zf-header-nav-menu__breakpoint-tablet nav.menu-is-active > .zf-header-nav-menu {
    display: block;
  }

  .zf-header-nav-menu__breakpoint-tablet .menu-item-has-children > .sub-menu {
    display: none;
    position: static !important;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .zf-header-nav-menu__breakpoint-tablet .menu-item-has-children.sub-menu-active > .sub-menu {
    display: block;
  }
}

/* Homepage parity: the media-library originals are not the derivatives ZfLayout
   rendered, so every ZfLayout crop referenced by the captured pages is pinned to
   an exact local copy in scripts/prepare-snapshots.mjs. That keeps the original
   stylesheet in charge of image geometry — no forced width/height belongs here. */

/* 内页的页脚缺少首页同一电话图标的居中规则。仅修正桌面页脚这一栏。 */
@media (min-width: 768px) {
  body:not(.home) .zf-layout-element-7867c6c6 .zf-layout-element-77c2fde {
    text-align: center;
  }
}

/* ---------------------------------------------------------------------------
   统一的悬停反馈
   ---------------------------------------------------------------------------
   全站可点的卡片、徽标、折叠行都要给出同一种「这里可以点」的反馈：
   轻微上浮 + 描边转品牌金 + 底色微暖 + 投影加深。
   基准取自已验证过的联系卡片（.zf-contact--link）。此前只有联系卡片有这套变化，
   内容卡片、地图徽标和 FAQ 折叠行各缺一块，悬停时完全没有回应。
   注意：本文件加载顺序在页面内联样式之后，因此同优先级的规则以这里为准。 */

.zf-contact--link {
  position: relative;
  display: block;
  cursor: pointer;
  transition: transform 180ms ease, border-color 180ms ease,
    box-shadow 180ms ease, background-color 180ms ease;
}

.zf-contact--link:hover,
.zf-card--link:hover,
.zf-badge:hover {
  transform: translateY(-4px);
  border-color: var(--gold);
  background-color: #fffaf4;
  box-shadow: 0 14px 30px rgba(20, 54, 48, 0.16);
}

.zf-contact--link:hover .zf-contact__v {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 卡片原有的图片放大与「更多」箭头位移保持不变，叠加在上浮之上。 */

/* 地图徽标是行内元素，transform 对非替换行内元素无效，先转成行内块并补过渡。 */
.zf-badge {
  display: inline-block;
  transition: transform 180ms ease, border-color 180ms ease,
    box-shadow 180ms ease, background-color 180ms ease;
}

/* FAQ 折叠行是整行条目，上浮会让整列跳位，所以只做底色与文字色的反馈。 */
.zf-faq summary {
  transition: background-color 180ms ease, color 180ms ease;
}

.zf-faq summary:hover {
  background-color: #fffaf4;
  color: var(--navy3);
}

.zf-contact--link:focus-visible,
.zf-card--link:focus-visible,
.zf-badge:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
  transform: translateY(-2px);
  border-color: var(--gold);
  box-shadow: 0 12px 26px rgba(20, 54, 48, 0.14);
}

@media (prefers-reduced-motion: reduce) {
  .zf-contact--link,
  .zf-card--link,
  .zf-badge,
  .zf-faq summary {
    transition: border-color 180ms ease, box-shadow 180ms ease,
      background-color 180ms ease, color 180ms ease;
  }

  .zf-contact--link:hover,
  .zf-contact--link:focus-visible,
  .zf-card--link:hover,
  .zf-card--link:focus-visible,
  .zf-badge:hover,
  .zf-badge:focus-visible {
    transform: none;
  }
}