@charset "utf-8";
/* ===========================================================
   单页与联系页独享样式（public/css/page-page.css）
   单页头 / 介绍排版 / 里程碑 / 联系卡片 / 官方入口
   =========================================================== */

.ph {
  padding: 26px 0 40px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFD 100%);
}
.ph .eb {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--teal-d);
  display: block;
  margin-bottom: 12px;
}
.ph h1 {
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.24;
  font-weight: 800;
  letter-spacing: -.015em;
  color: var(--ink);
}
.ph .lead {
  font-size: 15px;
  line-height: 1.95;
  color: var(--mut);
  margin-top: 16px;
  max-width: 780px;
}

/* 公司介绍 */
.about-g {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 0;
  gap: 0;
}
.about-txt p { font-size: 15px; line-height: 1.95; color: var(--ink2); }
.about-txt p + p { margin-top: 14px; }
.about-fig {
  border: 1px solid var(--line3);
  overflow: hidden;
  margin-top: 26px;
  background: var(--panel2);
}
.about-fig img { width: 100%; height: 100%; object-fit: cover; display: block; }

.facts {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0;
  gap: 0;
  border-top: 1px solid var(--line3);
  border-left: 1px solid var(--line3);
  margin-top: 26px;
}
.facts div {
  border-right: 1px solid var(--line3);
  border-bottom: 1px solid var(--line3);
  padding: 16px 15px;
  background: #fff;
}
.facts b {
  font-family: var(--serif);
  font-size: 24px;
  line-height: 1.2;
  color: var(--navy-d);
  display: block;
}
.facts b small { font-size: 13px; font-family: var(--sans); }
.facts span { font-size: 11.5px; color: var(--mut); display: block; margin-top: 4px; }

/* 里程碑 */
.mile { border-top: 1px solid var(--line3); }
.mi {
  display: grid;
  grid-template-columns: 58px 1fr;
  grid-gap: 0;
  gap: 0;
  padding: 16px 0;
  border-bottom: 1px solid var(--line2);
}
.mi b {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--navy-d);
  letter-spacing: .04em;
}
.mi p { font-size: 13.5px; line-height: 1.9; color: var(--mut); }
.mi p strong { color: var(--ink); }

/* 联系卡片 */
.ct {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 0;
  gap: 0;
  border-top: 1px solid var(--line3);
  border-left: 1px solid var(--line3);
}
.ct-i {
  border-right: 1px solid var(--line3);
  border-bottom: 1px solid var(--line3);
  padding: 20px 18px;
  background: #fff;
}
.ct-i b {
  font-size: 11px;
  letter-spacing: .1em;
  color: var(--teal-d);
  display: block;
  margin-bottom: 6px;
}
.ct-i h3 { font-size: 16px; font-weight: 700; color: var(--ink); line-height: 1.5; }
.ct-i p {
  font-size: 13.5px;
  line-height: 1.9;
  color: var(--mut);
  margin-top: 6px;
}
.ct-i strong {
  display: block;
  font-family: var(--mono);
  font-size: 18px;
  color: var(--navy-d);
  margin-top: 8px;
  letter-spacing: .02em;
}
.ct-i em { font-style: normal; font-size: 12px; color: var(--mut); }

.ct-qr {
  display: flex;
  align-items: center;
  border: 1px solid var(--line3);
  background: #fff;
  padding: 18px;
  margin-top: 22px;
}
.ct-qr .qr-b { width: 110px; height: 110px; }
.ct-qr .qr-t { margin-left: 16px; }
.ct-qr .qr-t b { font-size: 14px; color: var(--navy-d); display: block; margin-bottom: 4px; }
.ct-qr .qr-t p { font-size: 12.5px; line-height: 1.8; color: var(--mut); }

/* 官方入口（单页版本） */
.offic {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 0;
  gap: 0;
  border-top: 1px solid var(--line3);
  border-left: 1px solid var(--line3);
}
.offic a {
  border-right: 1px solid var(--line3);
  border-bottom: 1px solid var(--line3);
  padding: 15px 15px;
  background: #fff;
  font-size: 13.5px;
  color: var(--ink2);
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
.offic a i { font-style: normal; color: var(--teal-d); font-size: 12px; }

@media (min-width: 600px) {
  .facts { grid-template-columns: repeat(4, 1fr); }
  .ct { grid-template-columns: repeat(2, 1fr); }
  .offic { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 768px) {
  .about-g { grid-template-columns: 1.25fr .75fr; grid-gap: 0; gap: 40px; align-items: start; }
  .about-fig { margin-top: 0; min-height: 360px; }
  .ct { grid-template-columns: repeat(4, 1fr); }
  .offic { grid-template-columns: repeat(3, 1fr); }
}

@media (hover: hover) and (pointer: fine) {
  .offic a:hover { background: var(--panel); color: var(--navy-d); }
  .ct-i:hover { background: #FCFDFF; }
}

/* === 栏目页动效（共用） === */
@keyframes secUp {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: none; }
}
@keyframes ebDash {
  0%, 100% { transform: scaleX(.35); opacity: .45; }
  50%      { transform: scaleX(1);   opacity: 1; }
}
@keyframes whoDot {
  0%, 100% { opacity: .35; transform: scale(.85); }
  50%      { opacity: 1;   transform: scale(1); }
}

/* 打开页面：板块依次入场 */
main > section { animation: secUp .78s cubic-bezier(.22, .61, .36, 1) both; }
main > section:nth-of-type(1) { animation-delay: .04s; }
main > section:nth-of-type(2) { animation-delay: .12s; }
main > section:nth-of-type(3) { animation-delay: .20s; }
main > section:nth-of-type(4) { animation-delay: .28s; }
main > section:nth-of-type(5) { animation-delay: .36s; }
main > section:nth-of-type(6) { animation-delay: .44s; }
main > section:nth-of-type(n+7) { animation-delay: .50s; }

/* 循环：栏目小标后的短横线呼吸 + 圆点脉冲 */
.sec .sh-l .eb {
  position: relative;
  display: inline-block;
  padding-bottom: 9px;
}
.sec .sh-l .eb::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 26px;
  height: 2px;
  background: var(--teal);
  transform-origin: left center;
  animation: ebDash 3.6s ease-in-out infinite;
}

/* 常见问题答案：查看完整解答 */
.fa-more {
  display: block;
  width: max-content;
  max-width: 100%;
  margin-top: 10px;
  padding-bottom: 1px;
  border-bottom: 1px solid rgba(47, 179, 164, .38);
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: .04em;
  color: var(--teal-d);
  transition: border-color .25s ease, color .25s ease;
}
.fa-more:hover { color: var(--navy); border-color: var(--navy); }

/* 循环：执行方小标签前的小圆点 */
.who::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--teal);
  vertical-align: 1px;
  animation: whoDot 2.8s ease-in-out infinite;
}

@keyframes sqPulse {
  0%, 100% { border-color: var(--line3); }
  50%      { border-color: rgba(47, 179, 164, .45); }
}
@keyframes numDash {
  0%, 100% { transform: scaleX(.45); opacity: .5; }
  50%      { transform: scaleX(1);   opacity: 1; }
}

/* 循环：常见问题右侧 ＋/－ 方框呼吸 */
.faq summary::after { animation: sqPulse 3.2s ease-in-out infinite; }
.faq details[open] summary::after { animation: none; }

/* 循环：办理流程编号下方的短横线呼吸 */
.flow-n::after {
  transform-origin: left center;
  animation: numDash 3.8s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  main > section { animation: none; }
  .sec .sh-l .eb::after,
  .who::before,
  .faq summary::after,
  .flow-n::after { animation: none; }
}