/* ============================================================
   about.css - 站23 关于页专属样式（au 前缀 · 侧边锚点导航）
   ============================================================ */

/* 页面标题区 */
.au-top { position:relative; overflow:hidden; background:linear-gradient(150deg,#fff,var(--ib-50)); padding:60px 0 52px; text-align:center; }
.au-h1 { font-size:38px; font-weight:800; line-height:1.28; color:var(--sl-900); margin:10px 0 16px; }
.au-top-lead { font-size:15.5px; color:var(--sl-600); max-width:680px; margin:0 auto; }

/* 侧边导航 + 内容布局 */
.au-layout { display:grid; grid-template-columns:230px 1fr; gap:40px; align-items:start; }
.au-sidenav { position:sticky; top:90px; background:#fff; border:var(--ibline); border-radius:var(--ibr); padding:18px 16px; }
.au-side-title { font-size:13px; font-weight:800; color:var(--sl-500); letter-spacing:1px; margin-bottom:10px; }
.au-sidenav a { display:block; padding:9px 12px; font-size:13.5px; font-weight:600; color:var(--sl-600); border-radius:var(--ibr-sm); border-left:3px solid transparent; }
.au-sidenav a:hover { color:var(--ib-700); background:var(--ib-50); border-left-color:var(--ib-400); }

/* 内容区块 */
.au-block { margin-bottom:46px; scroll-margin-top:90px; }
.au-block:last-child { margin-bottom:0; }
.au-block > h2 { font-size:23px; margin-bottom:16px; padding-left:14px; border-left:4px solid var(--ib-500); }
.au-block > p { font-size:14.5px; color:var(--sl-600); margin-bottom:12px; }

/* 服务理念 */
.au-principles { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.au-principle {
  display:flex; align-items:flex-start; gap:16px; background:#fff; border:var(--ibline);
  border-radius:var(--ibr); padding:22px; transition:transform .18s, box-shadow .18s;
}
.au-principle:hover { transform:translateY(-4px); box-shadow:var(--ibsh); }
.au-principle-ico {
  flex-shrink:0; width:50px; height:50px; display:flex; align-items:center; justify-content:center;
  font-size:24px; background:var(--ib-50); border-radius:var(--ibr-sm);
}
.au-principle h3 { font-size:16px; margin-bottom:6px; }
.au-principle p { font-size:13px; color:var(--sl-500); }

/* 认证步骤 */
.au-cert-list { display:flex; flex-direction:column; gap:14px; }
.au-cert-list li { display:flex; gap:16px; background:#fff; border:var(--ibline); border-radius:var(--ibr); padding:20px 22px; }
.au-cert-no {
  flex-shrink:0; width:38px; height:38px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(120deg,var(--ib-500),var(--ib-700)); color:#fff;
  font-weight:800; font-size:17px; border-radius:50%;
}
.au-cert-list h3 { font-size:16px; margin-bottom:5px; }
.au-cert-list p { font-size:13px; color:var(--sl-500); }

/* 时间线（右侧布局，线在左）*/
.au-timeline { position:relative; padding-left:8px; }
.au-timeline::before { content:""; position:absolute; left:20px; top:10px; bottom:10px; width:2px; background:linear-gradient(var(--ib-300),var(--ib-200)); }
.au-tl { position:relative; padding:0 0 28px 54px; }
.au-tl:last-child { padding-bottom:0; }
.au-dot { position:absolute; left:11px; top:4px; width:20px; height:20px; border-radius:50%; background:#fff; border:4px solid var(--ib-500); box-shadow:0 0 0 4px var(--ib-100); }
.au-tl-body { background:#fff; border:var(--ibline); border-radius:var(--ibr); padding:18px 22px; }
.au-tl-body h3 { font-size:16px; margin-bottom:6px; }
.au-tl-body p { font-size:13px; color:var(--sl-500); }

/* 标签墙 */
.au-tags { display:flex; flex-wrap:wrap; gap:11px; }
.au-tags .ibtag { padding:7px 17px; font-size:13px; }

.au-alt { background:linear-gradient(180deg,var(--sl-100),var(--ib-50)); }
.au-faq { max-width:820px; margin:0 auto; }
.au-btn-on-dark { color:#fff; border-color:rgba(255,255,255,.6); }
.au-btn-on-dark:hover { color:#fff; border-color:#fff; background:rgba(255,255,255,.1); }

/* 响应式 */
@media (max-width:900px) {
  .au-layout { grid-template-columns:1fr; gap:24px; }
  .au-sidenav { position:static; display:flex; overflow-x:auto; gap:6px; padding:12px; }
  .au-side-title { display:none; }
  .au-sidenav a { white-space:nowrap; border-left:none; border-bottom:2px solid transparent; }
  .au-sidenav a:hover { border-left-color:transparent; border-bottom-color:var(--ib-400); }
  .au-principles { grid-template-columns:1fr; }
}
@media (max-width:560px) {
  .au-h1 { font-size:28px; }
}