/* =====================================================
   about.html 专属定制层 —— 严格对照 04.psd 制作
   色板：标题蓝 #144c94 / teal #34b7af / 正文 #444
         联系区 #0c1b5c / 版权条 #060d2c / 导航字 #9d9da0
   有效区域：≥1200 视口两侧各留 100px（1920 下 = 1720px）
   rem 基准：模板 html 12px / 13px@768 / 14px@992
   PSD 关键坐标（1920）：照片带 0-640 / 标题 731 / 副题 819
   创始人 893 / 视频 (136,1002) 790×447 / stats 右列 x1108
   正文 1524 / 联系区 2096-2899 / 版权条 2854
   ===================================================== */

body { background: #fff; }

/* ---- 1720px 有效区（≥1200） ---- */
@media (min-width: 1200px) {
  .about-page .container { width: auto; max-width: none; padding-left: 100px; padding-right: 100px; }
}

/* ==================== 顶部导航 ==================== */
/* PSD：logo+双行品牌 左，横向菜单+金电话圆钮+teal 在线留言 右；≥992 隐藏汉堡
   （navbar 在 main.about-page 之外，选择器不可加 .about-page 前缀） */
.navbar { display: flex; align-items: center; }
/* 汉堡模式（<1200）：logo 保持左侧、汉堡靠右（margin auto 优先于 justify-content） */
.navbar .brand { margin-right: auto; }
/* logo.png 自带图标+文字+域名，无需 brand-info */
.about-menu { margin-left: auto; }
.about-menu-list { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; }
.about-menu-list li { margin: 0 0 0 3.1rem; line-height: 1; }
.about-menu-list a {
  color: #9d9da0; font-size: 1.21rem; font-weight: 500;
  letter-spacing: .42em; padding: .6rem 0; display: inline-block;
}
.about-menu-list a:hover, .about-menu-list .active a { color: #fff; text-decoration: none; }
.about-nav-actions { align-items: center; margin-left: 3rem; }
.about-phone {
  display: flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 3.14rem; height: 3.14rem; border-radius: 50%;
  background: #f4c926; color: #fff; font-size: 1.5rem; margin-right: 2.36rem;
}
.about-phone:hover { background: #e6ba1a; color: #fff; text-decoration: none; }
.about-nav-actions .btn-teal { font-size: 1.07rem; padding: .9em 1.4em .85em; }

/* ==================== 个人简介区 ==================== */
.about-hero { position: relative; background: #fff; padding-bottom: 15.76rem; }
.about-band { height: 45.71rem; background: url(../image/about-band.jpg) top center / cover no-repeat; }
.about-hero .container { position: relative; z-index: 1; }
.about-portrait {
  position: absolute; top: 14.29rem; right: 5.42%; z-index: 2;
  width: 43.44%; max-width: 834px; height: auto; pointer-events: none;
}

.about-title { font-size: 4.4rem; font-weight: 700; color: #144c94; line-height: 1.15; margin: 6rem 0 0; }
.about-title span { color: #34b7af; }
.about-sub { font-size: 2.57rem; font-weight: 600; color: #161615; line-height: 1.45; margin: 1.04rem 0 0; }
.about-founder { font-size: 2.57rem; font-weight: 600; color: #144c94; line-height: 1.45; margin: 1.57rem 0 0; }

/* ---- 视频 + 数据行 ---- */
.about-grid { display: flex; align-items: flex-start; margin-top: 4.64rem; }
.about-left { flex: 0 0 45.93%; max-width: 45.93%; margin-left: 2.57rem; }
.about-left--full { flex: 1 1 auto; max-width: 59.5rem; }
.about-left--full .about-text { margin-top: 0; }
.video-frame { position: relative; display: block; aspect-ratio: 790 / 447; overflow: hidden; }
.video-frame img, .video-frame video { display: block; width: 100%; height: 100%; object-fit: cover; }

/* 复用 count-up.js 的 .stats-strip .stat b 选择器，中和 index 定位样式 */
.about-stats.stats-strip { position: static; left: auto; right: auto; top: auto; bottom: auto; z-index: auto; background: none; padding: 5.76rem 0 0 12.5rem; }
.about-stats { flex: 1 1 auto; }
.about-stats .stats-grid {
  display: grid; grid-template-columns: 19.5rem 17rem auto; justify-content: start;
  column-gap: 0; row-gap: 2.55rem;
}
.about-stats .stat b { font-size: 4.71rem; line-height: 1; }
.about-stats .stat span { display: block; margin-top: -.27rem; line-height: 1.3; }
.about-stats .sg-1 { grid-area: 1 / 1; }
.about-stats .sg-2 { grid-area: 1 / 2; }
.about-stats .sg-3 { grid-area: 2 / 1; }
.about-stats .sg-4 { grid-area: 2 / 2; }
.about-stats .sg-5 { grid-area: 2 / 3; }

/* ---- 正文三段（PSD 首行缩进 2em、字距 .12em；段间为空行槽位，整块高 343px） ---- */
.about-text { margin-top: 4.75rem; max-width: 59.5rem; }
.about-text p { color: #444; font-size: 1.21rem; line-height: 2; letter-spacing: .12em; text-indent: 2em; margin: 0; }
.about-text p + p { margin-top: 3.23rem; }

/* ==================== 联系方式区（复用 index .section-4 规则） ==================== */
.about-contact { background: #0c1b5c; padding: 4.4rem 0 7.4rem; }
.about-contact .qr-item figcaption { margin-top: 1rem; font-size: 1.14rem; color: rgba(255, 255, 255, .8); text-align: center; }

/* ---- 版权条入流（index 的 absolute 只适用于第四屏内） ---- */
.about-page .copy-strip { position: static; }

/* ==================== fx 逐层入场（count-up.js 提供 fx-go） ==================== */
.fx-go .fx { opacity: 1; transform: none; transition: opacity .7s ease, transform .7s ease; }
.fx-go .fx-d1 { transition-delay: .12s; }
.fx-go .fx-d2 { transition-delay: .24s; }
.fx-go .fx-d3 { transition-delay: .36s; }
.fx-go .fx-d4 { transition-delay: .48s; }
.fx-go .fx-d5 { transition-delay: .6s; }
@media (prefers-reduced-motion: reduce) {
  .fx { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ==================== 响应式 ==================== */
@media (max-width: 1599px) {
  .about-title { font-size: 3.6rem; }
  .about-sub, .about-founder { font-size: 2.1rem; }
  .about-menu-list li { margin-left: 1.4rem; }
  .about-menu-list a { font-size: 1.07rem; letter-spacing: .12em; }
  .about-nav-actions { margin-left: 3rem; }
  .about-stats .stat b { font-size: 2.7rem; }
  .about-stats .stats-grid { grid-template-columns: repeat(3, auto); column-gap: 3rem; row-gap: 2.4rem; }
}
/* 7 项菜单的中档收紧（1200-1399 单行放下） */
@media (max-width: 1399px) {
  .about-menu-list li { margin-left: 1.1rem; }
  .about-menu-list a { font-size: 1rem; letter-spacing: .06em; }
  .about-nav-actions { margin-left: 2rem; }
}
/* 汉堡菜单断点 1200：992-1199 七项横向菜单放不下，统一切全屏菜单 */
@media (max-width: 1199px) {
  .about-menu, .about-nav-actions { display: none; }
  .navbar-toggle { display: block; }
}
@media (min-width: 1200px) {
  .navbar-toggle { display: none; }
}
@media (max-width: 767px) {
  .about-page .container { padding-left: 1.7rem; padding-right: 1.7rem; }
  .about-page .navbar .navbar-toggle { margin-left: auto; }
  .about-band { height: 32rem; }
  .about-portrait { position: static; display: block; width: 78%; margin: -24rem auto 0; }
  .about-title { margin-top: 2.8rem; font-size: 3.4rem; }
  .about-sub, .about-founder { font-size: 1.8rem; }
  .about-grid { display: block; margin-top: 3.6rem; }
  .about-left, .about-left--full { max-width: none; margin-left: 0; }
  .about-stats.stats-strip { margin-top: 0; padding: 3rem 0 0; }
  .about-stats .stats-grid { grid-template-columns: 1fr 1fr; gap: 1.6rem 1rem; }
  .about-stats .sg-1, .about-stats .sg-2, .about-stats .sg-3,
  .about-stats .sg-4, .about-stats .sg-5 { grid-area: auto; }
  .about-text { margin-top: 3.2rem; max-width: none; }
  .about-text p + p { margin-top: 1.6rem; }
  .about-contact { padding: 3rem 0 4rem; }
}